diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index e86c2afe3..8f3c8a6ce 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -26,7 +26,7 @@ jobs:
             path: 'node-red.github.io'
       - uses: actions/setup-node@v1
         with:
-            node-version: '12'
+            node-version: '16'
       - run: node ./node-red/.github/scripts/update-node-red-docker.js
       - name: Create Docker Pull Request
         uses: peter-evans/create-pull-request@v2
diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml
index dde581a01..0db909da6 100644
--- a/.github/workflows/tests.yml
+++ b/.github/workflows/tests.yml
@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [12, 14, 16]
+        node-version: [14, 16]
     steps:
     - uses: actions/checkout@v2
     - name: Use Node.js ${{ matrix.node-version }}
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 44dffa5be..6c6f52aeb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,160 @@
+#### 3.0.0: Milestone Release
+
+Editor
+
+ - Use theme page and header values if settings.js values are not present (#3767) @Steve-Mcl
+ - Focus editor for undo after some actions in menu (#3759) @kazuhitoyokoi
+ - Ensure node icon shade has properly rounded corners (#3763) @knolleary
+ - Fix storing subflow credential type when input has multiple types (#3762) @knolleary
+ - Ensure global-config and flow-config have info in the hierarchy popover (#3752) @Steve-Mcl
+ - Include dirty state in history event (#3748) @Steve-Mcl
+ - Fix display direction of context sub-menu (#3746) @knolleary
+ - Fix clear pinned paths of debug sidebar menu (#3745) @HiroyasuNishiyama
+ - prevent exception generating tooltip for deleted nodes (#3742) @Steve-Mcl
+ - Fix context menu issues ready for v3 beta.5 (#3741) @Steve-Mcl
+ - Do not generate new node-ids when pasting a cut flow (#3729) @knolleary
+ - Fix to prevent node from moving out of workspace (#3731) @HiroyasuNishiyama
+ - Don't let themes change disabled config node background color (#3736) @bonanitech
+ - Move colors left behind in #3692 to CSS variables (#3737) @bonanitech
+ - Fix handling of global debug message (#3733) @HiroyasuNishiyama
+ - Fix label overflow @ config-node palette (#3730) @ralphwetzel
+ - Fix defaulting to monaco if settings does not contain codeEditor (#3732) @knolleary
+ - Disable keyboard shortcut mapping when showing Edit[..]Dialog (#3700) @ralphwetzel
+ - Update add-junction menu to work in more cases (#3727) @knolleary
+ - Ensure importMap is not null when using import UI (#3723) @Steve-Mcl
+ - Add Japanese translations for v3.0-beta.4 (#3724) @kazuhitoyokoi
+ - Fix "split with" on virtual links (#3766) @Steve-Mcl
+
+Runtime
+
+ - Do not remove unknown credentials of Subflow Modules (#3728) @knolleary
+ - Add missing entries from beta.4 changelog (#3721) @knolleary
+
+Nodes
+
+ - Change: Fix change node, not handling from field properly when using context (#3754) @Fadoli
+ - Link Call: Fix linkcall registry bugs (#3751) @Steve-Mcl
+ - WebSocket: Fix close timeout of websocket node (#3734) @HiroyasuNishiyama
+
+#### 3.0.0-beta.4: Beta Release
+
+Editor
+
+ - Move all colours to CSS variables (#3692) @bonanitech
+ - Fix clicking on node in workspace to hide context menu (#3696) @knolleary
+ - Fix credential type input item of subflow template (#3703) @HiroyasuNishiyama
+ - Add option flag `reimport` to `importNodes` (#3718) @Steve-Mcl
+ - Update german translation (#3691) @Dennis14e
+ - List welcome tours in help sidebar (#3717) @knolleary
+ - Ensure 'hidden flow' count doesn't include subflows (#3715) @knolleary
+ - Fix Chinese translate (#3706) @hotlong
+ - Fix use default button for node icon (#3714) @kazuhitoyokoi
+ - Fix select boxes vertical alignment (#3698) @bonanitech
+ - Ensure workspace clean after undoing dropped node (#3708) @Steve-Mcl
+ - Use solid colour as config node icon background to hide text overflow (#3710) @Steve-Mcl
+ - Increase quick-add height to reveal 2 most recent entries (#3711) @Steve-Mcl
+ - Set default editor to monaco in absence of user preference (#3702) @knolleary
+ - Add Japanese translations for v3.0-beta.3 (#3688) @kazuhitoyokoi
+ - Fix handling of spacebar inside JSON visual editor (#3687) @knolleary
+ - Fix menu padding to handle both icons and submenus (#3686) @knolleary
+ - Include scroll offset when positioning quick-add dialog (#3685) @knolleary
+
+Runtime
+
+ - Allow flows to be stopped and started manually (#3719) @knolleary
+ - Import default export if node is a transpiled es module (#3669) @dschmidt
+ - Leave Monaco theme commented out by default (#3704) @bonanitech
+
+Nodes
+
+ - CSV: Fix CSV node to handle when outputting text fields (#3716) @dceejay
+ - Delay: Fix delay rate limit last timing when empty (#3709) @dceejay
+ - Link: Ensure link-call cache is updated when link-in is modified (#3695) @Steve-Mcl
+ - Join: Join node in reduce mode doesn't keep existing msg properties (#3670) @dceejay
+ - Template: Add support for evalulating {{env.<var>}} within a template node (#3690) @cow0w
+
+#### 3.0.0-beta.3: Beta Release
+
+Editor
+
+ - Add Right-Click content menu (#3678) @knolleary
+ - Fix disable junction (#3671) @HiroyasuNishiyama
+ - Add Japanese translations for v2.2.3 (#3672) @kazuhitoyokoi
+ - Reset mouse state when switching tabs (#3643) @knolleary
+ - Fix uncorrect fix of junction to subflow conversion (#3666) @HiroyasuNishiyama
+ - Fix undoing junction to subflow (#3653) @HiroyasuNishiyama
+ - Fix conversion of junction to subflow (#3652) @HiroyasuNishiyama
+ - Fix to include junction to exported nodes (#3650) @HiroyasuNishiyama
+ - Fix z-index value for shade to cover nodes in palette (#3649) @kazuhitoyokoi
+ - Fix to extend escaped subflow category characters (#3647) @HiroyasuNishiyama
+ - Fix to sanitize tab name (#3646) @HiroyasuNishiyama
+ - Fix selector placement (#3644) @bonanitech
+ - Add Japanese translations for v3.0-beta.2 (#3622) @kazuhitoyokoi
+ - Fix new folder menu of save to library dialog (#3633) @HiroyasuNishiyama
+ - Fix layer of palette node (#3638) @HiroyasuNishiyama
+ - Fix to place a node dragged from palette within the workspace (#3637) @HiroyasuNishiyama
+ - Fix typo in CSS (#3628) @bonanitech
+ - Use the correct variable for the gutter text color (#3615) @bonanitech
+
+
+Runtime
+
+ - Support loading node modules from `nodesdir` (#3676) @Steve-Mcl
+ - fix buffer parse error message of evaluateNodeProperty (#3624) @HiroyasuNishiyama
+
+Nodes
+
+ - File: Further simplify file node filename entry UX (v3) (#3677) @Steve-Mcl
+ - Function: Fix initial cursor position of init/finalize tab of function node (#3674) @HiroyasuNishiyama
+ - Function: Fix ESM module loading in Function node (#3645) @knolleary
+ - Inject: Fix JSONata evaluation of inject button (#3632) @HiroyasuNishiyama
+ - TCP: Dont delete TCP socket twice (#3630) @Steve-Mcl
+ - MQTT Node: define noproxy variable (#3626) @Steve-Mcl
+ - Debug: i18n debug sidebar node label (#3623) @HiroyasuNishiyama
+
+#### 3.0.0-beta.2: Beta Release
+
+**Migration from 2.x**
+
+ - The 'slice wires' action has changed from Ctrl-RightMouseButton to Alt-LeftMouseButton
+
+Editor
+
+ - Rework Junctions to be more node like in their event handling (#3607) @knolleary
+ - Change slicing / slice-junction operations over to mouse button 0 (Left Mouse Button) (#3609) @Steve-Mcl
+ - Do not slice-junction link node wires (#3608) @knolleary
+ - Handle many-to-one slicing of wires (#3604) @knolleary
+ - Ensure ACE worker options are set (#3611) @Steve-Mcl
+ - Remove duplicate history add of ungroup event (#3605) @knolleary
+ - use text width instead of number of characters for deciding select fi… (#3603) @HiroyasuNishiyama
+ - Update Japanese info of link call node reflecting update of English info (#3600) @HiroyasuNishiyama
+ - Fix typedInput label not visible on themes (#3580) @bonanitech
+ - Fix project switching when junctions are present (#3595) @Steve-Mcl
+ - Fix junction: when wiring from a regular nodes INPUT, backwards to a junction (#3591) @Steve-Mcl
+ - Fix error initialising flow tab editor (#3585) @Steve-Mcl
+ - Add Japanese translations for v3.0-beta.1 (#3576) @kazuhitoyokoi
+ - Fix image paths where `red/image/typedInput/XXXX.png` should be `red/image/typedInput/XXXX.svg` (#3592) @kazuhitoyokoi
+ - Fix browser console error Uncaught TypeError when searching certain terms (#3584) @Steve-Mcl
+
+Runtime
+
+ - fix error on system-info action (#3589) @HiroyasuNishiyama
+
+Nodes
+
+ - I18n switch rule selector (#3602) @HiroyasuNishiyama
+ - Handle removal of event handlers to allow mqtt client.end() to work (#3594) @PhilDay-CT
+ - update link-call node info according to current behavior (#3597) @HiroyasuNishiyama
+
+
 #### 3.0.0-beta.1: Beta Release
 
+**Migration from 2.x**
+
+ - Node-RED now requires Node.js 14.x or later.
+ - New installs of Node-RED will default to the monaco editor.
+
+
 Editor
 
  - Add Junctions (#3462) @knolleary
@@ -68,528 +223,6 @@ Nodes
  - Watch: Update Watch node to use node-watch module (#3559 #3569) @knolleary
  - WebSocket: call done after ws disconnects (#3531) @Steve-Mcl
 
-
-#### 2.2.2: Maintenance Release
-
-Nodes
-
- - Fix "close timed out" error when performing full deploy or modifying broker node. (#3451) @Steve-Mcl
-
-
-#### 2.2.1: Maintenance Release
-
-Editor
-
- - Handle mixed-cased filter terms in keyboard shortcut dialog (#3444) @knolleary
- - Prevent duplicate links being added between nodes (#3442) @knolleary
- - Fix to hide tooltip after removing subflow tab (#3391) @HiroyasuNishiyama
- - Fix node validation to be applied to config node (#3397) @HiroyasuNishiyama
- - Fix: Dont add wires to undo buffer twice (#3437) @Steve-Mcl
-
-Runtime
-
- - Improve module location parsing (of stack info) when adding hook (#3447) @Steve-Mcl
- - Fix substitution of NR_NODE_PATH (#3445) @HiroyasuNishiyama
- - Remove console.log when ignoring disabled module (#3439) @knolleary
- - Improve "Unexpected Node Error" logging (#3446) @Steve-Mcl
-
-Nodes
-
- - Debug: Fix no-prototype-builtins bug in debug node and utils (#3394) @Alkarex
- - Delay: Fix Japanese message of delay node (#3434)
- - Allow nbRateUnits to be undefined when validating (#3443) @knolleary
- - Coding help for recently added node-red Predefined Environment Variables (#3440) @Steve-Mcl
-
-
-#### 2.2.0: Milestone Release
-
-Editor
-
- - Add editorTheme.tours property to default settings file (#3375) @knolleary
- - Remember Zoom level and Sidebar tab selection between sessions (#3361) @knolleary
- - Fix timing issue when merging background changes fixes #3364 (#3373) @Steve-Mcl
- - Use a nodes palette label in help tree (#3372) @Steve-Mcl
- - Subflow: Add labels to OUTPUT nodes (#3352) @ralphwetzel
- - Fix vertical align subflow port (#3370) @knolleary
- - Make actions list i18n ready and Japanese translation (#3359) @HiroyasuNishiyama
- - Update tour for 2.2.0 (#3378) @knolleary
- - Include paletteLabel when building search index (#3380) @Steve-Mcl
- - Fix opening/closing subflow template not to make subflow changed (#3382) @HiroyasuNishiyama
- - Add Japanese translations for v2.2.0 (#3353, #3381) @kazuhitoyokoi
-
-Runtime
-
- - Add support for accessing node id & name as environment variable (#3356) @HiroyasuNishiyama
- - Clear context contents when switching projects (#3243) @knolleary
-
-Nodes
-
- - MQTT: reject invalid topics (#3374) @Steve-Mcl
- - Function: Expose node.path property (#3371) @knolleary
- - Function: Update `node` declarations in func.d.ts (#3377) @Steve-Mcl
-
-#### 2.2.0-beta.1: Beta Release
-
-Editor
-
- - Add search history to main search box (#3262) @knolleary
- - Check availability of type of config node on deploy (#3304) @k-toumura
- - Add wire-slice mode to delete wires with Ctrl-RHClick-Drag (#3340) @knolleary
- - Wiring keyboard shortcuts (#3288) @knolleary
- - Snap nodes on grid using either edge as reference (#3289) @knolleary
- - Detach node action (#3338) @knolleary
- - Highlight links when selecting nodes (#3323) @knolleary
- - Allow multiple links to be selected by ctrl-click (#3294) @knolleary
-
-Nodes
-
- - JSON: Let JSON node attempt to parse buffer if it contains a valid string (#3296) @dceejay
- - Remove use of verbose flag in core nodes - and use node.debug level instead (#3300) @dceejay
- - TCP: Add TLS option to tcp client nodes (#3307) @dceejay
- - WebSocket: Implemented support for Websocket Subprotocols in WS Client Node. (#3333) @tobiasoort
-
-#### 2.1.6: Maintenance Release
-
-Editor
-
- - Revert copy-text change and apply alternative fix (#3363) @knolleary
- - Update marked to latest (#3362) @knolleary
- - fix to make start of property error tooltip messages aligned (#3358) @HiroyasuNishiyama
-
-Nodes
-
- - Inject: fix JSON propety validation of inject node (#3349) @HiroyasuNishiyama
- - Delay: fix unit value validation of delay node (#3351) @HiroyasuNishiyama
-
-#### 2.1.5: Maintenance Release
-
-Runtime
-
- - Handle reporting error location when stack is truncated (#3346) @knolleary
- - Initialize passport when only adminAuth.tokens is set (#3343) @knolleary
- - Add log logging (#3342) @knolleary
-
-Editor
-
- - Fix copy buttons on the debug window (another method) (#3331) @kazuhitoyokoi
- - Add Japanese translations for hidden flow (#3302) @kazuhitoyokoi
- - Improve jsonata legacy mode detection regex (#3345) @knolleary
- - Fix generating flow name with incrementing number (#3347) @knolleary
- - resume focus after import/export dialog close (#3337) @HiroyasuNishiyama
- - Fix findPreviousVisibleTab action (#3321) @knolleary
- - Fix storing hidden tab state when not hidden via action (#3312) @knolleary
- - Avoid adding empty env properties to tabs/groups (#3311) @knolleary
- - Fix hide icon in tour guide (#3301) @kazuhitoyokoi
-
-Nodes
-
- - File: Update file node examples according to node name change (#3335) @HiroyasuNishiyama
- - Filter (RBE): Fix for filter node narrrowbandEq mode start condition failure (#3339) @dceejay
- - Function: Prevent function scrollbar from obscuring expand button (#3348) @knolleary
- - Function: load extralibs when expanding monaco. fixes #3319 (#3334) @Steve-Mcl
- - Function: Update Function to use correct api to access env vars (#3310) @knolleary
- - HTTP Request: Fix basic auth with empty username or password (#3325) @hardillb
- - Inject: Fix incorrect clearing of blank payload property in Inject node (#3322) @knolleary
- - Link Call: add link call example (#3336) @HiroyasuNishiyama
- - WebSocket: Only setup ws client heartbeat once it is connected (#3344) @knolleary
- - Update Japanese translations in node help (#3332) @kazuhitoyokoi
-
-#### 2.1.4: Maintenance Release
-
-Runtime
-
- - fix env var access using $parent for groups (#3278) @HiroyasuNishiyama
- - Add proper error handling for 404 errors when serving debug files (#3277) @knolleary
- - Add Japanese translations for Node-RED v2.1.0-beta.1 (#3179) @kazuhitoyokoi
- - Include full user object on login audit events (#3269) @knolleary
- - Remove styling from de locale files (#3237) @knolleary
-
-Editor
-
- - Change tab hide button icon to an eye and add search option (#3282) @knolleary
- - Fix i18n handling of namespaces with spaces in (#3281) @knolleary
- - Trigger change event when autoComplete fills in input (#3280) @knolleary
- - Apply CN i18n fix (#3279) @knolleary
- - fix select menu label of config node to use paletteLabel (#3273) @HiroyasuNishiyama
- - fix removed tab not to cause node conflict (#3275) @HiroyasuNishiyama
- - Group diff fix (#3239) @knolleary
- - Only toggle disabled workspace flag if on activeWorkspace (#3252) @knolleary
- - Do not show status for disabled nodes (#3253) @knolleary
- - Set dimension value for tour guide (#3265) @kazuhitoyokoi
- - Avoid redundant initialisation of TypedInput type (#3263) @knolleary
- - Don't let themes change flow port label color (#3270) @bonanitech
- - Fix treeList gutter calculation to handle floating gutters (#3238) @knolleary
-
-Nodes
-
-- Debug: Handle RegExp types in Debug sidebar (#3251) @knolleary
-- Delay: fix 2nd output when in rate limit per topic modes (#3261) @dceejay
-- Link: fix to show link target when selected (#3267) @HiroyasuNishiyama
-- Inject: Do not modify inject node props in oneditprepare (#3242) @knolleary
-- HTTP Request: HTTP Basic Auth should always add : between username and password even if empty (#3236) @hardillb
-
-#### 2.1.3: Maintenance Release
-
-Runtime
-
- - Update gen-publish script to update 'next' tag for main releases
- - Add environment variable to enable/disable tours (#3221) @hardillb
- - Fix loading non-default language files leaving runtime in wrong locale (#3225) @knolleary
-
-Editor
-
- - Refresh editor settings whenever a node is added or enabled (#3227) @knolleary
- - Revert spinner css change that made it shrink in some cases (#3229) @knolleary
- - Fix import notification message when importing config nodes (#3224) @knolleary
- - Handle changing types of TypedInput repeatedly (#3223) @knolleary
-
-
-#### 2.1.2: Maintenance Release
-
-
-Runtime
-
- - node-red-pi: Remove bash dependency (#3216) @a16bitsysop
-
-Editor
-
- - Improved regex for markdown renderer (#3213) @GerwinvBeek
- - Fix TypedInput initialisation (#3220) @knolleary
-
-Nodes
-
- - MQTT: fix datatype in node config not used. fixes #3215 (#3219) @Steve-Mcl
-
-#### 2.1.1: Maintenance Release
-
-Editor
-
- - Ensure tourGuide popover doesn't fall offscreen (#3212) @knolleary
- - Fix issue with old inject nodes that migrated topic to 'string' type (#3210) @knolleary
- - Add cache-busting query params to index.mst (#3211) @knolleary
- - Fix TypedInput validation of type without options (#3207) @knolleary
-
-#### 2.1.0: Milestone Release
-
-Editor
-
- - Position popover properly on a scrolled page
- - Fixes from 2.1.0-beta.2 (#3202) @knolleary
-
-Nodes
-
-- Link Out: Fix saving link out node links (#3201) @knolleary
- - Switch: Refix #3170 - copy switch rule type when adding new rule
- - TCP Request: Add string option to TCP request node output (#3204) @dceejay
-
-#### 2.1.0-beta.2: Beta Release
-
-Editor
-
- - Fix switching projects (#3199) @knolleary
- - Use locale setting when installing/enabling node (#3198) @knolleary
- - Do not show projects-wecome dialog until welcome tour completes (#3197) @knolleary
- - Fix converting selection to subflow (#3196) @knolleary
- - Avoid conflicts with native browser cmd-ctrl type shortcuts (#3195) @knolleary
- - Ensure message tools stay attached to top-level entry in Debug/Context (#3186) @knolleary
- - Ensure tab state updates properly when toggling enable state (#3175) @knolleary
- - Improve handling of long labels in TreeList (#3176) @knolleary
- - Shift-click tab scroll arrows to jump to start/end (#3177) @knolleary
-
-Runtime
-
- - Update package dependencies
- - Update to latest node-red-admin
-
-Nodes
-
- - Dynamic MQTT connections (#3189)
- - Link: Filter out Link Out Return nodes in Link In edit dialog Fixes #3187
- - Link: Fix link call label (#3200) @knolleary
- - Debug: Redesign debug filter options and make them persistant (#3183) @knolleary
- - Inject: Widen Inject interval box for >1 digit (#3184) @knolleary
- - Switch: Fix rule focus when switch 'otherwise' rule is used (#3185) @knolleary
-
-#### 2.1.0-beta.1: Beta Release
-
-Editor
-
- - Add Tour Guide component (#3136) @knolleary
- - Allow tabs to be hidden (#3120) @knolleary
- - Add align actions to editor (#3110) @knolleary
- - Add support of environment variable for tab & group (#3112) @HiroyasuNishiyama
- - Add autoComplete widget and add to TypedInput for msg. props (#3171) @knolleary
- - Render node documentation to node-red style guide when written in markdown. (#3169) @Steve-Mcl
- - Allow colouring of tab icon svg (#3140) @harmonic7
- - Restore tab selection after merging conflicts (#3151) @GerwinvBeek
- - Fix serving of theme files on Windows (#3154) @knolleary
- - Ensure config-node select inherits width properly from input (#3155) @knolleary
- - Do better remembering TypedInput values whilst switching types (#3159) @knolleary
- - Update monaco to 0.28.1 (#3153) @knolleary
- - Improve themeing of tourGuide (#3161) @knolleary
- - Allow a node to specify a filter for the config nodes it can pick from (#3160) @knolleary
- - Allow RED.notify.update to modify any notification setting (#3163) @knolleary
- - Fix typo in ko editor.json Fixes #3119
- - Improve RED.actions api to ensure actions cannot be overridden
- - Ensure treeList row has suitable min-height when no content Fixes #3109
- - Refactor edit dialogs to use separate edit panes
- - Ensure type select button is not focussable when TypedInput only has one type
- - Place close tab link in front of fade
-
-Runtime
-
- - Improve error reporting with oauth login strategies (#3148) @knolleary
- - Add allowUpdate feature to externalModules.palette (#3143) @knolleary
- - Improve node install error reporting (#3158) @knolleary
- - Improve unit test coverage (#3168) @knolleary
- - Allow coreNodesDir to be set to false (#3149) @hardillb
- - Update package dependencies
- - uncaughtException debug improvements (#3146) @renatojuniorrs
-
-Nodes
-
- - Change: Add option to deep-clone properties in Change node (#3156) @knolleary
- - Delay: Add push to front of rate limit queue. (#3069) @dceejay
- - File: Add paletteLabel to file nodes to make read/write more obvious (#3157) @knolleary
- - HTTP Request: Extend HTTP request node to log detailed timing information (#3116) @k-toumura
- - HTTP Response: Fix sizing of HTTP Response header fields (#3164) @knolleary
- - Join: Support for msg.restartTimeout (#3121) @magma1447
- - Link Call: Add Link Call node (#3152) @knolleary
- - Switch: Copy previous rule type when adding rule to switch node (#3170) @knolleary
- - Delay node: add option to send intermediate messages on separate output (#3166) @knolleary
- - Typo in http request set method translation (#3173) @mailsvb
-
-#### 2.0.6: Maintenance Release
-
-Editor
-
- - Fix typo in ko editor.json Fixes #3119
- - Change fade color when hovering an inactive tab (#3106) @bonanitech
- - Ensure treeList row has suitable min-height when no content Fixes #3109
-
-Runtime
-
- - Update tar to latest (#3128) @aksswami
- - Give passport verify callback the same arity as the original callback (#3117) @dschmidt
- - Handle HTTPS Key and certificate as string or buffer (#3115) @bartbutenaers
-
-#### 2.0.5: Maintenance Release
-
-Editor
-
- - Remove default ctrl-enter keybinding from monaco editor Fixes #3093
-
-Runtime
-
- - Update tar dependency
- - Add support for maintenance streams in generate-publish-script
-
-
-Nodes
-
- - Fix regression in Join node when manual joining array with msg.parts present Fixes #3096
-
-#### 2.0.4: Maintenance Release
-
-Editor
-
- - Fix tab fade CSS for when using themes (#3085) @bonanitech
- - Handle just-copied-but-not-deployed node with credentials in editor Fixes #3090
-
-Nodes
-
- - Filter: Fix RBE node handling of default topi property Fixes #3087
- - HTTP Request: Handle partially encoded url query strings in request node
- - HTTP Request: Fix support for supplied CA certs (#3089) @hardillb
- - HTTP Request: Ensure TLS Cert is used (#3092) @hardillb
- - Inject: Fix inject now button unable to send empty props
- - Inject: Inject now button success notification should use label with updated props
-
-#### 2.0.3: Maintenance Release
-
-Nodes
-
- - HTML: Fix HTML parsing when body is included in the select tag Fixes #3079
- - HTTP Request: Preserve case of user-provided http headers in request node Fixes #3081
- - HTTP Request: Set decompress to false for HTTP Request to keep 1.x compatibility Fixes #3083
- - HTTP Request: Add unit tests for HTTP Request encodeURI and error response
- - HTTP Request: Do not throw HTTP errors in request node Fixes #3082
- - HTTP Request: Ensure uri is properly encoded before passing to got module Fixes #3080
-
-#### 2.0.2: Maintenance Release
-
-Runtime
-
- - Use file:// url with dynamic import
- - Detect if agent-base has patched https.request and undo it Fixes #3072
-
-Editor
-
- - Fix tab fade css because Safari Fixes #3073
- - Fix error closing library dialog with monaco
- - Handle other error types in Manage Palette view
-
-
-Nodes
-
- - HTTP Request node - ignore invalid cookies rather than fail request Fixes #3075
- - Fix msg.reset handling in Delay node Fixes #3074
-
-#### 2.0.1: Maintenance Release
-
-Nodes
-
- - Function: Ensure default module export is exposed in Function node
-
-#### 2.0.0: Milestone Release
-
-**Migration from 1.x**
-
- - Node-RED now requires Node.js 12.x or later.
-
- - The following nodes have had significant dependency updates. Unless stated,
-   they should be fully backward compatible.
-
-   - RBE:  Relabelled as 'filter' to make it more discoverable and made part of
-     the core palette, rather than as a separate module.
-   - Tail: This node has been removed from the default palette. You can reinstall it
-     from node-red-node-tail
-   - HTTP Request: Reimplemented with a different underlying module. We have
-     tried to maintain 100% functional compatibility, but it is possible
-     some edge cases remain.
-   - JSON: The schema validation option no longer supports JSON-Schema draft-04
-   - HTML: Its underlying module has had a major version update. Should be fully
-     backward compatible.
-
- - `functionExternalModules` is now enabled by default for new installs.
-   If you have an existing settings file that contains this setting, you will
-   need to set it to `true` yourself.
-
-   The external modules will now get installed in your Node-RED user directory,
-   (`~/.node-red`) rather than in a subdirectory. This means all dependencies will
-   be listed in your top-level `package.json`. If you have existing external modules,
-   they will get reinstalled to the new location when you first run Node-RED 2.0.
-
-
-Runtime
-
- - Fix missing dependencies (#3052, #2057) @kazuhitoyokoi
- - Ensure node.types is defined if node html file missing
- - Fix reporting of type_already_registered error
- - Move install location of external modules (#3064) @knolleary
-
-Editor
-
- - Update translations (#3063) @kazuhitoyokoi
- - Add a slight fade to tab labels that overflow
- - Show config node details when selected in outliner
- - Fix layout of info outliner for subflow entries
-
-Nodes
-
- - Delay: let `msg.flush` specify how many messages to flush from node (#3059) @dceejay
- - Function: external modules is now enabled by default (#3065) @knolleary
- - Function: external modules now supports both ES6 and CJS modules (#3065) @knolleary
- - WebSocket: add option for client node to send automatic pings (#3056) @knolleary
-
-
-##### 2.0.0-beta.2: Beta Release
-
-Runtime
-
- - Add `node-red admin init` (via `node-red-admin@2.1.0`)
- - Move to GH Actions rather than Travis for build (#3042) @knolleary
-
-Editor
-
- - Include hasUser=false config nodes when exporting whole flow (#3048)
- - Emit nodes:change for any updated config node when node deleted/added
- - Fix padding of compact notification Closes #3045
- - Ensure any html in changelog is escaped before displaying
- - Add support for Map/Set property types on Debug (#3040) @knolleary
- - Add 'theme' to default settings file
- - Add RED.view.annotations api (#3032) @knolleary
- - Update monaco editor to V0.25.2 (#3031) @Steve-Mcl
- - Lower tray zIndex when overlay tray being opened Fixes #3019
- - Reduce z-Index of Function expand buttons to prevent overlap Part of #3019
- - Ensure RED.clipboard.import displays the right library Fixes #3021
- - Batch messages sent over comms to prevent flooding (#3025) @knolleary
- - Allow RED.popover.panel to specify a closeButton to ignore click events on
- - Use browser default language for initial page load
- - Add css var for node font color
- - Fix label padding of toggleButton
- - Give sidebar open tab a bit more room for its label
- - Various Monaco updates (#3015) @Steve-Mcl
- - Log readOnly on startup (#3024) @sammachin
- - Translation updates (#3020 #3022) @HiroyasuNishiyama @kazuhitoyokoi
-
-Nodes
-
- - HTTP Request: Fix proxy handling (#3044) @hardillb
- - HTTP Request: Handle basic auth with @ in username (#3017) @hardillb
- - Add Japanese translation for file-in node (#3037 #3039) @kazuhitoyokoi
- - File In: Add option for file-in node to include all properties (default off) (#3035) @dceejay
- - Exec: add windowsHide option to hide windows under Windows (#3026) @natcl
- - Support loading external module sub path Fixes #3023
-
-##### 2.0.0-beta.1: Beta Release
-
-
-
-Runtime
-
- - [MAJOR] Set minimum node version to 12.
- - [MAJOR] Fix flowfile name to flows.json in settings (#2951) @dceejay
- - [MAJOR] Update to latest i18n in editor and runtime (#2940) @knolleary
- - [MAJOR] Deprecate usage of httpRoot (#2953) @knolleary
- - Add pre/postInstall hooks to npm install handling (#2936) @knolleary
- - Add engine-strict flag to npm install args (#2965) @nileio
- - Restructure default settings.js to be more organised (#3012) @knolleary
- - Ensure httpServerOptions gets applied to ALL the express apps
- - Allow RED.settings.set to replace string property with object property
- - Update debug tests to handle compact comms format
- - Updates to encode/decode message when passed over debug comms link
- - Remove all input event listeners on a node once it is closed
- - Move hooks to util package
- - Rework hooks structure to be a linkedlist
- - Update dependencies (#2922) @knolleary
-
-Editor
-
- - [MAJOR] Change node id generation to give fixed length values without '.' (#2987) @knolleary
- - [MAJOR] Add Monaco code editor (#2971) @Steve-Mcl
- - Update to latest Monaco (#3007) @Steve-Mcl
- - Update Node-RED Function typings in Monaco (#3008) @Steve-Mcl
- - Add css named variables for certain key colours (#2994) @knolleary
- - Improve contrast of export dialog JSON font color
- - Switch editableList buttons from <a> to <button> elements
- - Add option to RED.nodes.createCompleteNodeSet to include node dimensions
- - Fix css of node help table of contents elements
- - Improve red-ui-node-icon css and add red-ui-node-icon-small modifier class
- - Add RED.hooks to editor
- - Add viewAddPort viewRemovePort viewAddNode viewRemoveNode hooks to view
- - Use paletteLabel if set in help sidebar
- - Add missing args from JSONata $now signature
-
-Nodes
-
- - [MAJOR] Relabel RBE node as 'filter' and move into core. Also remove tail (#2944) @dceejay
- - [MAJOR] HTTP Request: migrate to 'got' module (#2952) @knolleary
- - [MAJOR] Move Inject node to CronosJS module (#2959) @knolleary
- - [MAJOR] JSON: Update ajv to 8.2.0 - drop support for JSON-Schema draft-04 (#2969) @knolleary
- - [MAJOR] HTML node: cheerio update to 1.x (#3011) @knolleary
- - Join: change default manual mode to object (#2931) @knolleary
- - File node: Add fileWorkingDirectory (#2932) @knolleary
- - Delay node enhancements (#2294) @kazuhitoyokoi (#2949) @dceejay
- - Add Japanese translations for delay node enhancements (#2958) @kazuhitoyokoi
- - Inject node: reorder TypedInput options (#2961) @dceejay
- - HTTP Request: update to work with proxies (#2983) @hardillb (#3009) @hardillb
- - HTTP Request: fix msg.responseUrl (#2986) @hardillb
- - TLS: Add ALPN support to TLS node (#2988) @hardillb
- - Inject: add "Inject now" button to edit dialog (#2990) @Steve-Mcl
-
-
-
 #### Older Releases
 
 Change logs for older releases are available on GitHub: https://github.com/node-red/node-red/releases
diff --git a/Gruntfile.js b/Gruntfile.js
index 979b38051..2f81da923 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -142,6 +142,7 @@ module.exports = function(grunt) {
                     "packages/node_modules/@node-red/editor-client/src/js/settings.js",
                     "packages/node_modules/@node-red/editor-client/src/js/user.js",
                     "packages/node_modules/@node-red/editor-client/src/js/comms.js",
+                    "packages/node_modules/@node-red/editor-client/src/js/runtime.js",
                     "packages/node_modules/@node-red/editor-client/src/js/text/bidi.js",
                     "packages/node_modules/@node-red/editor-client/src/js/text/format.js",
                     "packages/node_modules/@node-red/editor-client/src/js/ui/state.js",
@@ -192,6 +193,7 @@ module.exports = function(grunt) {
                     "packages/node_modules/@node-red/editor-client/src/js/ui/library.js",
                     "packages/node_modules/@node-red/editor-client/src/js/ui/notifications.js",
                     "packages/node_modules/@node-red/editor-client/src/js/ui/search.js",
+                    "packages/node_modules/@node-red/editor-client/src/js/ui/contextMenu.js",
                     "packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js",
                     "packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js",
                     "packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js",
diff --git a/package.json b/package.json
index 28b09f46e..8b64aa743 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "node-red",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "description": "Low-code programming for event-driven applications",
     "homepage": "http://nodered.org",
     "license": "Apache-2.0",
@@ -42,14 +42,14 @@
         "cronosjs": "1.7.1",
         "denque": "2.0.1",
         "express": "4.18.1",
-        "express-session": "1.17.2",
+        "express-session": "1.17.3",
         "form-data": "4.0.0",
         "fs-extra": "10.1.0",
-        "got": "11.8.3",
+        "got": "11.8.5",
         "hash-sum": "2.0.0",
         "hpagent": "1.0.0",
         "https-proxy-agent": "5.0.1",
-        "i18next": "21.6.16",
+        "i18next": "21.8.14",
         "iconv-lite": "0.6.3",
         "is-utf8": "0.2.1",
         "js-yaml": "4.1.0",
@@ -59,24 +59,24 @@
         "media-typer": "1.1.0",
         "memorystore": "1.6.7",
         "mime": "3.0.0",
-        "moment": "2.29.3",
+        "moment": "2.29.4",
         "moment-timezone": "0.5.34",
         "mqtt": "4.3.7",
-        "multer": "1.4.4",
+        "multer": "1.4.5-lts.1",
         "mustache": "4.2.0",
         "node-red-admin": "^3.0.0",
         "node-watch": "0.7.3",
         "nopt": "5.0.0",
         "oauth2orize": "1.11.1",
         "on-headers": "1.0.2",
-        "passport": "0.5.2",
+        "passport": "0.6.0",
         "passport-http-bearer": "1.0.1",
         "passport-oauth2-client-password": "0.1.2",
         "raw-body": "2.5.1",
         "semver": "7.3.7",
         "tar": "6.1.11",
         "tough-cookie": "4.0.0",
-        "uglify-js": "3.15.4",
+        "uglify-js": "3.16.2",
         "uuid": "8.3.2",
         "ws": "7.5.6",
         "xml2js": "0.4.23"
@@ -85,8 +85,8 @@
         "bcrypt": "5.0.1"
     },
     "devDependencies": {
-        "dompurify": "2.3.6",
-        "grunt": "1.5.2",
+        "dompurify": "2.3.9",
+        "grunt": "1.5.3",
         "grunt-chmod": "~1.1.1",
         "grunt-cli": "~1.4.3",
         "grunt-concurrent": "3.0.0",
@@ -95,7 +95,7 @@
         "grunt-contrib-concat": "2.1.0",
         "grunt-contrib-copy": "1.0.0",
         "grunt-contrib-jshint": "3.2.0",
-        "grunt-contrib-uglify": "5.2.1",
+        "grunt-contrib-uglify": "5.2.2",
         "grunt-contrib-watch": "1.1.0",
         "grunt-jsdoc": "2.4.1",
         "grunt-jsdoc-to-markdown": "6.0.0",
@@ -105,20 +105,20 @@
         "grunt-sass": "~3.1.0",
         "grunt-simple-mocha": "~0.4.1",
         "grunt-simple-nyc": "^3.0.1",
-        "i18next-http-backend": "1.4.0",
+        "i18next-http-backend": "1.4.1",
         "jquery-i18next": "1.2.1",
         "jsdoc-nr-template": "github:node-red/jsdoc-nr-template",
-        "marked": "4.0.15",
+        "marked": "4.0.18",
         "minami": "1.2.3",
         "mocha": "9.2.2",
-        "node-red-node-test-helper": "^0.2.7",
-        "nodemon": "2.0.16",
+        "node-red-node-test-helper": "^0.3.0",
+        "nodemon": "2.0.19",
         "proxy": "^1.0.2",
-        "sass": "1.51.0",
+        "sass": "1.53.0",
         "should": "13.2.3",
         "sinon": "11.1.2",
         "stoppable": "^1.1.0",
-        "supertest": "6.2.3"
+        "supertest": "6.2.4"
     },
     "engines": {
         "node": ">=14"
diff --git a/packages/node_modules/@node-red/editor-api/lib/admin/flows.js b/packages/node_modules/@node-red/editor-api/lib/admin/flows.js
index 11b30e446..4d8679aac 100644
--- a/packages/node_modules/@node-red/editor-api/lib/admin/flows.js
+++ b/packages/node_modules/@node-red/editor-api/lib/admin/flows.js
@@ -68,5 +68,28 @@ module.exports = {
         }).catch(function(err) {
             apiUtils.rejectHandler(req,res,err);
         })
+    },
+    getState: function(req,res) {
+        const opts = {
+            user: req.user,
+            req: apiUtils.getRequestLogObject(req)
+        }
+        runtimeAPI.flows.getState(opts).then(function(result) {
+            res.json(result);
+        }).catch(function(err) {
+            apiUtils.rejectHandler(req,res,err);
+        })
+    },
+    postState: function(req,res) {
+        const opts = {
+            user: req.user,
+            state: req.body.state || "",
+            req: apiUtils.getRequestLogObject(req)
+        }
+        runtimeAPI.flows.setState(opts).then(function(result) {
+            res.json(result);
+        }).catch(function(err) {
+            apiUtils.rejectHandler(req,res,err);
+        })
     }
 }
diff --git a/packages/node_modules/@node-red/editor-api/lib/admin/index.js b/packages/node_modules/@node-red/editor-api/lib/admin/index.js
index 87fd0dec0..8406fa8e9 100644
--- a/packages/node_modules/@node-red/editor-api/lib/admin/index.js
+++ b/packages/node_modules/@node-red/editor-api/lib/admin/index.js
@@ -54,6 +54,12 @@ module.exports = {
         adminApp.get("/flows",needsPermission("flows.read"),flows.get,apiUtil.errorHandler);
         adminApp.post("/flows",needsPermission("flows.write"),flows.post,apiUtil.errorHandler);
 
+        // Flows/state
+        adminApp.get("/flows/state", needsPermission("flows.read"), flows.getState, apiUtil.errorHandler);
+        if (settings.runtimeState && settings.runtimeState.enabled === true) {
+            adminApp.post("/flows/state", needsPermission("flows.write"), flows.postState, apiUtil.errorHandler);
+        }
+
         // Flow
         adminApp.get("/flow/:id",needsPermission("flows.read"),flow.get,apiUtil.errorHandler);
         adminApp.post("/flow",needsPermission("flows.write"),flow.post,apiUtil.errorHandler);
diff --git a/packages/node_modules/@node-red/editor-api/lib/editor/theme.js b/packages/node_modules/@node-red/editor-api/lib/editor/theme.js
index 5a8dacde4..7be8868d3 100644
--- a/packages/node_modules/@node-red/editor-api/lib/editor/theme.js
+++ b/packages/node_modules/@node-red/editor-api/lib/editor/theme.js
@@ -101,7 +101,10 @@ module.exports = {
         }
         themeSettings = null;
         theme = settings.editorTheme || {};
-        themeContext.asset.vendorMonaco = ((theme.codeEditor || {}).lib === "monaco") ? "vendor/monaco/monaco-bootstrap.js" : "";
+        themeContext.asset.vendorMonaco = "vendor/monaco/monaco-bootstrap.js"
+        if (theme.codeEditor && theme.codeEditor.lib === 'ace') {
+            themeContext.asset.vendorMonaco = ''
+        }
         activeTheme = theme.theme;
     },
 
@@ -263,6 +266,67 @@ module.exports = {
                     theme.page = theme.page || {_:{}}
                     theme.page._.scripts = scriptFiles.concat(theme.page._.scripts || [])
                 }
+                // check and load page settings from theme
+                if (themePlugin.page) {
+                    if (themePlugin.page.favicon  && !theme.page.favicon) {
+                        const result = serveFilesFromTheme(
+                            [themePlugin.page.favicon],
+                            themeApp,
+                            "/",
+                            themePlugin.path
+                        )
+                        if(result && result.length > 0) {
+                            // update themeContext page favicon
+                            themeContext.page.favicon = result[0]
+                            theme.page = theme.page || {_:{}}
+                            theme.page._.favicon = result[0]
+                        }
+                    }
+                    if (themePlugin.page.tabicon && themePlugin.page.tabicon.icon && !theme.page.tabicon) {
+                        const result = serveFilesFromTheme(
+                            [themePlugin.page.tabicon.icon],
+                            themeApp,
+                            "/page/",
+                            themePlugin.path
+                        )
+                        if(result && result.length > 0) {
+                            // update themeContext page tabicon
+                            themeContext.page.tabicon.icon = result[0]
+                            themeContext.page.tabicon.colour = themeContext.page.tabicon.colour || themeContext.page.tabicon.colour
+                            theme.page = theme.page || {_:{}}
+                            theme.page._.tabicon = theme.page._.tabicon || {}
+                            theme.page._.tabicon.icon = themeContext.page.tabicon.icon 
+                            theme.page._.tabicon.colour = themeContext.page.tabicon.colour
+                        }
+                    }
+                    // if the plugin has a title AND the users settings.js does NOT
+                    if (themePlugin.page.title && !theme.page.title) {
+                        themeContext.page.title = themePlugin.page.title || themeContext.page.title
+                    }
+                }
+                // check and load header settings from theme
+                if (themePlugin.header) {
+                    if (themePlugin.header.image && !theme.header.image) {
+                        const result = serveFilesFromTheme(
+                            [themePlugin.header.image],
+                            themeApp,
+                            "/header/",
+                            themePlugin.path
+                        )
+                        if(result && result.length > 0) {
+                            // update themeContext header image
+                            themeContext.header.image = result[0]
+                        }
+                    }
+                    // if the plugin has a title AND the users settings.js does NOT have a title
+                    if (themePlugin.header.title && !theme.header.title) {
+                        themeContext.header.title = themePlugin.header.title || themeContext.header.title
+                    }
+                    // if the plugin has a header url AND the users settings.js does NOT
+                    if (themePlugin.header.url && !theme.header.url) {
+                        themeContext.header.url = themePlugin.header.url || themeContext.header.url
+                    }
+                }
                 if(theme.codeEditor) {
                     theme.codeEditor.options = Object.assign({}, themePlugin.monacoOptions, theme.codeEditor.options);
                 }
diff --git a/packages/node_modules/@node-red/editor-api/package.json b/packages/node_modules/@node-red/editor-api/package.json
index 4b34759ae..fd2f7d469 100644
--- a/packages/node_modules/@node-red/editor-api/package.json
+++ b/packages/node_modules/@node-red/editor-api/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@node-red/editor-api",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "license": "Apache-2.0",
     "main": "./lib/index.js",
     "repository": {
@@ -16,22 +16,22 @@
         }
     ],
     "dependencies": {
-        "@node-red/util": "3.0.0-beta.1",
-        "@node-red/editor-client": "3.0.0-beta.1",
+        "@node-red/util": "3.0.0",
+        "@node-red/editor-client": "3.0.0",
         "bcryptjs": "2.4.3",
         "body-parser": "1.20.0",
         "clone": "2.1.2",
         "cors": "2.8.5",
-        "express-session": "1.17.2",
+        "express-session": "1.17.3",
         "express": "4.18.1",
         "memorystore": "1.6.7",
         "mime": "3.0.0",
-        "multer": "1.4.4",
+        "multer": "1.4.5-lts.1",
         "mustache": "4.2.0",
         "oauth2orize": "1.11.1",
         "passport-http-bearer": "1.0.1",
         "passport-oauth2-client-password": "0.1.2",
-        "passport": "0.5.2",
+        "passport": "0.6.0",
         "ws": "7.5.6"
     },
     "optionalDependencies": {
diff --git a/packages/node_modules/@node-red/editor-client/locales/de/editor.json b/packages/node_modules/@node-red/editor-client/locales/de/editor.json
index 11d8e5d96..41fe1459a 100755
--- a/packages/node_modules/@node-red/editor-client/locales/de/editor.json
+++ b/packages/node_modules/@node-red/editor-client/locales/de/editor.json
@@ -44,7 +44,8 @@
         "loadNodes": "Lade Nodes __count__",
         "loadFlows": "Lade Flows",
         "importFlows": "Füge Flows dem Arbeitsbereich hinzu",
-        "importError": "<p>Fehler beim Laden von Flows.</p><p>__message__</p>"
+        "importError": "<p>Fehler beim Laden von Flows.</p><p>__message__</p>",
+        "loadingProject": "Lade Projekt"
     },
     "workspace": {
         "defaultName": "Flow __number__",
@@ -53,7 +54,16 @@
         "delete": "Sind Sie sicher, dass '__label__' gelöscht werden soll?",
         "dropFlowHere": "Hier kann der Flow eingefügt werden",
         "addFlow": "Flow hinzufügen",
+        "addFlowToRight": "Flow zum Arbeitsbereich rechts hinzufügen",
+        "hideFlow": "Flow ausblenden",
+        "hideOtherFlows": "Andere Flows ausblenden",
+        "showAllFlows": "Alle Flows anzeigen",
+        "hideAllFlows": "Alle Flows ausblenden",
+        "hiddenFlows": "Liste __count__ ausgeblendeten Flow auf",
+        "hiddenFlows_plural": "Liste __count__ ausgeblendete Flows auf",
+        "showLastHiddenFlow": "Letzten ausgeblendeten Flow anzeigen",
         "listFlows": "Flows auflisten",
+        "listSubflows": "Subflows auflisten",
         "status": "Status",
         "enabled": "Aktiviert",
         "disabled": "Deaktiviert",
@@ -65,6 +75,8 @@
             "view": {
                 "view": "Ansicht",
                 "grid": "Raster",
+                "storeZoom": "Zoomstufe beim Laden wiederherstellen",
+                "storePosition": "Scrollposition beim Laden wiederherstellen",
                 "showGrid": "Raster anzeigen",
                 "snapGrid": "Am Raster ausrichten",
                 "gridSize": "Rastergröße",
@@ -82,6 +94,7 @@
             "palette": {
                 "show": "Palette anzeigen"
             },
+            "edit": "Bearbeiten",
             "settings": "Einstellungen",
             "userSettings": "Einstellungen",
             "nodes": "Nodes",
@@ -92,7 +105,7 @@
             "search": "Flows durchsuchen",
             "searchInput": "Flows durchsuchen",
             "subflows": "Subflow",
-            "createSubflow": "Erstellen",
+            "createSubflow": "Subflow",
             "selectionToSubflow": "Auswahl in Subflow umwandeln",
             "flows": "Flow",
             "add": "Hinzufügen",
@@ -104,24 +117,42 @@
             "editPalette": "Palette verwalten",
             "other": "Sonstige",
             "showTips": "Tipps anzeigen",
+            "showWelcomeTours": "Geführte Touren für neue Versionen anzeigen",
             "help": "Node-RED-Website",
-            "projects": "Projekt",
+            "projects": "Projekte",
             "projects-new": "Neu",
             "projects-open": "Öffnen",
             "projects-settings": "Einstellungen",
             "showNodeLabelDefault": "Zeige Namen von neu hinzugefügten Nodes",
-            "groups": "Gruppe",
+            "codeEditor": "Code-Editor",
+            "groups": "Gruppen",
             "groupSelection": "Auswahl gruppieren",
             "ungroupSelection": "Gruppe auflösen",
             "groupMergeSelection": "Auswahl der Gruppe hinzufügen",
-            "groupRemoveSelection": "Auswahl aus der Gruppe entfernen"
+            "groupRemoveSelection": "Auswahl aus der Gruppe entfernen",
+            "arrange": "Anordnen",
+            "alignLeft": "Links ausrichten",
+            "alignCenter": "Zentrieren",
+            "alignRight": "Rechts ausrichten",
+            "alignTop": "Oben ausrichten",
+            "alignMiddle": "Mittig ausrichten",
+            "alignBottom": "Unten ausrichten",
+            "distributeHorizontally": "Horizontal verteilen",
+            "distributeVertically": "Vertikal verteilen",
+            "moveToBack": "Nach hinten verschieben",
+            "moveToFront": "Nach vorne verschieben",
+            "moveBackwards": "Rückwärts verschieben",
+            "moveForwards": "Vorwärts verschieben"
         }
     },
     "actions": {
         "toggle-navigator": "Navigator ein-/ausblenden",
         "zoom-out": "Verkleinern",
         "zoom-reset": "Vergrößerung rücksetzen",
-        "zoom-in": "Vergrößern"
+        "zoom-in": "Vergrößern",
+        "search-flows": "Flows durchsuchen",
+        "search-prev": "Vorherige",
+        "search-next": "Nächste"
     },
     "user": {
         "loggedInAs": "Angemeldet als __name__",
@@ -131,7 +162,7 @@
         "loginFailed": "Anmeldung fehlgeschlagen",
         "notAuthorized": "Nicht berechtigt",
         "errors": {
-            "settings": "Sie müssen angemeldet sein, um auf die Einstellungen zuzugreifen zu können",
+            "settings": "Sie müssen angemeldet sein, um auf die Einstellungen zugreifen zu können",
             "deploy": "Sie müssen angemeldet sein, um Änderungen übernehmen (deploy) zu können",
             "notAuthorized": "Sie müssen angemeldet sein, um diese Aktion ausführen zu können"
         }
@@ -141,7 +172,7 @@
         "warnings": {
             "undeployedChanges": "Node hat nicht übernommene (deploy) Änderungen",
             "nodeActionDisabled": "Node-Aktionen deaktiviert",
-            "nodeActionDisabledSubflow": "Node-Aktionen deaktiviert im Subflow",
+            "nodeActionDisabledSubflow": "Node-Aktionen innerhalb des Subflows deaktiviert",
             "missing-types": "<p>Flows gestoppt aufgrund fehlender Node-Typen</p>",
             "missing-modules": "<p>Flows angehalten aufgrund fehlender Module</p>",
             "safe-mode": "<p>Flows sind im abgesicherten Modus gestoppt.</p><p>Flows können bearbeitet und übernommen (deploy) werden, um sie neu zu starten.</p>",
@@ -157,21 +188,21 @@
         "error": "<strong>Fehler:</strong> __message__",
         "errors": {
             "lostConnection": "Verbindung zum Server verloren. Verbindung wird erneut hergestellt ...",
-            "lostConnectionReconnect": "Verbindung zum Server verloren. Verbindung wird in __time__ s versucht wieder herzustellen.",
-            "lostConnectionTry": "Jetzt testen",
+            "lostConnectionReconnect": "Verbindung zum Server verloren. Wiederherstellung der Verbindung in __time__s.",
+            "lostConnectionTry": "Jetzt versuchen",
             "cannotAddSubflowToItself": "Subflow kann nicht zu sich selbst hinzugefügt werden",
             "cannotAddCircularReference": "Subflow kann nicht hinzugefügt werden, da ein zirkulärer Bezug erkannt wurde",
             "unsupportedVersion": "<p>Nicht unterstützte Version von Node.js erkannt.</p><p>Es muss ein Upgrade auf das neueste LTS-Release von Node.js durchgeführt werden.</p>",
             "failedToAppendNode": "<p>Fehler beim Laden von '__module__'.</p><p>__error__</p>"
         },
         "project": {
-            "change-branch": "Wechsel in den Branch '__project__'",
-            "merge-abort": "Merge abgebrochen",
+            "change-branch": "Wechsel in den lokalen Branch '__project__'",
+            "merge-abort": "Git-Merge abgebrochen",
             "loaded": "Projekt '__project__' geladen",
             "updated": "Projekt '__project__' aktualisiert",
             "pull": "Projekt '__project__' erneut geladen",
             "revert": "Änderungen im Projekt '__project__' rückgängig gemacht",
-            "merge-complete": "Merge abgeschlossen",
+            "merge-complete": "Git-Merge abgeschlossen",
             "setupCredentials": "Berechtigungen einrichten",
             "setupProjectFiles": "Projektdateien einrichten",
             "no": "Nein, Danke",
@@ -186,7 +217,7 @@
             "no-thanks": "Nein, Danke",
             "create-default-project": "Standardprojektdateien erstellen",
             "show-merge-conflicts": "Merge-Konflikte anzeigen",
-            "unknownNodesButton": "Finden Sie unbekannte nodes"
+            "unknownNodesButton": "Nach unbekannten Nodes suchen"
         }
     },
     "clipboard": {
@@ -204,17 +235,17 @@
         "subflow_plural": "__count__ Subflows",
         "replacedNodes": "__count__ Node ersetzt",
         "replacedNodes_plural": "__count__ Nodes ersetzt",
-        "pasteNodes": "Flow-JSON hier einfügen oder",
+        "pasteNodes": "Flow-JSON einfügen oder",
         "selectFile": "Datei für Import auswählen",
         "importNodes": "Import",
         "exportNodes": "Export",
         "download": "Download",
-        "importUnrecognised": "Importierter Typ nicht erkannt:",
-        "importUnrecognised_plural": "Importierte Typen nicht erkannt:",
-        "importDuplicate": "Importiertes doppeltes Node:",
-        "importDuplicate_plural": "Importierte doppelte Nodes:",
-        "nodesExported": "Nodes in der Zwischenablage abgelegt",
-        "nodesImported": "Eingefügt:",
+        "importUnrecognised": "Nicht erkannten Typ importiert:",
+        "importUnrecognised_plural": "Nicht erkannte Typen importiert:",
+        "importDuplicate": "Doppelten Node importiert:",
+        "importDuplicate_plural": "Doppelte Nodes importiert:",
+        "nodesExported": "Nodes in die Zwischenablage exportiert",
+        "nodesImported": "Importiert:",
         "nodeCopied": "__count__ Node kopiert",
         "nodeCopied_plural": "__count__ Nodes kopiert",
         "groupCopied": "__count__ Gruppe kopiert",
@@ -230,11 +261,11 @@
             "all": "Alle Flows",
             "compact": "Kompakt",
             "formatted": "Formatiert",
-            "copy": "In Zwischenablage exportieren",
+            "copy": "In Zwischenablage kopieren",
             "export": "In Bibliothek exportieren",
             "exportAs": "Exportiere als",
             "overwrite": "Ersetzen",
-            "exists": "<p>'__file__' existiert bereits.</p><p>Soll sie ersetzt werden?</p>"
+            "exists": "<p><b>\"__file__\"</b> existiert bereits.</p><p>Soll sie ersetzt werden?</p>"
         },
         "import": {
             "import": "Importiere in",
@@ -270,9 +301,9 @@
         "successfulRestart": "Flows erfolgreich neugestartet",
         "deployFailed": "Übernahme (deploy) fehlgeschlagen: __message__",
         "unusedConfigNodes": "Einige Konfigurations-Nodes werden nicht verwendet.",
-        "unusedConfigNodesButton":"Finden Sie ungenutzte konfig nodes",
-        "unknownNodesButton":"Finden Sie unbekannte nodes",
-        "invalidNodesButton":"Finden Sie ungültige nodes",
+        "unusedConfigNodesButton": "Suche nach unbenutzten Konfigurations-Nodes",
+        "unknownNodesButton": "Suche nach unbekannten Nodes",
+        "invalidNodesButton": "Suche nach ungültigen Nodes",
         "errors": {
             "noResponse": "Keine Antwort vom Server"
         },
@@ -355,10 +386,10 @@
         "keys": "Schlüsselwörter",
         "keysPlaceholder": "Komma-getrennte Schlüsselwörter",
         "author": "Author",
-        "authorPlaceholder": "Dein Name <email@beispiel.de>",
+        "authorPlaceholder": "Ihr Name <email@example.com>",
         "desc": "Beschreibung",
         "env": {
-            "restore": "Stelle auf Subflow-Standard zurück",
+            "restore": "Subflow-Standard wiederherstellen",
             "remove": "Entferne Umgebungsvariable"
         },
         "errors": {
@@ -367,9 +398,9 @@
         }
     },
     "group": {
-        "editGroup": "Editiere Gruppe: __name__",
+        "editGroup": "Bearbeite Gruppe: __name__",
         "errors": {
-            "cannotCreateDiffGroups": "Kann keine Gruppe erzeugen mit Nodes von verschiedenen Gruppen",
+            "cannotCreateDiffGroups": "Kann keine Gruppe mit Nodes von anderen Gruppen erstellen",
             "cannotAddSubflowPorts": "Kann keine Subflow-Anschlüsse zu einer Gruppe hinzufügen"
         }
     },
@@ -383,7 +414,7 @@
         "addNewConfig": "Neuen Konfigurations-Node '__type__' hinzufügen",
         "editNode": "Node '__type__' bearbeiten",
         "editConfig": "Konfigurations-Node '__type__' bearbeiten",
-        "addNewType": "Neuen Typ '__type__' hinzufügen",
+        "addNewType": "Neuen Typ '__type__' hinzufügen ...",
         "nodeProperties": "Node-Eigenschaften",
         "label": "Name",
         "color": "Farbe",
@@ -406,7 +437,7 @@
         "loadCredentials": "Lade Node-Berechtigungen",
         "inputs": {
             "input": "Eingang",
-            "select": "Wähle",
+            "select": "Auswahl",
             "checkbox": "Checkbox",
             "spinner": "Spinner",
             "none": "Kein",
@@ -449,23 +480,27 @@
         "shortcut": "Tastenkürzel",
         "scope": "Geltungsbereich",
         "unassigned": "Nicht zugeordnet",
-        "global": "global",
+        "global": "Global",
         "workspace": "Arbeitsbereich",
-        "selectAll": "Alle Nodes auswählen",
+        "selectAll": "Alles auswählen",
+        "selectNone": "Alles abwählen",
         "selectAllConnected": "Alle verbundenen Nodes auswählen",
         "addRemoveNode": "Node aus Auswahl hinzufügen/entfernen",
         "editSelected": "Ausgewählten Node bearbeiten",
         "deleteSelected": "Ausgewählte Nodes oder Links löschen",
-        "importNode": "Node importieren",
-        "exportNode": "Node exportieren",
+        "importNode": "Nodes importieren",
+        "exportNode": "Nodes exportieren",
         "nudgeNode": "Ausgewählte Nodes verschieben (1px)",
         "moveNode": "Ausgewählte Nodes verschieben (20px)",
         "toggleSidebar": "Seitenleiste ein-/ausblenden",
         "togglePalette": "Palette ein-/ausblenden",
         "copyNode": "Ausgewählte Nodes kopieren",
         "cutNode": "Ausgewählte Nodes ausschneiden",
-        "pasteNode": "Node einfügen",
+        "pasteNode": "Nodes einfügen",
+        "copyGroupStyle": "Gruppenstil kopieren",
+        "pasteGroupStyle": "Gruppenstil einfügen",
         "undoChange": "Letzte Änderung rückgängig machen",
+        "redoChange": "Letzte Änderung wiederholen",
         "searchBox": "Suchfeld öffnen",
         "managePalette": "Palette verwalten",
         "actionList": "Aktionsliste"
@@ -491,7 +526,7 @@
     "palette": {
         "noInfo": "Keine Informationen verfügbar",
         "filter": "Nodes filtern",
-        "search": "Modules durchsuchen",
+        "search": "Module durchsuchen",
         "addCategory": "Neu hinzufügen ...",
         "label": {
             "subflows": "Subflows",
@@ -520,7 +555,8 @@
             "nodeEnabled_plural": "Nodes aktiviert:",
             "nodeDisabled": "Node deaktiviert:",
             "nodeDisabled_plural": "Nodes deaktiviert:",
-            "nodeUpgraded": "Upgrade von Node-Modul __module__ auf Version __version__ durchgeführt"
+            "nodeUpgraded": "Upgrade von Node-Modul __module__ auf Version __version__ durchgeführt",
+            "unknownNodeRegistered": "Fehler beim Laden des Nodes: <ul><li>__type__<br>__error__</li></ul>"
         },
         "editor": {
             "title": "Palette verwalten",
@@ -636,7 +672,7 @@
             "outline": "Entwurf",
             "empty": "leer",
             "globalConfig": "Globale Konfigurations-Nodes",
-            "triggerAction": "Auslösen",
+            "triggerAction": "Aktion auslösen",
             "find": "Suche im Arbeitsbereich"
         },
         "help": {
@@ -739,7 +775,7 @@
                 "userName": "Benutzername",
                 "email": "E-Mail",
                 "workflow": "Arbeitsablauf",
-                "workfowTip": "Wähle deinen bevorzugten Git-Arbeitsablauf",
+                "workfowTip": "Wählen Sie Ihren bevorzugten Git-Arbeitsablauf (Workflow)",
                 "workflowManual": "Manuell",
                 "workflowManualTip": "Alle Änderungen müssen manuell übertragen werden (commit) über die Seitenleiste 'Projekthistorie'",
                 "workflowAuto": "Automatisch",
@@ -858,6 +894,8 @@
         "addTitle": "Element hinzufügen"
     },
     "search": {
+        "history": "Suchhistorie",
+        "clear": "Leeren",
         "empty": "Keine Übereinstimmungen gefunden",
         "addNode": "Node hinzufügen ...",
         "options": {
@@ -865,7 +903,10 @@
             "unusedConfigNodes": "Unbenutzte Konfigurations-Nodes",
             "invalidNodes": "Ungültige Nodes",
             "uknownNodes": "Unbekannte Nodes",
-            "unusedSubflows": "Unbenutzte Subflows"
+            "unusedSubflows": "Unbenutzte Subflows",
+            "hiddenFlows": "Versteckte Flows",
+            "modifiedNodes": "Geänderte Nodes",
+            "thisFlow": "Aktueller Flow"
         }
     },
     "expressionEditor": {
@@ -887,6 +928,9 @@
             "eval": "Fehler beim Auswerten des Ausdrucks\n__message__"
         }
     },
+    "monaco": {
+        "setTheme": "Thema auswählen"
+    },
     "jsEditor": {
         "title": "JavaScript-Editor"
     },
@@ -896,8 +940,10 @@
     "jsonEditor": {
         "title": "JSON-Editor",
         "format": "JSON formatieren",
-        "rawMode": "JSON-Editor",
+        "rawMode": "Bearbeite JSON",
         "uiMode": "Visueller Editor",
+        "rawMode-readonly": "JSON",
+        "uiMode-readonly": "Visuell",
         "insertAbove": "Oberhalb einfügen",
         "insertBelow": "Unterhalb einfügen",
         "addItem": "Element hinzufügen",
@@ -968,7 +1014,7 @@
             "clone": "Projekt klonen",
             "desc0": "Wenn Sie bereits über ein Git-Repository verfügen, das ein Projekt enthält, können Sie es klonen, um damit zu arbeiten.",
             "already-exists": "Das Projekt ist bereits vorhanden",
-            "must-contain": "Darf nur A-Z 0-9 _ enthalten",
+            "must-contain": "Darf nur A-Z 0-9 _ - enthalten",
             "project-name": "Projektname",
             "no-info-in-url": "Geben Sie Benutzername & Passwort nicht innerhalb der URL vor",
             "git-url": "Git-Repository-URL",
@@ -1026,7 +1072,7 @@
             "desc2": "Im Tab 'Commit-Historie' in der Seitenleiste werden alle Dateien angezeigt, die sich in Ihrem Projekt geändert haben, und um sie ins lokale Repository zu übertragen (commit). Es zeigt Ihnen eine vollständige Historie Ihrer Commits an und ermöglicht es Ihnen, Ihre Commits in ein (remote) Server-Repository zu schieben (push)."
         },
         "create": {
-            "projects": "Projekt",
+            "projects": "Projekte",
             "already-exists": "Das Projekt ist bereits vorhanden",
             "must-contain": "Darf nur A-Z 0-9 _ enthalten",
             "no-info-in-url": "Geben Sie Benutzername & Passwort nicht innerhalb der URL vor",
@@ -1059,7 +1105,8 @@
             "not-git": "Kein Git-Repository",
             "no-resource": "Repository nicht gefunden",
             "cant-get-ssh-key-path": "Fehler! Der ausgewählte SSH-Schlüsselpfad kann nicht abgerufen werden.",
-            "unexpected_error": "unerwarteter_Fehler"
+            "unexpected_error": "unerwarteter_Fehler",
+            "clearContext": "Kontextdaten löschen beim Projektwechsel"
         },
         "delete": {
             "confirm": "Sind Sie sicher, dass dieses Projekt gelöscht werden soll?"
@@ -1106,13 +1153,43 @@
         "preview": "Vorschau",
         "defaultValue": "Standardwert"
     },
+    "tourGuide": {
+        "takeATour": "Tour starten",
+        "start": "Start",
+        "next": "Nächste"
+    },
+    "diagnostics": {
+        "title": "System-Informationen"
+    },
     "languages": {
-        "de": "German",
-        "en-US": "English",
-        "ja": "Japanese",
-        "ko": "Korean",
-        "ru": "Russian",
-        "zh-CN": "Chinese(Simplified)",
-        "zh-TW": "Chinese(Traditional)"
+        "de": "Deutsch",
+        "en-US": "Englisch",
+        "ja": "Japanisch",
+        "ko": "Koreanisch",
+        "ru": "Russisch",
+        "zh-CN": "Chinesisch (Vereinfacht)",
+        "zh-TW": "Chinesisch (Traditionell)"
+    },
+    "validator": {
+        "errors": {
+            "invalid-json": "Ungültige JSON-Daten: __error__",
+            "invalid-json-prop": "__prop__: ungültige JSON-Daten: __error__",
+            "invalid-prop": "Ungültiger Eigenschaftsausdruck",
+            "invalid-prop-prop": "__prop__: ungültiger Eigenschaftsausdruck",
+            "invalid-num": "Ungültige Nummer",
+            "invalid-num-prop": "__prop__: ungültige Nummer",
+            "invalid-regexp": "Ungültiges Eingabemuster",
+            "invalid-regex-prop": "__prop__: ungültiges Eingabemuster",
+            "missing-required-prop": "__prop__: Eigenschaftswert fehlt",
+            "invalid-config": "__prop__: ungültige Konfigurations-Node",
+            "missing-config": "__prop__: Konfigurations-Node fehlt",
+            "validation-error": "__prop__: Validierungsfehler: __node__, __id__: __error__"
+        }
+    },
+    "contextMenu": {
+        "insert": "Einfügen",
+        "node": "Node",
+        "junction": "Kreuzung",
+        "linkNodes": "Verknüpfe Nodes"
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json b/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json
index 4f3a3b104..c8abada3e 100755
--- a/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json
+++ b/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json
@@ -3,7 +3,7 @@
         "label": {
             "name": "Name",
             "ok": "Ok",
-            "done":"Done",
+            "done": "Done",
             "cancel": "Cancel",
             "delete": "Delete",
             "close": "Close",
@@ -66,7 +66,7 @@
         "listSubflows": "List subflows",
         "status": "Status",
         "enabled": "Enabled",
-        "disabled":"Disabled",
+        "disabled": "Disabled",
         "info": "Description",
         "selectNodes": "Click nodes to select"
     },
@@ -114,7 +114,7 @@
             "keyboardShortcuts": "Keyboard shortcuts",
             "login": "Login",
             "logout": "Logout",
-            "editPalette":"Manage palette",
+            "editPalette": "Manage palette",
             "other": "Other",
             "showTips": "Show tips",
             "showWelcomeTours": "Show guided tours for new versions",
@@ -130,19 +130,19 @@
             "ungroupSelection": "Ungroup selection",
             "groupMergeSelection": "Merge selection",
             "groupRemoveSelection": "Remove from group",
-            "arrange":"Arrange",
-            "alignLeft":"Align to left",
-            "alignCenter":"Align to center",
-            "alignRight":"Align to right",
-            "alignTop":"Align to top",
-            "alignMiddle":"Align to middle",
-            "alignBottom":"Align to bottom",
-            "distributeHorizontally":"Distribute horizontally",
-            "distributeVertically":"Distribute vertically",
-            "moveToBack":"Move to back",
-            "moveToFront":"Move to front",
-            "moveBackwards":"Move backwards",
-            "moveForwards":"Move forwards"
+            "arrange": "Arrange",
+            "alignLeft": "Align to left",
+            "alignCenter": "Align to center",
+            "alignRight": "Align to right",
+            "alignTop": "Align to top",
+            "alignMiddle": "Align to middle",
+            "alignBottom": "Align to bottom",
+            "distributeHorizontally": "Distribute horizontally",
+            "distributeVertically": "Distribute vertically",
+            "moveToBack": "Move to back",
+            "moveToFront": "Move to front",
+            "moveBackwards": "Move backwards",
+            "moveForwards": "Move forwards"
         }
     },
     "actions": {
@@ -169,6 +169,10 @@
         }
     },
     "notification": {
+        "state": {
+            "flowsStopped": "Flows stopped",
+            "flowsStarted": "Flows started"
+        },
         "warning": "<strong>Warning</strong>: __message__",
         "warnings": {
             "undeployedChanges": "node has undeployed changes",
@@ -176,10 +180,10 @@
             "nodeActionDisabledSubflow": "node actions disabled within subflow",
             "missing-types": "<p>Flows stopped due to missing node types.</p>",
             "missing-modules": "<p>Flows stopped due to missing modules.</p>",
-            "safe-mode":"<p>Flows stopped in safe mode.</p><p>You can modify your flows and deploy the changes to restart.</p>",
+            "safe-mode": "<p>Flows stopped in safe mode.</p><p>You can modify your flows and deploy the changes to restart.</p>",
             "restartRequired": "Node-RED must be restarted to enable upgraded modules",
             "credentials_load_failed": "<p>Flows stopped as the credentials could not be decrypted.</p><p>The flow credential file is encrypted, but the project's encryption key is missing or invalid.</p>",
-            "credentials_load_failed_reset":"<p>Credentials could not be decrypted</p><p>The flow credential file is encrypted, but the project's encryption key is missing or invalid.</p><p>The flow credential file will be reset on the next deployment. Any existing flow credentials will be cleared.</p>",
+            "credentials_load_failed_reset": "<p>Credentials could not be decrypted</p><p>The flow credential file is encrypted, but the project's encryption key is missing or invalid.</p><p>The flow credential file will be reset on the next deployment. Any existing flow credentials will be cleared.</p>",
             "missing_flow_file": "<p>Project flow file not found.</p><p>The project is not configured with a flow file.</p>",
             "missing_package_file": "<p>Project package file not found.</p><p>The project is missing a package.json file.</p>",
             "project_empty": "<p>The project is empty.</p><p>Do you want to create a default set of project files?<br/>Otherwise, you will have to manually add files to the project outside of the editor.</p>",
@@ -257,11 +261,11 @@
         "recoveredNodesInfo": "The nodes on this flow were missing a valid flow id when they were imported. They have been added to this flow so you can either restore or delete them.",
         "recoveredNodesNotification": "<p>Imported nodes without a valid flow id</p><p>They have been added to a new flow called '__flowName__'.</p>",
         "export": {
-            "selected":"selected nodes",
-            "current":"current flow",
-            "all":"all flows",
-            "compact":"compact",
-            "formatted":"formatted",
+            "selected": "selected nodes",
+            "current": "current flow",
+            "all": "all flows",
+            "compact": "compact",
+            "formatted": "formatted",
             "copy": "Copy to clipboard",
             "export": "Export to library",
             "exportAs": "Export as",
@@ -296,15 +300,19 @@
         "modifiedFlowsDesc": "Only deploys flows that contain changed nodes",
         "modifiedNodes": "Modified Nodes",
         "modifiedNodesDesc": "Only deploys nodes that have changed",
+        "startFlows": "Start",
+        "startFlowsDesc": "Start Flows",
+        "stopFlows": "Stop",
+        "stopFlowsDesc": "Stop Flows",
         "restartFlows": "Restart Flows",
         "restartFlowsDesc": "Restarts the current deployed flows",
         "successfulDeploy": "Successfully deployed",
         "successfulRestart": "Successfully restarted flows",
         "deployFailed": "Deploy failed: __message__",
-        "unusedConfigNodes":"You have some unused configuration nodes.",
-        "unusedConfigNodesButton":"Search unused config nodes",
-        "unknownNodesButton":"Search for unknown nodes",
-        "invalidNodesButton":"Search for invalid nodes",
+        "unusedConfigNodes": "You have some unused configuration nodes.",
+        "unusedConfigNodesButton": "Search unused config nodes",
+        "unknownNodesButton": "Search for unknown nodes",
+        "invalidNodesButton": "Search for invalid nodes",
         "errors": {
             "noResponse": "no response from server"
         },
@@ -351,8 +359,8 @@
         },
         "nodeCount": "__count__ node",
         "nodeCount_plural": "__count__ nodes",
-        "local":"Local changes",
-        "remote":"Remote changes",
+        "local": "Local changes",
+        "remote": "Remote changes",
         "reviewChanges": "Review Changes",
         "noBinaryFileShowed": "Cannot show binary file contents",
         "viewCommitDiff": "View Commit Changes",
@@ -436,7 +444,7 @@
         "inputType": "Input type",
         "selectType": "select types...",
         "loadCredentials": "Loading node credentials",
-        "inputs" : {
+        "inputs": {
             "input": "input",
             "select": "select",
             "checkbox": "checkbox",
@@ -617,19 +625,19 @@
             },
             "confirm": {
                 "install": {
-                    "body":"<p>Installing '__module__'</p><p>Before installing, please read the node's documentation. Some nodes have dependencies that cannot be automatically resolved and can require a restart of Node-RED.</p>",
+                    "body": "<p>Installing '__module__'</p><p>Before installing, please read the node's documentation. Some nodes have dependencies that cannot be automatically resolved and can require a restart of Node-RED.</p>",
                     "title": "Install nodes"
                 },
                 "remove": {
-                    "body":"<p>Removing '__module__'</p><p>Removing the node will uninstall it from Node-RED. The node may continue to use resources until Node-RED is restarted.</p>",
+                    "body": "<p>Removing '__module__'</p><p>Removing the node will uninstall it from Node-RED. The node may continue to use resources until Node-RED is restarted.</p>",
                     "title": "Remove nodes"
                 },
                 "update": {
-                    "body":"<p>Updating '__module__'</p><p>Updating the node will require a restart of Node-RED to complete the update. This must be done manually.</p>",
+                    "body": "<p>Updating '__module__'</p><p>Updating the node will require a restart of Node-RED to complete the update. This must be done manually.</p>",
                     "title": "Update nodes"
                 },
                 "cannotUpdate": {
-                    "body":"An update for this node is available, but it is not installed in a location that the palette manager can update.<br/><br/>Please refer to the documentation for how to update this node."
+                    "body": "An update for this node is available, but it is not installed in a location that the palette manager can update.<br/><br/>Please refer to the documentation for how to update this node."
                 },
                 "button": {
                     "review": "Open node information",
@@ -663,14 +671,14 @@
             "showMore": "show more",
             "showLess": "show less",
             "flow": "Flow",
-            "selection":"Selection",
-            "nodes":"__count__ nodes",
+            "selection": "Selection",
+            "nodes": "__count__ nodes",
             "flowDesc": "Flow Description",
             "subflowDesc": "Subflow Description",
             "nodeHelp": "Node Help",
-            "none":"None",
+            "none": "None",
             "arrayItems": "__count__ items",
-            "showTips":"You can open the tips from the settings panel",
+            "showTips": "You can open the tips from the settings panel",
             "outline": "Outline",
             "empty": "empty",
             "globalConfig": "Global Configuration Nodes",
@@ -685,7 +693,8 @@
             "showHelp": "Show help",
             "showInOutline": "Show in outline",
             "showTopics": "Show topics",
-            "noHelp": "No help topic selected"
+            "noHelp": "No help topic selected",
+            "changeLog": "Change Log"
         },
         "config": {
             "name": "Configuration nodes",
@@ -701,8 +710,8 @@
             "filtered": "__count__ hidden"
         },
         "context": {
-            "name":"Context Data",
-            "label":"context",
+            "name": "Context Data",
+            "label": "context",
             "none": "none selected",
             "refresh": "refresh to load",
             "empty": "empty",
@@ -740,9 +749,9 @@
                 "files": "Files",
                 "flow": "Flow",
                 "credentials": "Credentials",
-                "package":"Package",
-                "packageCreate":"File will be created when changes are saved",
-                "fileNotExist":"File does not exist",
+                "package": "Package",
+                "packageCreate": "File will be created when changes are saved",
+                "fileNotExist": "File does not exist",
                 "selectFile": "Select File",
                 "invalidEncryptionKey": "Invalid encryption key",
                 "encryptionEnabled": "Encryption enabled",
@@ -978,7 +987,7 @@
         "title": "Buffer editor",
         "modeString": "Handle as UTF-8 String",
         "modeArray": "Handle as JSON array",
-        "modeDesc":"<h3>Buffer editor</h3><p>The Buffer type is stored as a JSON array of byte values. The editor will attempt to parse the entered value as a JSON array. If it is not valid JSON, it will be treated as a UTF-8 String and converted to an array of the individual character code points.</p><p>For example, a value of <code>Hello World</code> will be converted to the JSON array:<pre>[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]</pre></p>"
+        "modeDesc": "<h3>Buffer editor</h3><p>The Buffer type is stored as a JSON array of byte values. The editor will attempt to parse the entered value as a JSON array. If it is not valid JSON, it will be treated as a UTF-8 String and converted to an array of the individual character code points.</p><p>For example, a value of <code>Hello World</code> will be converted to the JSON array:<pre>[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]</pre></p>"
     },
     "projects": {
         "config-git": "Configure Git client",
@@ -1140,7 +1149,7 @@
             "no-empty": "Cannot create default file set on a non-empty project",
             "git-error": "git error"
         },
-        "errors" : {
+        "errors": {
             "no-username-email": "Your Git client is not configured with a username/email.",
             "unexpected": "An unexpected error occurred",
             "code": "code"
@@ -1158,12 +1167,13 @@
     "tourGuide": {
         "takeATour": "Take a tour",
         "start": "Start",
-        "next": "Next"
+        "next": "Next",
+        "welcomeTours": "Welcome Tours"
     },
     "diagnostics": {
         "title": "System Info"
     },
-    "languages" : {
+    "languages": {
         "de": "German",
         "en-US": "English",
         "ja": "Japanese",
@@ -1174,18 +1184,24 @@
     },
     "validator": {
         "errors": {
-	    "invalid-json": "Invalid JSON data: __error__",
-	    "invalid-json-prop": "__prop__: invalid JSON data: __error__",
-	    "invalid-prop": "Invalid property expression",
-	    "invalid-prop-prop": "__prop__: invalid property expression",
-	    "invalid-num": "Invalid number",
-	    "invalid-num-prop": "__prop__: invalid number",
-	    "invalid-regexp": "Invalid input pattern",
-	    "invalid-regex-prop": "__prop__: invalid input pattern",
-	    "missing-required-prop": "__prop__: property value missing",
-	    "invalid-config": "__prop__: invalid configuration node",
-	    "missing-config": "__prop__: missing configuration node",
-	    "validation-error": "__prop__: validation error: __node__, __id__: __error__"
-	}
+            "invalid-json": "Invalid JSON data: __error__",
+            "invalid-json-prop": "__prop__: invalid JSON data: __error__",
+            "invalid-prop": "Invalid property expression",
+            "invalid-prop-prop": "__prop__: invalid property expression",
+            "invalid-num": "Invalid number",
+            "invalid-num-prop": "__prop__: invalid number",
+            "invalid-regexp": "Invalid input pattern",
+            "invalid-regex-prop": "__prop__: invalid input pattern",
+            "missing-required-prop": "__prop__: property value missing",
+            "invalid-config": "__prop__: invalid configuration node",
+            "missing-config": "__prop__: missing configuration node",
+            "validation-error": "__prop__: validation error: __node__, __id__: __error__"
+        }
+    },
+    "contextMenu": {
+        "insert": "Insert",
+        "node": "Node",
+        "junction": "Junction",
+        "linkNodes": "Link Nodes"
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/locales/en-US/infotips.json b/packages/node_modules/@node-red/editor-client/locales/en-US/infotips.json
index 21a7e735f..a958868ee 100755
--- a/packages/node_modules/@node-red/editor-client/locales/en-US/infotips.json
+++ b/packages/node_modules/@node-red/editor-client/locales/en-US/infotips.json
@@ -1,23 +1,23 @@
 {
     "info": {
-        "tip0" : "You can remove the selected nodes or links with {{core:delete-selection}}",
-        "tip1" : "Search for nodes using {{core:search}}",
-        "tip2" : "{{core:toggle-sidebar}} will toggle the view of this sidebar",
-        "tip3" : "You can manage your palette of nodes with {{core:manage-palette}}",
-        "tip4" : "Your flow configuration nodes are listed in the sidebar panel. It can be accessed from the menu or with {{core:show-config-tab}}",
-        "tip5" : "Enable or disable these tips from the option in the settings",
-        "tip6" : "Move the selected nodes using the [left] [up] [down] and [right] keys. Hold [shift] to nudge them further",
-        "tip7" : "Dragging a node onto a wire will splice it into the link",
-        "tip8" : "Export the selected nodes, or the current tab with {{core:show-export-dialog}}",
-        "tip9" : "Import a flow by dragging its JSON into the editor, or with {{core:show-import-dialog}}",
-        "tip10" : "[shift] [click] and drag on a node port to move all of the attached wires or just the selected one",
-        "tip11" : "Show the Info tab with {{core:show-info-tab}} or the Debug tab with {{core:show-debug-tab}}",
-        "tip12" : "[ctrl] [click] in the workspace to open the quick-add dialog",
-        "tip13" : "Hold down [ctrl] when you [click] on a node port to enable quick-wiring",
-        "tip14" : "Hold down [shift] when you [click] on a node to also select all of its connected nodes",
-        "tip15" : "Hold down [ctrl] when you [click] on a node to add or remove it from the current selection",
-        "tip16" : "Switch flow tabs with {{core:show-previous-tab}} and {{core:show-next-tab}}",
-        "tip17" : "You can confirm your changes in the node edit tray with {{core:confirm-edit-tray}} or cancel them with {{core:cancel-edit-tray}}",
-        "tip18" : "Pressing {{core:edit-selected-node}} will edit the first node in the current selection"
+        "tip0": "You can remove the selected nodes or links with {{core:delete-selection}}",
+        "tip1": "Search for nodes using {{core:search}}",
+        "tip2": "{{core:toggle-sidebar}} will toggle the view of this sidebar",
+        "tip3": "You can manage your palette of nodes with {{core:manage-palette}}",
+        "tip4": "Your flow configuration nodes are listed in the sidebar panel. It can be accessed from the menu or with {{core:show-config-tab}}",
+        "tip5": "Enable or disable these tips from the option in the settings",
+        "tip6": "Move the selected nodes using the [left] [up] [down] and [right] keys. Hold [shift] to nudge them further",
+        "tip7": "Dragging a node onto a wire will splice it into the link",
+        "tip8": "Export the selected nodes, or the current tab with {{core:show-export-dialog}}",
+        "tip9": "Import a flow by dragging its JSON into the editor, or with {{core:show-import-dialog}}",
+        "tip10": "[shift] [click] and drag on a node port to move all of the attached wires or just the selected one",
+        "tip11": "Show the Info tab with {{core:show-info-tab}} or the Debug tab with {{core:show-debug-tab}}",
+        "tip12": "[ctrl] [click] in the workspace to open the quick-add dialog",
+        "tip13": "Hold down [ctrl] when you [click] on a node port to enable quick-wiring",
+        "tip14": "Hold down [shift] when you [click] on a node to also select all of its connected nodes",
+        "tip15": "Hold down [ctrl] when you [click] on a node to add or remove it from the current selection",
+        "tip16": "Switch flow tabs with {{core:show-previous-tab}} and {{core:show-next-tab}}",
+        "tip17": "You can confirm your changes in the node edit tray with {{core:confirm-edit-tray}} or cancel them with {{core:cancel-edit-tray}}",
+        "tip18": "Pressing {{core:edit-selected-node}} will edit the first node in the current selection"
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/locales/en-US/jsonata.json b/packages/node_modules/@node-red/editor-client/locales/en-US/jsonata.json
index 6a00a3c09..b24a898b7 100755
--- a/packages/node_modules/@node-red/editor-client/locales/en-US/jsonata.json
+++ b/packages/node_modules/@node-red/editor-client/locales/en-US/jsonata.json
@@ -52,52 +52,52 @@
         "desc": "Finds occurrences of `pattern` within `str` and replaces them with `replacement`.\n\nThe optional `limit` parameter is the maximum number of replacements."
     },
     "$now": {
-        "args":"$[picture [, timezone]]",
-        "desc":"Generates a timestamp in ISO 8601 compatible format and returns it as a string. If the optional picture and timezone parameters are supplied, then the current timestamp is formatted as described by the `$fromMillis()` function"
+        "args": "$[picture [, timezone]]",
+        "desc": "Generates a timestamp in ISO 8601 compatible format and returns it as a string. If the optional picture and timezone parameters are supplied, then the current timestamp is formatted as described by the `$fromMillis()` function"
     },
     "$base64encode": {
-        "args":"string",
-        "desc":"Converts an ASCII string to a base 64 representation. Each character in the string is treated as a byte of binary data. This requires that all characters in the string are in the 0x00 to 0xFF range, which includes all characters in URI encoded strings. Unicode characters outside of that range are not supported."
+        "args": "string",
+        "desc": "Converts an ASCII string to a base 64 representation. Each character in the string is treated as a byte of binary data. This requires that all characters in the string are in the 0x00 to 0xFF range, which includes all characters in URI encoded strings. Unicode characters outside of that range are not supported."
     },
     "$base64decode": {
-        "args":"string",
-        "desc":"Converts base 64 encoded bytes to a string, using a UTF-8 Unicode codepage."
+        "args": "string",
+        "desc": "Converts base 64 encoded bytes to a string, using a UTF-8 Unicode codepage."
     },
     "$number": {
         "args": "arg",
         "desc": "Casts the `arg` parameter to a number using the following casting rules:\n\n - Numbers are unchanged\n - Strings that contain a sequence of characters that represent a legal JSON number are converted to that number\n - All other values cause an error to be thrown."
     },
     "$abs": {
-        "args":"number",
-        "desc":"Returns the absolute value of the `number` parameter."
+        "args": "number",
+        "desc": "Returns the absolute value of the `number` parameter."
     },
     "$floor": {
-        "args":"number",
-        "desc":"Returns the value of `number` rounded down to the nearest integer that is smaller or equal to `number`."
+        "args": "number",
+        "desc": "Returns the value of `number` rounded down to the nearest integer that is smaller or equal to `number`."
     },
     "$ceil": {
-        "args":"number",
-        "desc":"Returns the value of `number` rounded up to the nearest integer that is greater than or equal to `number`."
+        "args": "number",
+        "desc": "Returns the value of `number` rounded up to the nearest integer that is greater than or equal to `number`."
     },
     "$round": {
-        "args":"number [, precision]",
-        "desc":"Returns the value of the `number` parameter rounded to the number of decimal places specified by the optional `precision` parameter."
+        "args": "number [, precision]",
+        "desc": "Returns the value of the `number` parameter rounded to the number of decimal places specified by the optional `precision` parameter."
     },
     "$power": {
-        "args":"base, exponent",
-        "desc":"Returns the value of `base` raised to the power of `exponent`."
+        "args": "base, exponent",
+        "desc": "Returns the value of `base` raised to the power of `exponent`."
     },
     "$sqrt": {
-        "args":"number",
-        "desc":"Returns the square root of the value of the `number` parameter."
+        "args": "number",
+        "desc": "Returns the square root of the value of the `number` parameter."
     },
     "$random": {
-        "args":"",
-        "desc":"Returns a pseudo random number greater than or equal to zero and less than one."
+        "args": "",
+        "desc": "Returns a pseudo random number greater than or equal to zero and less than one."
     },
     "$millis": {
-        "args":"",
-        "desc":"Returns the number of milliseconds since the Unix Epoch (1 January, 1970 UTC) as a number. All invocations of `$millis()` within an evaluation of an expression will all return the same value."
+        "args": "",
+        "desc": "Returns the number of milliseconds since the Unix Epoch (1 January, 1970 UTC) as a number. All invocations of `$millis()` within an evaluation of an expression will all return the same value."
     },
     "$sum": {
         "args": "array",
@@ -136,20 +136,20 @@
         "desc": "Appends two arrays"
     },
     "$sort": {
-        "args":"array [, function]",
-        "desc":"Returns an array containing all the values in the `array` parameter, but sorted into order.\n\nIf a comparator `function` is supplied, then it must be a function that takes two parameters:\n\n`function(left, right)`\n\nThis function gets invoked by the sorting algorithm to compare two values left and right. If the value of left should be placed after the value of right in the desired sort order, then the function must return Boolean `true` to indicate a swap. Otherwise it must return `false`."
+        "args": "array [, function]",
+        "desc": "Returns an array containing all the values in the `array` parameter, but sorted into order.\n\nIf a comparator `function` is supplied, then it must be a function that takes two parameters:\n\n`function(left, right)`\n\nThis function gets invoked by the sorting algorithm to compare two values left and right. If the value of left should be placed after the value of right in the desired sort order, then the function must return Boolean `true` to indicate a swap. Otherwise it must return `false`."
     },
     "$reverse": {
-        "args":"array",
-        "desc":"Returns an array containing all the values from the `array` parameter, but in reverse order."
+        "args": "array",
+        "desc": "Returns an array containing all the values from the `array` parameter, but in reverse order."
     },
     "$shuffle": {
-        "args":"array",
-        "desc":"Returns an array containing all the values from the `array` parameter, but shuffled into random order."
+        "args": "array",
+        "desc": "Returns an array containing all the values from the `array` parameter, but shuffled into random order."
     },
     "$zip": {
-        "args":"array, ...",
-        "desc":"Returns a convolved (zipped) array containing grouped arrays of values from the `array1` … `arrayN` arguments from index 0, 1, 2...."
+        "args": "array, ...",
+        "desc": "Returns a convolved (zipped) array containing grouped arrays of values from the `array1` … `arrayN` arguments from index 0, 1, 2...."
     },
     "$keys": {
         "args": "object",
@@ -168,24 +168,24 @@
         "desc": "Merges an array of `objects` into a single `object` containing all the key/value pairs from each of the objects in the input array. If any of the input objects contain the same key, then the returned `object` will contain the value of the last one in the array. It is an error if the input array contains an item that is not an object."
     },
     "$sift": {
-        "args":"object, function",
-        "desc":"Returns an object that contains only the key/value pairs from the `object` parameter that satisfy the predicate `function` passed in as the second parameter.\n\nThe `function` that is supplied as the second parameter must have the following signature:\n\n`function(value [, key [, object]])`"
+        "args": "object, function",
+        "desc": "Returns an object that contains only the key/value pairs from the `object` parameter that satisfy the predicate `function` passed in as the second parameter.\n\nThe `function` that is supplied as the second parameter must have the following signature:\n\n`function(value [, key [, object]])`"
     },
     "$each": {
-        "args":"object, function",
-        "desc":"Returns an array containing the values return by the `function` when applied to each key/value pair in the `object`."
+        "args": "object, function",
+        "desc": "Returns an array containing the values return by the `function` when applied to each key/value pair in the `object`."
     },
     "$map": {
-        "args":"array, function",
-        "desc":"Returns an array containing the results of applying the `function` parameter to each value in the `array` parameter.\n\nThe `function` that is supplied as the second parameter must have the following signature:\n\n`function(value [, index [, array]])`"
+        "args": "array, function",
+        "desc": "Returns an array containing the results of applying the `function` parameter to each value in the `array` parameter.\n\nThe `function` that is supplied as the second parameter must have the following signature:\n\n`function(value [, index [, array]])`"
     },
     "$filter": {
-        "args":"array, function",
-        "desc":"Returns an array containing only the values in the `array` parameter that satisfy the `function` predicate.\n\nThe `function` that is supplied as the second parameter must have the following signature:\n\n`function(value [, index [, array]])`"
+        "args": "array, function",
+        "desc": "Returns an array containing only the values in the `array` parameter that satisfy the `function` predicate.\n\nThe `function` that is supplied as the second parameter must have the following signature:\n\n`function(value [, index [, array]])`"
     },
     "$reduce": {
-        "args":"array, function [, init]",
-        "desc":"Returns an aggregated value derived from applying the `function` parameter successively to each value in `array` in combination with the result of the previous application of the function.\n\nThe function must accept two arguments, and behaves like an infix operator between each value within the `array`. The signature of `function` must be of the form: `myfunc($accumulator, $value[, $index[, $array]])`\n\nThe optional `init` parameter is used as the initial value in the aggregation."
+        "args": "array, function [, init]",
+        "desc": "Returns an aggregated value derived from applying the `function` parameter successively to each value in `array` in combination with the result of the previous application of the function.\n\nThe function must accept two arguments, and behaves like an infix operator between each value within the `array`. The signature of `function` must be of the form: `myfunc($accumulator, $value[, $index[, $array]])`\n\nThe optional `init` parameter is used as the initial value in the aggregation."
     },
     "$flowContext": {
         "args": "string[, string]",
diff --git a/packages/node_modules/@node-red/editor-client/locales/ja/editor.json b/packages/node_modules/@node-red/editor-client/locales/ja/editor.json
index d4a638137..fb3458eed 100644
--- a/packages/node_modules/@node-red/editor-client/locales/ja/editor.json
+++ b/packages/node_modules/@node-red/editor-client/locales/ja/editor.json
@@ -169,6 +169,10 @@
         }
     },
     "notification": {
+        "state": {
+            "flowsStopped": "フローを停止しました",
+            "flowsStarted": "フローを開始しました"
+        },
         "warning": "<strong>警告</strong>: __message__",
         "warnings": {
             "undeployedChanges": "ノードの変更をデプロイしていません",
@@ -296,15 +300,19 @@
         "modifiedFlowsDesc": "変更したノードを含むフローのみデプロイ",
         "modifiedNodes": "変更したノード",
         "modifiedNodesDesc": "変更したノードのみデプロイ",
+        "startFlows": "開始",
+        "startFlowsDesc": "フローを開始",
+        "stopFlows": "停止",
+        "stopFlowsDesc": "フローを停止",
         "restartFlows": "フローを再起動",
         "restartFlowsDesc": "デプロイされた現在のフローを再起動",
         "successfulDeploy": "デプロイが成功しました",
         "successfulRestart": "フローの再起動が成功しました",
         "deployFailed": "デプロイが失敗しました: __message__",
         "unusedConfigNodes": "使われていない設定ノードがあります。",
-        "unusedConfigNodesButton":"未使用の構成ノードを検索",
-        "unknownNodesButton":"不明なノードを検索する",
-        "invalidNodesButton":"無効なノードを検索する",
+        "unusedConfigNodesButton": "未使用の構成ノードを検索",
+        "unknownNodesButton": "不明なノードを検索する",
+        "invalidNodesButton": "無効なノードを検索する",
         "errors": {
             "noResponse": "サーバの応答がありません"
         },
@@ -685,7 +693,8 @@
             "showHelp": "ヘルプを表示",
             "showInOutline": "アウトラインに表示",
             "showTopics": "トピックを表示",
-            "noHelp": "ヘルプのトピックが未選択"
+            "noHelp": "ヘルプのトピックが未選択",
+            "changeLog": "更新履歴"
         },
         "config": {
             "name": "設定ノードを表示",
@@ -845,7 +854,7 @@
                 "pushFailed": "リモートに新しいコミットがあるため、プッシュに失敗しました。プルしてマージしてから、再度プッシュしてください。",
                 "push": "プッシュ",
                 "pull": "プル",
-                "unablePull": "<p>リモートの変更のプル失敗：ステージングされていないローカルの変更を上書きされてしまいます。</p><p>変更をコミットしてから再度実行してください。</p>",
+                "unablePull": "<p>リモートの変更のプル失敗：ステージングされていないローカルの変更が上書きされてしまいます。</p><p>変更をコミットしてから再度実行してください。</p>",
                 "showUnstagedChanges": "ステージングされていない変更を表示",
                 "connectionFailed": "リモートリポジトリに接続できません: ",
                 "pullUnrelatedHistory": "<p>リモートに関連のないコミット履歴があります。</p><p>本当に変更をプルしてローカルリポジトリに反映しますか？</p>",
@@ -907,7 +916,8 @@
             "uknownNodes": "未知のノード",
             "unusedSubflows": "未使用のサブフロー",
             "hiddenFlows": "非表示のフロー",
-            "modifiedNodes": "修正したノードやフロー"
+            "modifiedNodes": "修正したノードやフロー",
+            "thisFlow": "現在のフロー"
         }
     },
     "expressionEditor": {
@@ -1157,7 +1167,12 @@
     "tourGuide": {
         "takeATour": "ツアーを開始",
         "start": "開始",
-        "next": "次へ"
+        "next": "次へ",
+        "welcomeTours": "ウェルカムツアー",
+        "tours": "ツアー"
+    },
+    "diagnostics": {
+        "title": "システム情報"
     },
     "languages": {
         "de": "ドイツ語",
@@ -1168,6 +1183,28 @@
         "zh-CN": "中国語(簡体)",
         "zh-TW": "中国語(繁体)"
     },
+    "validator": {
+        "errors": {
+            "invalid-json": "JSONデータが不正: __error__",
+            "invalid-json-prop": "__prop__: JSONデータが不正: __error__",
+            "invalid-prop": "プロパティ式が不正",
+            "invalid-prop-prop": "__prop__: プロパティ式が不正",
+            "invalid-num": "数値が不正",
+            "invalid-num-prop": "__prop__: 数値が不正",
+            "invalid-regexp": "入力パターンが不正",
+            "invalid-regex-prop": "__prop__: 入力パターンが不正",
+            "missing-required-prop": "__prop__: プロパティが未設定",
+            "invalid-config": "__prop__: 設定ノードが不正",
+            "missing-config": "__prop__: 設定ノードが存在しません",
+            "validation-error": "__prop__: チェックエラー: __node__, __id__: __error__"
+        }
+    },
+    "contextMenu": {
+        "insert": "挿入",
+        "node": "ノード",
+        "junction": "分岐点",
+        "linkNodes": "Linkノード"
+    },
     "action-list": {
         "toggle-show-tips": "ヒント表示切替",
         "show-about": "Node-REDの説明を表示",
@@ -1282,7 +1319,7 @@
         "search": "検索",
         "search-previous": "前を検索",
         "search-next": "次を検索",
-        "show-action-list": "アクション一覧を表示",
+        "show-action-list": "動作一覧を表示",
         "confirm-edit-tray": "編集を完了",
         "cancel-edit-tray": "編集をキャンセル",
         "show-remote-diff": "リモートとの変更差分を表示",
@@ -1304,22 +1341,13 @@
         "zoom-out": "ズームアウト",
         "zoom-reset": "ズームリセット",
         "toggle-navigator": "ナビゲータ表示切替",
-        "show-system-info": "システムインフォメーション"
-    },
-    "validator": {
-        "errors": {
-            "invalid-json": "JSONデータが不正: __error__",
-            "invalid-json-prop": "__prop__: JSONデータが不正: __error__",
-            "invalid-prop": "プロパティ式が不正",
-            "invalid-prop-prop": "__prop__: プロパティ式が不正",
-            "invalid-num": "数値が不正",
-            "invalid-num-prop": "__prop__: 数値が不正",
-            "invalid-regexp": "入力パターンが不正",
-            "invalid-regex-prop": "__prop__: 入力パターンが不正",
-            "missing-required-prop": "__prop__: プロパティが未設定",
-            "invalid-config": "__prop__: 設定ノードが不正",
-            "missing-config": "__prop__: 設定ノードが存在しません",
-            "validation-error": "__prop__: チェックエラー: __node__, __id__: __error__"
-	      }
+        "show-system-info": "システム情報",
+        "split-wires-with-junctions": "分岐点によりワイヤーを分割",
+        "new-project": "新しいプロジェクト",
+        "open-project": "プロジェクトを開く",
+        "show-project-settings": "プロジェクト設定を表示",
+        "show-version-control-tab": "バージョンコントロールタブを表示",
+        "start-flows": "フローを開始",
+        "stop-flows": "フローを停止"
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/locales/ja/infotips.json b/packages/node_modules/@node-red/editor-client/locales/ja/infotips.json
index 45ba8450e..14459fa10 100644
--- a/packages/node_modules/@node-red/editor-client/locales/ja/infotips.json
+++ b/packages/node_modules/@node-red/editor-client/locales/ja/infotips.json
@@ -17,7 +17,7 @@
         "tip14": "[shift] を押しながらノードを [click] すると、接続された全てのノードを選択できます。",
         "tip15": "[ctrl] を押しながらノードを [click] すると、選択/非選択を切り替えできます。",
         "tip16": "{{core:show-previous-tab}} や {{core:show-next-tab}} で、タブの切り替えができます。",
-        "tip17": "ノードのプロバティ設定画面にて {{core:confirm-edit-tray}} を押すと、変更を確定できます。また、 {{core:cancel-edit-tray}} を押すと、変更を取り消せます。",
+        "tip17": "ノードのプロパティ設定画面にて {{core:confirm-edit-tray}} を押すと、変更を確定できます。また、 {{core:cancel-edit-tray}} を押すと、変更を取り消せます。",
         "tip18": "ノードを選択し、 {{core:edit-selected-node}} を押すとプロパティ設定画面が表示されます。"
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/locales/zh-CN/editor.json b/packages/node_modules/@node-red/editor-client/locales/zh-CN/editor.json
index af3e833da..eca5878ae 100644
--- a/packages/node_modules/@node-red/editor-client/locales/zh-CN/editor.json
+++ b/packages/node_modules/@node-red/editor-client/locales/zh-CN/editor.json
@@ -97,7 +97,7 @@
             "rename": "重命名",
             "delete": "删除",
             "keyboardShortcuts": "键盘快捷方式",
-            "login": "登陆",
+            "login": "登录",
             "logout": "退出",
             "editPalette": "节点管理",
             "other": "其他",
@@ -122,16 +122,16 @@
         "zoom-in": "放大"
     },
     "user": {
-        "loggedInAs": "作为 __name__ 登陆",
+        "loggedInAs": "作为 __name__ 登录",
         "username": "账号",
         "password": "密码",
-        "login": "登陆",
-        "loginFailed": "登陆失败",
+        "login": "登录",
+        "loginFailed": "登录失败",
         "notAuthorized": "未授权",
         "errors": {
-            "settings": "设置信息需要登陆后才能访问",
-            "deploy": "改动需要登陆后才能部署",
-            "notAuthorized": "此操作需要登陆后才能执行"
+            "settings": "设置信息需要登录后才能访问",
+            "deploy": "改动需要登录后才能部署",
+            "notAuthorized": "此操作需要登录后才能执行"
         }
     },
     "notification": {
diff --git a/packages/node_modules/@node-red/editor-client/package.json b/packages/node_modules/@node-red/editor-client/package.json
index da889a289..a72fedc96 100644
--- a/packages/node_modules/@node-red/editor-client/package.json
+++ b/packages/node_modules/@node-red/editor-client/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@node-red/editor-client",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "license": "Apache-2.0",
     "repository": {
         "type": "git",
diff --git a/packages/node_modules/@node-red/editor-client/src/ace/mode/nrjavascript_worker.js b/packages/node_modules/@node-red/editor-client/src/ace/mode/nrjavascript_worker.js
index b26ce0285..310831607 100644
--- a/packages/node_modules/@node-red/editor-client/src/ace/mode/nrjavascript_worker.js
+++ b/packages/node_modules/@node-red/editor-client/src/ace/mode/nrjavascript_worker.js
@@ -76,7 +76,7 @@ oop.inherits(NRJavaScriptWorker, Mirror);
 
 (function() {
     this.setOptions = function(options) {
-        this.options = {
+        o.options = {
             // undef: true,
             // unused: true,
             esversion: 9,
@@ -98,7 +98,7 @@ oop.inherits(NRJavaScriptWorker, Mirror);
         if (options) {
             for (var opt in options) {
                 if (options.hasOwnProperty(opt)) {
-                    this.options[opt] = options.opt;
+                    o.options[opt] = options[opt];
                 }
             }
         }
diff --git a/packages/node_modules/@node-red/editor-client/src/images/start.svg b/packages/node_modules/@node-red/editor-client/src/images/start.svg
new file mode 100644
index 000000000..9623be86c
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/images/start.svg
@@ -0,0 +1,4 @@
+<svg width="32" height="32" xmlns="http://www.w3.org/2000/svg">
+    <path color="#000" fill="#8c101c" d="M0 0h32v32H0z"></path>
+    <path style="fill:#ffffff;stroke:#000000;stroke-width:0" d="M 24,16 8,24 8,8 Z" fill="none" stroke="#000" stroke-width="1.5"></path>
+</svg>
\ No newline at end of file
diff --git a/packages/node_modules/@node-red/editor-client/src/images/stop.svg b/packages/node_modules/@node-red/editor-client/src/images/stop.svg
new file mode 100644
index 000000000..13b1a945a
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/images/stop.svg
@@ -0,0 +1,4 @@
+<svg width="32" height="32" xmlns="http://www.w3.org/2000/svg">
+    <path color="#000" fill="#8c101c" d="M0 0h32v32H0z"></path>
+    <rect style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0;" width="15" height="15" x="8" y="8.5"></rect>
+</svg>
\ No newline at end of file
diff --git a/packages/node_modules/@node-red/editor-client/src/js/history.js b/packages/node_modules/@node-red/editor-client/src/js/history.js
index f900276a0..b23071239 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/history.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/history.js
@@ -22,6 +22,14 @@ RED.history = (function() {
     var undoHistory = [];
     var redoHistory = [];
 
+    function nodeOrJunction(id) {
+        var node = RED.nodes.node(id);
+        if (node) {
+            return node;
+        }
+        return RED.nodes.junction(id);
+    }
+
     function undoEvent(ev) {
         var i;
         var len;
@@ -514,6 +522,7 @@ RED.history = (function() {
                     var z = ev.activeWorkspace;
                     var fullNodeList = RED.nodes.filterNodes({z:ev.subflow.subflow.id});
                     fullNodeList = fullNodeList.concat(RED.nodes.groups(ev.subflow.subflow.id))
+                    fullNodeList = fullNodeList.concat(RED.nodes.junctions(ev.subflow.subflow.id))
                     fullNodeList.forEach(function(n) {
                         n.x += ev.subflow.offsetX;
                         n.y += ev.subflow.offsetY;
@@ -523,7 +532,7 @@ RED.history = (function() {
                     });
                     inverseEv.subflows = [];
                     for (i=0;i<ev.nodes.length;i++) {
-                        inverseEv.subflows.push(RED.nodes.node(ev.nodes[i]));
+                        inverseEv.subflows.push(nodeOrJunction(ev.nodes[i]));
                         RED.nodes.remove(ev.nodes[i]);
                     }
                 }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/keymap.json b/packages/node_modules/@node-red/editor-client/src/js/keymap.json
index 62a1f4414..1bedab6e8 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/keymap.json
+++ b/packages/node_modules/@node-red/editor-client/src/js/keymap.json
@@ -3,16 +3,12 @@
         "alt-shift-p":"core:manage-palette",
         "ctrl-f": "core:search",
         "ctrl-shift-f": "core:list-flows",
-        "ctrl-+": "core:zoom-in",
-        "ctrl--": "core:zoom-out",
-        "ctrl-0": "core:zoom-reset",
-        "ctrl-enter": "core:confirm-edit-tray",
-        "ctrl-escape": "core:cancel-edit-tray",
         "ctrl-d": "core:deploy-flows",
-        "ctrl-g i": "core:show-info-tab",
-        "ctrl-g h": "core:show-help-tab",
-        "ctrl-g d": "core:show-debug-tab",
         "ctrl-g c": "core:show-config-tab",
+        "ctrl-g d": "core:show-debug-tab",
+        "ctrl-g h": "core:show-help-tab",
+        "ctrl-g i": "core:show-info-tab",
+        "ctrl-g v": "core:show-version-control-tab",
         "ctrl-g x": "core:show-context-tab",
         "ctrl-e": "core:show-export-dialog",
         "ctrl-i": "core:show-import-dialog",
@@ -23,11 +19,8 @@
         "ctrl-alt-r": "core:show-remote-diff",
         "ctrl-alt-n": "core:new-project",
         "ctrl-alt-o": "core:open-project",
-        "ctrl-g v": "core:show-version-control-tab",
         "ctrl-shift-l": "core:show-event-log",
-        "ctrl-shift-p":"core:show-action-list",
-        "alt-w": "core:hide-flow",
-        "alt-shift-w": "core:show-last-hidden-flow"
+        "ctrl-shift-p":"core:show-action-list"
     },
     "red-ui-sidebar-node-config": {
         "backspace": "core:delete-config-selection",
@@ -93,7 +86,16 @@
         "alt-a v": "core:distribute-selection-vertically",
         "shift-f": "core:search-previous",
         "f": "core:search-next",
-        "alt-l l": "core:split-wire-with-link-nodes"
+        "alt-l l": "core:split-wire-with-link-nodes",
+        "alt-w": "core:hide-flow",
+        "alt-shift-w": "core:show-last-hidden-flow",
+        "ctrl-+": "core:zoom-in",
+        "ctrl--": "core:zoom-out",
+        "ctrl-0": "core:zoom-reset"
 
+     },
+     "red-ui-editor-stack": {
+        "ctrl-enter": "core:confirm-edit-tray",
+        "ctrl-escape": "core:cancel-edit-tray"
      }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/nodes.js b/packages/node_modules/@node-red/editor-client/src/js/nodes.js
index 8bcc83170..9da5aad05 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/nodes.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/nodes.js
@@ -14,7 +14,7 @@
  * limitations under the License.
  **/
 
-/** 
+/**
  * An Interface to nodes and utility functions for creating/adding/deleting nodes and links
  * @namespace RED.nodes
 */
@@ -738,6 +738,10 @@ RED.nodes = (function() {
             moveGroupToTab(node,z);
             return;
         }
+        if (node.type === "junction") {
+            moveJunctionToTab(node,z);
+            return;
+        }
         var oldZ = node.z;
         allNodes.moveNode(node,z);
         var nl = nodeLinks[node.id];
@@ -772,6 +776,39 @@ RED.nodes = (function() {
         RED.events.emit("groups:change",group);
     }
 
+    function moveJunctionToTab(junction, z) {
+        var index = junctionsByZ[junction.z].indexOf(junction);
+        junctionsByZ[junction.z].splice(index,1);
+        junctionsByZ[z] = junctionsByZ[z] || [];
+        junctionsByZ[z].push(junction);
+
+        var oldZ = junction.z;
+        junction.z = z;
+
+        var nl = nodeLinks[junction.id];
+        if (nl) {
+            nl.in.forEach(function(l) {
+                var idx = linkTabMap[oldZ].indexOf(l);
+                if (idx != -1) {
+                    linkTabMap[oldZ].splice(idx, 1);
+                }
+                if ((l.source.z === z) && linkTabMap[z]) {
+                    linkTabMap[z].push(l);
+                }
+            });
+            nl.out.forEach(function(l) {
+                var idx = linkTabMap[oldZ].indexOf(l);
+                if (idx != -1) {
+                    linkTabMap[oldZ].splice(idx, 1);
+                }
+                if ((l.target.z === z) && linkTabMap[z]) {
+                    linkTabMap[z].push(l);
+                }
+            });
+        }
+        RED.events.emit("junctions:change",junction);
+    }
+
     function removeLink(l) {
         var index = links.indexOf(l);
         if (index != -1) {
@@ -1617,21 +1654,20 @@ RED.nodes = (function() {
      * Options:
      *  - generateIds - whether to replace all node ids
      *  - addFlow - whether to import nodes to a new tab
-     *  - importToCurrent
+     *  - reimport - if node has a .z property, dont overwrite it
+     *               Only applicible when `generateIds` is false
      *  - importMap - how to resolve any conflicts.
      *       - id:import - import as-is
      *       - id:copy - import with new id
      *       - id:replace - import over the top of existing
      */
     function importNodes(newNodesObj,options) { // createNewIds,createMissingWorkspace) {
-        options = options || {
-            generateIds: false,
-            addFlow: false,
-        }
-        options.importMap = options.importMap || {};
-
-        var createNewIds = options.generateIds;
-        var createMissingWorkspace = options.addFlow;
+        const defOpts = { generateIds: false, addFlow: false, reimport: false, importMap: {} }
+        options = Object.assign({}, defOpts, options)
+        options.importMap = options.importMap || {}
+        const createNewIds = options.generateIds;
+        const reimport = (!createNewIds && !!options.reimport)
+        const createMissingWorkspace = options.addFlow;
         var i;
         var n;
         var newNodes;
@@ -1932,7 +1968,8 @@ RED.nodes = (function() {
                         }
                     }
                 } else {
-                    if (n.z && !workspace_map[n.z] && !subflow_map[n.z]) {
+                    const keepNodesCurrentZ = reimport && n.z && RED.workspaces.contains(n.z)
+                    if (!keepNodesCurrentZ && n.z && !workspace_map[n.z] && !subflow_map[n.z]) {
                         n.z = activeWorkspace;
                     }
                 }
@@ -2033,7 +2070,8 @@ RED.nodes = (function() {
                         node.id = getID();
                     } else {
                         node.id = n.id;
-                        if (node.z == null || (!workspace_map[node.z] && !subflow_map[node.z])) {
+                        const keepNodesCurrentZ = reimport && node.z && RED.workspaces.contains(node.z)
+                        if (!keepNodesCurrentZ && (node.z == null || (!workspace_map[node.z] && !subflow_map[node.z]))) {
                             if (createMissingWorkspace) {
                                 if (missingWorkspace === null) {
                                     missingWorkspace = RED.workspaces.add(null,true);
@@ -2462,6 +2500,8 @@ RED.nodes = (function() {
         workspacesOrder = [];
         groups = {};
         groupsByZ = {};
+        junctions = {};
+        junctionsByZ = {};
 
         var subflowIds = Object.keys(subflows);
         subflowIds.forEach(function(id) {
@@ -2730,7 +2770,7 @@ RED.nodes = (function() {
                     // Force the redraw to be synchronous so the view updates
                     // *now* and removes the unknown node
                     RED.view.redraw(true, true);
-                    var result = importNodes(reimportList,{generateIds:false});
+                    var result = importNodes(reimportList,{generateIds:false, reimport: true});
                     var newNodeMap = {};
                     result.nodes.forEach(function(n) {
                         newNodeMap[n.id] = n;
diff --git a/packages/node_modules/@node-red/editor-client/src/js/red.js b/packages/node_modules/@node-red/editor-client/src/js/red.js
index 57d2d1e33..55446418b 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/red.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/red.js
@@ -297,6 +297,10 @@ var RED = (function() {
                 // handled below
                 return;
             }
+            if (notificationId === "flows-run-state") {
+                // handled in editor-client/src/js/runtime.js
+                return;
+            }
             if (notificationId === "project-update") {
                 loader.start(RED._("event.loadingProject"), 0);
                 RED.nodes.clear();
@@ -332,7 +336,6 @@ var RED = (function() {
                     id: notificationId
                 }
                 if (notificationId === "runtime-state") {
-                    RED.events.emit("runtime-state",msg);
                     if (msg.error === "safe-mode") {
                         options.buttons = [
                             {
@@ -473,9 +476,9 @@ var RED = (function() {
             } else if (persistentNotifications.hasOwnProperty(notificationId)) {
                 persistentNotifications[notificationId].close();
                 delete persistentNotifications[notificationId];
-                if (notificationId === 'runtime-state') {
-                    RED.events.emit("runtime-state",msg);
-                }
+            }
+            if (notificationId === 'runtime-state') {
+                RED.events.emit("runtime-state",msg);
             }
         });
         RED.comms.subscribe("status/#",function(topic,msg) {
@@ -747,6 +750,7 @@ var RED = (function() {
         RED.keyboard.init(buildMainMenu);
 
         RED.nodes.init();
+        RED.runtime.init()
         RED.comms.connect();
 
         $("#red-ui-main-container").show();
diff --git a/packages/node_modules/@node-red/editor-client/src/js/runtime.js b/packages/node_modules/@node-red/editor-client/src/js/runtime.js
new file mode 100644
index 000000000..eac985467
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/js/runtime.js
@@ -0,0 +1,36 @@
+RED.runtime = (function() {
+    let state = ""
+    let settings = { ui: false, enabled: false };
+    const STOPPED = "stop"
+    const STARTED = "start"
+    const SAFE = "safe"
+
+    return {
+        init: function() {
+            // refresh the current runtime status from server
+            settings = Object.assign({}, settings, RED.settings.runtimeState);
+            RED.events.on("runtime-state", function(msg) {
+                if (msg.state) {
+                    const currentState = state
+                    state = msg.state
+                    $(".red-ui-flow-node-button").toggleClass("red-ui-flow-node-button-stopped", state !== STARTED)
+                    if(settings.enabled === true && settings.ui === true) {
+                        RED.menu.setVisible("deploymenu-item-runtime-stop", state === STARTED)
+                        RED.menu.setVisible("deploymenu-item-runtime-start", state !== STARTED)
+                    }
+                    // Do not notify the user about this event if:
+                    // - This is the very first event we've received after loading the editor (currentState = '')
+                    // - The state matches what we already thought was the case (state === currentState)
+                    // - The event was triggered by a deploy (msg.deploy === true)
+                    // - The event is a safe mode event - that gets notified separately
+                    if (currentState !== '' && state !== currentState && !msg.deploy && state !== SAFE) {
+                        RED.notify(RED._("notification.state.flows"+(state === STOPPED?'Stopped':'Started'), msg), "success")
+                    }
+                }
+            });
+        },
+        get started() {
+            return state === STARTED
+        }
+    }
+})()
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/actions.js b/packages/node_modules/@node-red/editor-client/src/js/ui/actions.js
index 2273ae9ab..5bd9ea034 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/actions.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/actions.js
@@ -21,6 +21,34 @@ RED.actions = (function() {
     function getAction(name) {
         return actions[name].handler;
     }
+    function getActionLabel(name) {
+        let def = actions[name]
+        if (!def) {
+            return ''
+        }
+        if (!def.label) {
+            var options = def.options;
+            var key = options ? options.label : undefined;
+            if (!key) {
+                key = "action-list." +name.replace(/^.*:/,"");
+            }
+            var label = RED._(key);
+            if (label === key) {
+                // no translation. convert `name` to description
+                label = name.replace(/(^.+:([a-z]))|(-([a-z]))/g, function() {
+                    if (arguments[5] === 0) {
+                        return arguments[2].toUpperCase();
+                    } else {
+                        return " "+arguments[4].toUpperCase();
+                    }
+                });
+            }
+            def.label = label;
+        }
+        return def.label
+    }
+
+
     function invokeAction() {
         var args = Array.prototype.slice.call(arguments);
         var name = args.shift();
@@ -31,7 +59,7 @@ RED.actions = (function() {
     }
     function listActions() {
         var result = [];
-        var missing = [];
+
         Object.keys(actions).forEach(function(action) {
             var def = actions[action];
             var shortcut = RED.keyboard.getShortcut(action);
@@ -42,28 +70,8 @@ RED.actions = (function() {
                 isUser = !!RED.keyboard.getUserShortcut(action);
             }
             if (!def.label) {
-                var name = action;
-                var options = def.options;
-                var key = options ? options.label : undefined;
-                if (!key) {
-                    key = "action-list." +name.replace(/^.*:/,"");
-                }
-                var label = RED._(key);
-                if (label === key) {
-                    // no translation. convert `name` to description 
-                    label = name.replace(/(^.+:([a-z]))|(-([a-z]))/g, function() {
-                        if (arguments[5] === 0) {
-                            return arguments[2].toUpperCase();
-                        } else {
-                            return " "+arguments[4].toUpperCase();
-                        }
-                    });
-                    missing.push(key);
-                }
-                def.label = label;
+                def.label = getActionLabel(action)
             }
-            //console.log("; missing:", missing);
-
             result.push({
                 id:action,
                 scope:shortcut?shortcut.scope:undefined,
@@ -79,6 +87,7 @@ RED.actions = (function() {
         add: addAction,
         remove: removeAction,
         get: getAction,
+        getLabel: getActionLabel,
         invoke: invokeAction,
         list: listActions
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js b/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js
index 4906f68a1..f547203d4 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js
@@ -709,6 +709,7 @@ RED.clipboard = (function() {
             } else if (type === 'flow') {
                 var activeWorkspace = RED.workspaces.active();
                 nodes = RED.nodes.groups(activeWorkspace);
+                nodes = nodes.concat(RED.nodes.junctions(activeWorkspace));
                 nodes = nodes.concat(RED.nodes.filterNodes({z:activeWorkspace}));
                 RED.nodes.eachConfig(function(n) {
                     if (n.z === RED.workspaces.active() && n._def.hasUsers === false) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js
index 417189b33..2d95f894a 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js
@@ -16,6 +16,7 @@
 RED.menu = (function() {
 
     var menuItems = {};
+    let menuItemCount = 0
 
     function createMenuItem(opt) {
         var item;
@@ -59,15 +60,16 @@ RED.menu = (function() {
             item = $('<li class="red-ui-menu-divider"></li>');
         } else {
             item = $('<li></li>');
-
+            if (!opt.id) {
+                opt.id = 'red-ui-menu-item-'+(menuItemCount++)
+            }
             if (opt.group) {
                 item.addClass("red-ui-menu-group-"+opt.group);
-
             }
             var linkContent = '<a '+(opt.id?'id="'+opt.id+'" ':'')+'tabindex="-1" href="#">';
             if (opt.toggle) {
-                linkContent += '<i class="fa fa-square pull-left"></i>';
-                linkContent += '<i class="fa fa-check-square pull-left"></i>';
+                linkContent += '<i class="fa fa-square'+(opt.direction!=='right'?" pull-left":"")+'"></i>';
+                linkContent += '<i class="fa fa-check-square'+(opt.direction!=='right'?" pull-left":"")+'"></i>';
 
             }
             if (opt.icon !== undefined) {
@@ -77,12 +79,15 @@ RED.menu = (function() {
                     linkContent += '<i class="'+(opt.icon?opt.icon:'" style="display: inline-block;"')+'"></i> ';
                 }
             }
-
+            let label = opt.label
+            if (!opt.label && typeof opt.onselect === 'string') {
+                label = RED.actions.getLabel(opt.onselect)
+            }
             if (opt.sublabel) {
-                linkContent += '<span class="red-ui-menu-label-container"><span class="red-ui-menu-label">'+opt.label+'</span>'+
+                linkContent += '<span class="red-ui-menu-label-container"><span class="red-ui-menu-label">'+label+'</span>'+
                                '<span class="red-ui-menu-sublabel">'+opt.sublabel+'</span></span>'
             } else {
-                linkContent += '<span class="red-ui-menu-label"><span>'+opt.label+'</span></span>'
+                linkContent += '<span class="red-ui-menu-label"><span>'+label+'</span></span>'
             }
 
             linkContent += '</a>';
@@ -126,19 +131,45 @@ RED.menu = (function() {
                 });
             }
             if (opt.options) {
-                item.addClass("red-ui-menu-dropdown-submenu pull-left");
+                item.addClass("red-ui-menu-dropdown-submenu"+(opt.direction!=='right'?" pull-left":""));
                 var submenu = $('<ul id="'+opt.id+'-submenu" class="red-ui-menu-dropdown"></ul>').appendTo(item);
+                var hasIcons = false
+                var hasSubmenus = false
 
                 for (var i=0;i<opt.options.length;i++) {
+
+                    if (opt.options[i]) {
+                        if (opt.onpreselect && opt.options[i].onpreselect === undefined) {
+                            opt.options[i].onpreselect = opt.onpreselect
+                        }
+                        if (opt.onpostselect && opt.options[i].onpostselect === undefined) {
+                            opt.options[i].onpostselect = opt.onpostselect
+                        }
+                        opt.options[i].direction = opt.direction
+                        hasIcons = hasIcons || (opt.options[i].icon);
+                        hasSubmenus = hasSubmenus || (opt.options[i].options);
+                    }
+
                     var li = createMenuItem(opt.options[i]);
                     if (li) {
                         li.appendTo(submenu);
                     }
                 }
+                if (!hasIcons) {
+                    submenu.addClass("red-ui-menu-dropdown-noicons")
+                }
+                if (hasSubmenus) {
+                    submenu.addClass("red-ui-menu-dropdown-submenus")
+                }
+
+
             }
             if (opt.disabled) {
                 item.addClass("disabled");
             }
+            if (opt.visible === false) {
+                item.addClass("hide");
+            }
         }
 
 
@@ -147,7 +178,9 @@ RED.menu = (function() {
     }
     function createMenu(options) {
         var topMenu = $("<ul/>",{class:"red-ui-menu red-ui-menu-dropdown pull-right"});
-
+        if (options.direction) {
+            topMenu.addClass("red-ui-menu-dropdown-direction-"+options.direction)
+        }
         if (options.id) {
             topMenu.attr({id:options.id+"-submenu"});
             var menuParent = $("#"+options.id);
@@ -173,9 +206,22 @@ RED.menu = (function() {
         }
 
         var lastAddedSeparator = false;
+        var hasSubmenus = false;
+        var hasIcons = false;
         for (var i=0;i<options.options.length;i++) {
             var opt = options.options[i];
+            if (opt) {
+                if (options.onpreselect && opt.onpreselect === undefined) {
+                    opt.onpreselect = options.onpreselect
+                }
+                if (options.onpostselect && opt.onpostselect === undefined) {
+                    opt.onpostselect = options.onpostselect
+                }
+                opt.direction = options.direction || 'left'
+            }
             if (opt !== null || !lastAddedSeparator) {
+                hasIcons = hasIcons || (opt && opt.icon);
+                hasSubmenus = hasSubmenus || (opt && opt.options);
                 var li = createMenuItem(opt);
                 if (li) {
                     li.appendTo(topMenu);
@@ -183,13 +229,21 @@ RED.menu = (function() {
                 }
             }
         }
-
+        if (!hasIcons) {
+            topMenu.addClass("red-ui-menu-dropdown-noicons")
+        }
+        if (hasSubmenus) {
+            topMenu.addClass("red-ui-menu-dropdown-submenus")
+        }
         return topMenu;
     }
 
     function triggerAction(id, args) {
         var opt = menuItems[id];
         var callback = opt.onselect;
+        if (opt.onpreselect) {
+            opt.onpreselect.call(opt,args)
+        }
         if (typeof opt.onselect === 'string') {
             callback = RED.actions.get(opt.onselect);
         }
@@ -198,6 +252,9 @@ RED.menu = (function() {
         } else {
             console.log("No callback for",id,opt.onselect);
         }
+        if (opt.onpostselect) {
+            opt.onpostselect.call(opt,args)
+        }
     }
 
     function isSelected(id) {
@@ -249,6 +306,14 @@ RED.menu = (function() {
         }
     }
 
+    function setVisible(id,state) {
+        if (!state) {
+            $("#"+id).parent().addClass("hide");
+        } else {
+            $("#"+id).parent().removeClass("hide");
+        }
+    }
+
     function addItem(id,opt) {
         var item = createMenuItem(opt);
         if (opt !== null && opt.group) {
@@ -305,6 +370,7 @@ RED.menu = (function() {
         isSelected: isSelected,
         toggleSelected: toggleSelected,
         setDisabled: setDisabled,
+        setVisible: setVisible,
         addItem: addItem,
         removeItem: removeItem,
         setAction: setAction,
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js
index f1728ed83..9ddd3d866 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js
@@ -610,10 +610,13 @@ RED.popover = (function() {
                 var target = options.target;
                 var align = options.align || "right";
                 var offset = options.offset || [0,0];
+                var xPos = options.x;
+                var yPos = options.y;
+                var isAbsolutePosition = (xPos !== undefined && yPos !== undefined)
 
-                var pos = target.offset();
-                var targetWidth = target.width();
-                var targetHeight = target.outerHeight();
+                var pos = isAbsolutePosition?{left:xPos, top: yPos}:target.offset();
+                var targetWidth = isAbsolutePosition?0:target.width();
+                var targetHeight = isAbsolutePosition?0:target.outerHeight();
                 var panelHeight = panel.height();
                 var panelWidth = panel.width();
 
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js
index d471d206a..8901cf11f 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js
@@ -828,7 +828,7 @@ RED.tabs = (function() {
                 }
 
                 // link.attr("title",tab.label);
-                RED.popover.tooltip(link,function() { return tab.label})
+                RED.popover.tooltip(link,function() { return RED.utils.sanitize(tab.label); });
 
                 if (options.onadd) {
                     options.onadd(tab);
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js
index 3b6e2cde3..85c6f0992 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js
@@ -21,6 +21,7 @@
  *   - multi : boolean - if true, .selected will return an array of results
  *                       otherwise, returns the first selected item
  *   - sortable: boolean/string - TODO: see editableList
+ *   - selectable: boolean - default true - whether individual items can be selected
  *   - rootSortable: boolean - if 'sortable' is set, then setting this to
  *                             false, prevents items being sorted to the
  *                             top level of the tree
@@ -118,6 +119,7 @@
                 switch(evt.keyCode) {
                     case 32: // SPACE
                     case 13: // ENTER
+                        if (!that.options.selectable) { return }
                         if (evt.altKey || evt.ctrlKey || evt.metaKey || evt.shiftKey) {
                             return
                         }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js
index aa05ad695..549479d85 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js
@@ -1026,10 +1026,7 @@
                             $(opt.icon).prependTo(this.selectLabel);
                         }
                         else if (opt.icon.indexOf("/") !== -1) {
-                            image = new Image();
-                            image.name = opt.icon;
-                            image.src = mapDeprecatedIcon(opt.icon);
-                            $('<img>',{src:mapDeprecatedIcon(opt.icon),style:"margin-right: 4px;height: 18px;"}).prependTo(this.selectLabel);
+                            $('<i>',{class:"red-ui-typedInput-icon", style:"mask-image: url("+opt.icon+"); -webkit-mask-image: url("+opt.icon+"); margin-right: 4px;height: 18px;width:13px"}).prependTo(this.selectLabel);
                         }
                         else {
                             $('<i>',{class:"red-ui-typedInput-icon "+opt.icon,style:"min-width: 13px; margin-right: 4px;"}).prependTo(this.selectLabel);
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/contextMenu.js b/packages/node_modules/@node-red/editor-client/src/js/ui/contextMenu.js
new file mode 100644
index 000000000..66ae2b943
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/contextMenu.js
@@ -0,0 +1,203 @@
+RED.contextMenu = (function () {
+
+    let menu;
+    function createMenu() {
+        // menu = RED.popover.menu({
+        //     options: [
+        //         {
+        //             label: 'delete selection',
+        //             onselect: function() {
+        //                 RED.actions.invoke('core:delete-selection')
+        //                 RED.view.focus()
+        //             }
+        //         },
+        //         { label: 'world' }
+        //     ],
+        //     width: 200,
+        // })
+    }
+
+    function disposeMenu() {
+        $(document).off("mousedown.red-ui-workspace-context-menu");
+        if (menu) {
+            menu.remove();
+        }
+        menu = null;
+    }
+    function show(options) {
+        if (menu) {
+            menu.remove()
+        }
+
+        const selection = RED.view.selection()
+        const noSelection = !selection || Object.keys(selection).length === 0
+        const hasSelection = (selection.nodes && selection.nodes.length > 0);
+        const hasMultipleSelection = hasSelection && selection.nodes.length > 1;
+        const virtulLinks = (selection.links && selection.links.filter(e => !!e.link)) || [];
+        const wireLinks = (selection.links && selection.links.filter(e => !e.link)) || [];
+        const hasLinks = wireLinks.length > 0;
+        const isSingleLink = !hasSelection && hasLinks && wireLinks.length === 1
+        const isMultipleLinks = !hasSelection && hasLinks && wireLinks.length > 1
+        const canDelete = hasSelection || hasLinks
+        const isGroup = hasSelection && selection.nodes.length === 1 && selection.nodes[0].type === 'group'
+
+        const canRemoveFromGroup = hasSelection && !!selection.nodes[0].g
+        const offset = $("#red-ui-workspace-chart").offset()
+
+        let addX = options.x - offset.left + $("#red-ui-workspace-chart").scrollLeft()
+        let addY = options.y - offset.top + $("#red-ui-workspace-chart").scrollTop()
+
+        if (RED.view.snapGrid) {
+            const gridSize = RED.view.gridSize()
+            addX = gridSize * Math.floor(addX / gridSize)
+            addY = gridSize * Math.floor(addY / gridSize)
+        }
+
+        const menuItems = [
+            { onselect: 'core:show-action-list', onpostselect: function () { } },
+            {
+                label: RED._("contextMenu.insert"),
+                options: [
+                    {
+                        label: RED._("contextMenu.node"),
+                        onselect: function () {
+                            RED.view.showQuickAddDialog({
+                                position: [addX, addY],
+                                touchTrigger: true,
+                                splice: isSingleLink ? selection.links[0] : undefined,
+                                // spliceMultiple: isMultipleLinks
+                            })
+                        }
+                    },
+                    (hasLinks) ? { // has least 1 wire selected
+                        label: RED._("contextMenu.junction"),
+                        onselect: 'core:split-wires-with-junctions',
+                        disabled: !hasLinks
+                    } : {
+                        label: RED._("contextMenu.junction"),
+                        onselect: function () {
+                            const nn = {
+                                _def: { defaults: {} },
+                                type: 'junction',
+                                z: RED.workspaces.active(),
+                                id: RED.nodes.id(),
+                                x: addX,
+                                y: addY,
+                                w: 0, h: 0,
+                                outputs: 1,
+                                inputs: 1,
+                                dirty: true
+                            }
+                            const historyEvent = {
+                                dirty: RED.nodes.dirty(),
+                                t: 'add',
+                                junctions: [nn]
+                            }
+                            RED.nodes.addJunction(nn);
+                            RED.history.push(historyEvent);
+                            RED.nodes.dirty(true);
+                            RED.view.select({nodes: [nn] });
+                            RED.view.redraw(true)
+                        }
+                    },
+                    {
+                        label: RED._("contextMenu.linkNodes"),
+                        onselect: 'core:split-wire-with-link-nodes',
+                        disabled: !hasLinks
+                    }
+                ]
+
+
+
+            }
+        ]
+
+        menuItems.push(
+            null,
+            { onselect: 'core:undo', disabled: RED.history.list().length === 0 },
+            { onselect: 'core:redo', disabled: RED.history.listRedo().length === 0 },
+            null,
+            { onselect: 'core:cut-selection-to-internal-clipboard', label: RED._("keyboard.cutNode"), disabled: !hasSelection },
+            { onselect: 'core:copy-selection-to-internal-clipboard', label: RED._("keyboard.copyNode"), disabled: !hasSelection },
+            { onselect: 'core:paste-from-internal-clipboard', label: RED._("keyboard.pasteNode"), disabled: !RED.view.clipboard() },
+            { onselect: 'core:delete-selection', disabled: !canDelete },
+            { onselect: 'core:show-export-dialog', label: RED._("menu.label.export") },
+            { onselect: 'core:select-all-nodes' }
+        )
+
+        if (hasSelection) {
+            menuItems.push(
+                null,
+                isGroup ?
+                    { onselect: 'core:ungroup-selection', disabled: !isGroup }
+                    : { onselect: 'core:group-selection', disabled: !hasSelection }
+            )
+            if (canRemoveFromGroup) {
+                menuItems.push({ onselect: 'core:remove-selection-from-group', label: RED._("menu.label.groupRemoveSelection") })
+            }
+
+        }
+
+        var direction = "right";
+        var MENU_WIDTH = 500; // can not use menu width here
+        if ((options.x -$(document).scrollLeft()) >
+            ($(window).width() -MENU_WIDTH)) {
+            direction = "left";
+        }
+        
+        menu = RED.menu.init({
+            direction: direction,
+            onpreselect: function() {
+                disposeMenu()
+            },
+            onpostselect: function () {
+                RED.view.focus()
+            },
+            options: menuItems
+        });
+
+        menu.attr("id", "red-ui-workspace-context-menu");
+        menu.css({
+            position: "absolute"
+        })
+        menu.appendTo("body");
+
+        // TODO: prevent the menu from overflowing the window.
+
+        var top = options.y
+        var left = options.x
+
+        if (top + menu.height() - $(document).scrollTop() > $(window).height()) {
+            top -= (top + menu.height()) - $(window).height() + 22;
+        }
+        if (left + menu.width() - $(document).scrollLeft() > $(window).width()) {
+            left -= (left + menu.width()) - $(window).width() + 18;
+        }
+        menu.css({
+            top: top + "px",
+            left: left + "px"
+        })
+        $(".red-ui-menu.red-ui-menu-dropdown").hide();
+        $(document).on("mousedown.red-ui-workspace-context-menu", function (evt) {
+            if (menu && menu[0].contains(evt.target)) {
+                return
+            }
+            disposeMenu()
+        });
+        menu.show();
+        // set focus to first item so that pressing escape key closes the menu
+        $("#red-ui-workspace-context-menu :first(ul) > a").trigger("focus")
+
+    }
+    // Allow escape key hook and other editor events to close context menu
+    RED.keyboard.add("red-ui-workspace-context-menu", "escape", function () { RED.contextMenu.hide() })
+    RED.events.on("editor:open", function () { RED.contextMenu.hide() });
+    RED.events.on("search:open", function () { RED.contextMenu.hide() });
+    RED.events.on("type-search:open", function () { RED.contextMenu.hide() });
+    RED.events.on("actionList:open", function () { RED.contextMenu.hide() });
+    RED.events.on("view:selection-changed", function () { RED.contextMenu.hide() });
+    return {
+        show: show,
+        hide: disposeMenu
+    }
+})()
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js b/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js
index 5b73ed271..8a8df6837 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js
@@ -63,16 +63,18 @@ RED.deploy = (function() {
               '</a>'+
               '<a id="red-ui-header-button-deploy-options" class="red-ui-deploy-button" href="#"><i class="fa fa-caret-down"></i></a>'+
               '</span></li>').prependTo(".red-ui-header-toolbar");
-              RED.menu.init({id:"red-ui-header-button-deploy-options",
-                  options: [
-                      {id:"deploymenu-item-full",toggle:"deploy-type",icon:"red/images/deploy-full.svg",label:RED._("deploy.full"),sublabel:RED._("deploy.fullDesc"),selected: true, onselect:function(s) { if(s){changeDeploymentType("full")}}},
-                      {id:"deploymenu-item-flow",toggle:"deploy-type",icon:"red/images/deploy-flows.svg",label:RED._("deploy.modifiedFlows"),sublabel:RED._("deploy.modifiedFlowsDesc"), onselect:function(s) {if(s){changeDeploymentType("flows")}}},
-                      {id:"deploymenu-item-node",toggle:"deploy-type",icon:"red/images/deploy-nodes.svg",label:RED._("deploy.modifiedNodes"),sublabel:RED._("deploy.modifiedNodesDesc"),onselect:function(s) { if(s){changeDeploymentType("nodes")}}},
-                      null,
-                      {id:"deploymenu-item-reload", icon:"red/images/deploy-reload.svg",label:RED._("deploy.restartFlows"),sublabel:RED._("deploy.restartFlowsDesc"),onselect:"core:restart-flows"},
-
-                  ]
-              });
+            const mainMenuItems = [
+                    {id:"deploymenu-item-full",toggle:"deploy-type",icon:"red/images/deploy-full.svg",label:RED._("deploy.full"),sublabel:RED._("deploy.fullDesc"),selected: true, onselect:function(s) { if(s){changeDeploymentType("full")}}},
+                    {id:"deploymenu-item-flow",toggle:"deploy-type",icon:"red/images/deploy-flows.svg",label:RED._("deploy.modifiedFlows"),sublabel:RED._("deploy.modifiedFlowsDesc"), onselect:function(s) {if(s){changeDeploymentType("flows")}}},
+                    {id:"deploymenu-item-node",toggle:"deploy-type",icon:"red/images/deploy-nodes.svg",label:RED._("deploy.modifiedNodes"),sublabel:RED._("deploy.modifiedNodesDesc"),onselect:function(s) { if(s){changeDeploymentType("nodes")}}},
+                    null
+            ]
+            if (RED.settings.runtimeState && RED.settings.runtimeState.ui === true) {
+                mainMenuItems.push({id:"deploymenu-item-runtime-start", icon:"red/images/start.svg",label:RED._("deploy.startFlows"),sublabel:RED._("deploy.startFlowsDesc"),onselect:"core:start-flows", visible:false})
+                mainMenuItems.push({id:"deploymenu-item-runtime-stop", icon:"red/images/stop.svg",label:RED._("deploy.stopFlows"),sublabel:RED._("deploy.stopFlowsDesc"),onselect:"core:stop-flows", visible:false})
+            }
+            mainMenuItems.push({id:"deploymenu-item-reload", icon:"red/images/deploy-reload.svg",label:RED._("deploy.restartFlows"),sublabel:RED._("deploy.restartFlowsDesc"),onselect:"core:restart-flows"})
+            RED.menu.init({id:"red-ui-header-button-deploy-options", options: mainMenuItems });
         } else if (type == "simple") {
             var label = options.label || RED._("deploy.deploy");
             var icon = 'red/images/deploy-full-o.svg';
@@ -100,6 +102,10 @@ RED.deploy = (function() {
 
         RED.actions.add("core:deploy-flows",save);
         if (type === "default") {
+            if (RED.settings.runtimeState && RED.settings.runtimeState.ui === true) {
+                RED.actions.add("core:stop-flows",function() { stopStartFlows("stop") });
+                RED.actions.add("core:start-flows",function() { stopStartFlows("start") });
+            }
             RED.actions.add("core:restart-flows",restart);
             RED.actions.add("core:set-deploy-type-to-full",function() { RED.menu.setSelected("deploymenu-item-full",true);});
             RED.actions.add("core:set-deploy-type-to-modified-flows",function() { RED.menu.setSelected("deploymenu-item-flow",true); });
@@ -270,18 +276,73 @@ RED.deploy = (function() {
     function sanitize(html) {
         return html.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")
     }
-    function restart() {
-        var startTime = Date.now();
-        $(".red-ui-deploy-button-content").css('opacity',0);
-        $(".red-ui-deploy-button-spinner").show();
-        var deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled");
-        $("#red-ui-header-button-deploy").addClass("disabled");
-        deployInflight = true;
+
+    function shadeShow() {
         $("#red-ui-header-shade").show();
         $("#red-ui-editor-shade").show();
         $("#red-ui-palette-shade").show();
         $("#red-ui-sidebar-shade").show();
-
+    }
+    function shadeHide() {
+        $("#red-ui-header-shade").hide();
+        $("#red-ui-editor-shade").hide();
+        $("#red-ui-palette-shade").hide();
+        $("#red-ui-sidebar-shade").hide();
+    }
+    function deployButtonSetBusy(){
+        $(".red-ui-deploy-button-content").css('opacity',0);
+        $(".red-ui-deploy-button-spinner").show();
+        $("#red-ui-header-button-deploy").addClass("disabled");
+    }
+    function deployButtonClearBusy(){
+        $(".red-ui-deploy-button-content").css('opacity',1);
+        $(".red-ui-deploy-button-spinner").hide();
+    }
+    function stopStartFlows(state) {
+        const startTime = Date.now()
+        const deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled")
+        deployInflight = true
+        deployButtonSetBusy()
+        shadeShow()
+        $.ajax({
+            url:"flows/state",
+            type: "POST",
+            data: {state: state}
+        }).done(function(data,textStatus,xhr) {
+            if (deployWasEnabled) {
+                $("#red-ui-header-button-deploy").removeClass("disabled")
+            }
+        }).fail(function(xhr,textStatus,err) {
+            if (deployWasEnabled) {
+                $("#red-ui-header-button-deploy").removeClass("disabled")
+            }
+            if (xhr.status === 401) {
+                RED.notify(RED._("notification.error", { message: RED._("user.notAuthorized") }), "error")
+            } else if (xhr.responseText) {
+                const errorDetail = { message: err ? (err + "") : "" }
+                try {
+                    errorDetail.message = JSON.parse(xhr.responseText).message
+                } finally {
+                    errorDetail.message = errorDetail.message || xhr.responseText
+                }
+                RED.notify(RED._("notification.error", errorDetail), "error")
+            } else {
+                RED.notify(RED._("notification.error", { message: RED._("deploy.errors.noResponse") }), "error")
+            }
+        }).always(function() {
+            const delta = Math.max(0, 300 - (Date.now() - startTime))
+            setTimeout(function () {
+                deployButtonClearBusy()
+                shadeHide()
+                deployInflight = false
+            }, delta);
+        });
+    }
+    function restart() {
+        var startTime = Date.now();
+        var deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled");
+        deployInflight = true;
+        deployButtonSetBusy();
         $.ajax({
             url:"flows",
             type: "POST",
@@ -307,15 +368,10 @@ RED.deploy = (function() {
                 RED.notify(RED._("deploy.deployFailed",{message:RED._("deploy.errors.noResponse")}),"error");
             }
         }).always(function() {
-            deployInflight = false;
             var delta = Math.max(0,300-(Date.now()-startTime));
             setTimeout(function() {
-                $(".red-ui-deploy-button-content").css('opacity',1);
-                $(".red-ui-deploy-button-spinner").hide();
-                $("#red-ui-header-shade").hide();
-                $("#red-ui-editor-shade").hide();
-                $("#red-ui-palette-shade").hide();
-                $("#red-ui-sidebar-shade").hide();
+                deployButtonClearBusy();
+                deployInflight = false;
             },delta);
         });
     }
@@ -450,21 +506,14 @@ RED.deploy = (function() {
         const nns = RED.nodes.createCompleteNodeSet();
         const startTime = Date.now();
 
-        $(".red-ui-deploy-button-content").css('opacity', 0);
-        $(".red-ui-deploy-button-spinner").show();
-        $("#red-ui-header-button-deploy").addClass("disabled");
-
+        deployButtonSetBusy();
         const data = { flows: nns };
-
         if (!force) {
             data.rev = RED.nodes.version();
         }
 
         deployInflight = true;
-        $("#red-ui-header-shade").show();
-        $("#red-ui-editor-shade").show();
-        $("#red-ui-palette-shade").show();
-        $("#red-ui-sidebar-shade").show();
+        shadeShow();
         $.ajax({
             url: "flows",
             type: "POST",
@@ -550,15 +599,11 @@ RED.deploy = (function() {
                 RED.notify(RED._("deploy.deployFailed", { message: RED._("deploy.errors.noResponse") }), "error");
             }
         }).always(function () {
-            deployInflight = false;
             const delta = Math.max(0, 300 - (Date.now() - startTime));
             setTimeout(function () {
-                $(".red-ui-deploy-button-content").css('opacity', 1);
-                $(".red-ui-deploy-button-spinner").hide();
-                $("#red-ui-header-shade").hide();
-                $("#red-ui-editor-shade").hide();
-                $("#red-ui-palette-shade").hide();
-                $("#red-ui-sidebar-shade").hide();
+                deployInflight = false;
+                deployButtonClearBusy()
+                shadeHide()
             }, delta);
         });
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editor.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editor.js
index 13ed25611..7cee2026b 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editor.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editor.js
@@ -21,7 +21,7 @@
 
     const MONACO = "monaco";
     const ACE = "ace";
-    const defaultEditor = ACE;
+    const defaultEditor = MONACO;
     const DEFAULT_SETTINGS = { lib: defaultEditor, options: {} };
     var selectedCodeEditor = null;
     var initialised = false;
@@ -48,12 +48,12 @@
     }
 
     function create(options) {
-        //TODO: (quandry - for consideration) 
+        //TODO: (quandry - for consideration)
         // Below, I had to create a hidden element if options.id || options.element is not in the DOM
-        // I have seen 1 node calling  `this.editor = RED.editor.createEditor()` with an 
+        // I have seen 1 node calling  `this.editor = RED.editor.createEditor()` with an
         // invalid (non existing html element selector) (e.g. node-red-contrib-components does this)
-        // This causes monaco to throw an error when attempting to hook up its events to the dom  & the rest of the 'oneditperapre' 
-        // code is thus skipped. 
+        // This causes monaco to throw an error when attempting to hook up its events to the dom  & the rest of the 'oneditperapre'
+        // code is thus skipped.
         // In ACE mode, creating an ACE editor (with an invalid ID) allows the editor to be created (but obviously there is no UI)
         // Because one (or more) contrib nodes have left this bad code in place, how would we handle this?
         // For compatibility, I have decided to create a hidden element so that at least an editor is created & errors do not occur.
@@ -79,7 +79,7 @@
             return this.editor.create(options);//fallback to ACE
         }
     }
- 
+
     return {
         init: init,
         /**
@@ -91,7 +91,7 @@
         },
         /**
          * Get user selected code editor
-         * @return {string} Returns 
+         * @return {string} Returns
          * @memberof RED.editor.codeEditor
          */
         get editor() {
@@ -104,4 +104,4 @@
          */
         create: create
     }
-})();
\ No newline at end of file
+})();
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/envVarList.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/envVarList.js
index c1e1a0217..209e953e0 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/envVarList.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/envVarList.js
@@ -41,8 +41,12 @@ RED.editor.envVarList = (function() {
                         style: "width:100%",
                         class: "node-input-env-value",
                         type: "text",
-                    }).attr("autocomplete","disable").appendTo(envRow)
-                    valueField.typedInput({default:'str',types:isTemplateNode?DEFAULT_ENV_TYPE_LIST:DEFAULT_ENV_TYPE_LIST_INC_CRED});
+                    }).attr("autocomplete","disable").appendTo(envRow);
+                    var types = (opt.ui && opt.ui.opts && opt.ui.opts.types);
+                    if (!types) {
+                        types = isTemplateNode ? DEFAULT_ENV_TYPE_LIST : DEFAULT_ENV_TYPE_LIST_INC_CRED;
+                    }
+                    valueField.typedInput({default:'str',types:types});
                     valueField.typedInput('type', opt.type);
                     if (opt.type === "cred") {
                         if (opt.value) {
@@ -94,6 +98,11 @@ RED.editor.envVarList = (function() {
                         }
                         opt.ui.label = opt.ui.label || {};
                         opt.ui.type = opt.ui.type || "input";
+                        if ((opt.ui.type === "cred") &&
+                            opt.ui.opts &&
+                            opt.ui.opts.types) {
+                            opt.ui.type = "input";
+                        }
 
                         var uiRow = $('<div/>').appendTo(container).hide();
                         // save current info for reverting on cancel
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/json.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/json.js
index 48fc8f86a..394350f26 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/json.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/json.js
@@ -311,8 +311,8 @@
                 types:[
                     'str','num','bool',
                     {value:"null",label:RED._("common.type.null"),hasValue:false},
-                    {value:"array",label:RED._("common.type.array"),hasValue:false,icon:"red/images/typedInput/json.png"},
-                    {value:"object",label:RED._("common.type.object"),hasValue:false,icon:"red/images/typedInput/json.png"}
+                    {value:"array",label:RED._("common.type.array"),hasValue:false,icon:"red/images/typedInput/json.svg"},
+                    {value:"object",label:RED._("common.type.object"),hasValue:false,icon:"red/images/typedInput/json.svg"}
                 ],
                 default: valType
             });
@@ -534,6 +534,7 @@
                     var container = $("#red-ui-editor-type-json-tab-ui-container").css({"height":"100%"});
                     var filterDepth = Infinity;
                     var list = $('<div class="red-ui-debug-msg-payload red-ui-editor-type-json-editor">').appendTo(container).treeList({
+                        selectable: false,
                         rootSortable: false,
                         sortable: ".red-ui-editor-type-json-editor-item-handle",
                     }).on("treelistchangeparent", function(event, evt) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js
index f4534965d..912fa3528 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js
@@ -37,8 +37,7 @@
                 if (!node._def.defaults || !node._def.defaults.hasOwnProperty("icon")) {
                     var icon = $("#red-ui-editor-node-icon").val()||"";
                     if (!this.isDefaultIcon) {
-                        if ((icon !== node.icon) &&
-                            (icon !== "")) {
+                        if ((node.icon && icon !== node.icon) || (!node.icon && icon !== "")) {
                             editState.changes.icon = node.icon;
                             node.icon = icon;
                             editState.changed = true;
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js
index 826814bab..2db4d0c85 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js
@@ -19,7 +19,6 @@
                 this.tabflowEditor = RED.editor.createEditor({
                     id: 'node-input-info',
                     mode: 'ace/mode/markdown',
-                    stateId: options.stateId,
                     value: ""
                 });
 
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/group.js b/packages/node_modules/@node-red/editor-client/src/js/ui/group.js
index cb864b17c..add6da6c9 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/group.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/group.js
@@ -308,6 +308,7 @@ RED.group = (function() {
                 RED.history.push(historyEvent);
                 RED.view.select({nodes:[group]});
                 RED.nodes.dirty(true);
+                RED.view.focus();
             }
         }
     }
@@ -323,9 +324,6 @@ RED.group = (function() {
                 groups: [ ],
                 dirty: RED.nodes.dirty()
             }
-            RED.history.push(historyEvent);
-
-
             groups.forEach(function(g) {
                 newSelection = newSelection.concat(ungroup(g))
                 historyEvent.groups.push(g);
@@ -333,6 +331,7 @@ RED.group = (function() {
             RED.history.push(historyEvent);
             RED.view.select({nodes:newSelection})
             RED.nodes.dirty(true);
+            RED.view.focus();
         }
     }
 
@@ -427,6 +426,7 @@ RED.group = (function() {
             });
             RED.history.push(historyEvent);
             RED.nodes.dirty(true);
+            RED.view.focus();
         }
     }
 
@@ -454,6 +454,7 @@ RED.group = (function() {
                 }
             }
             RED.view.select({nodes:selection.nodes})
+            RED.view.focus();
         }
     }
     function createGroup(nodes) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/keyboard.js b/packages/node_modules/@node-red/editor-client/src/js/ui/keyboard.js
index d9511269d..40e11aa72 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/keyboard.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/keyboard.js
@@ -265,13 +265,18 @@ RED.keyboard = (function() {
                 if (partialState) {
                     partialState = null;
                     return resolveKeyEvent(evt);
-                } else if (Object.keys(handler).length > 0) {
-                    partialState = handler;
-                    evt.preventDefault();
-                    return null;
-                } else {
-                    return null;
                 }
+                if (Object.keys(handler).length > 0) {
+                    // check if there's a potential combined handler initiated by this keyCode 
+                    for (let h in handler) {
+                        if (matchHandlerToEvent(evt,handler[h]) > -1) {
+                            partialState = handler;
+                            evt.preventDefault();
+                            break;
+                        }
+                    }
+                }
+                return null;
             } else {
                 var depth = Infinity;
                 var matchedHandler;
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/library.js b/packages/node_modules/@node-red/editor-client/src/js/ui/library.js
index ee176dee2..d276b1572 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/library.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/library.js
@@ -363,106 +363,112 @@ RED.library = (function() {
                     options.onconfirm(item);
                 }
             });
-        var itemTools = $("<div>").css({position: "absolute",bottom:"6px",right:"8px"});
-        var menuButton = $('<button class="red-ui-button red-ui-button-small" type="button"><i class="fa fa-ellipsis-h"></i></button>')
-            .on("click", function(evt) {
-                evt.preventDefault();
-                evt.stopPropagation();
-                var elementPos = menuButton.offset();
-
-                var menuOptionMenu = RED.menu.init({id:"red-ui-library-browser-menu",
-                    options: [
-                        {id:"red-ui-library-browser-menu-addFolder",label:RED._("library.newFolder"), onselect: function() {
-                            var defaultFolderName = "new-folder";
-                            var defaultFolderNameMatches = {};
-
-                            var selected = dirList.treeList('selected');
-                            if (!selected.children) {
-                                selected = selected.parent;
-                            }
-                            var complete = function() {
-                                selected.children.forEach(function(c) {
-                                    if (/^new-folder/.test(c.label)) {
-                                        defaultFolderNameMatches[c.label] = true
-                                    }
-                                });
-                                var folderIndex = 2;
-                                while(defaultFolderNameMatches[defaultFolderName]) {
-                                    defaultFolderName = "new-folder-"+(folderIndex++)
-                                }
-
-                                selected.treeList.expand();
-                                var input = $('<input type="text" class="red-ui-treeList-input">').val(defaultFolderName);
-                                var newItem = {
-                                    icon: "fa fa-folder-o",
-                                    children:[],
-                                    path: selected.path,
-                                    element: input
-                                }
-                                var confirmAdd = function() {
-                                    var val = input.val().trim();
-                                    if (val === "") {
-                                        cancelAdd();
-                                        return;
-                                    } else {
-                                        for (var i=0;i<selected.children.length;i++) {
-                                            if (selected.children[i].label === val) {
-                                                cancelAdd();
-                                                return;
-                                            }
-                                        }
-                                    }
-                                    newItem.treeList.remove();
-                                    var finalItem = {
-                                        library: selected.library,
-                                        type: selected.type,
-                                        icon: "fa fa-folder",
-                                        children:[],
-                                        label: val,
-                                        path: newItem.path+val+"/"
-                                    }
-                                    selected.treeList.addChild(finalItem,true);
-                                }
-                                var cancelAdd = function() {
-                                    newItem.treeList.remove();
-                                }
-                                input.on('keydown', function(evt) {
-                                    evt.stopPropagation();
-                                    if (evt.keyCode === 13) {
-                                        confirmAdd();
-                                    } else if (evt.keyCode === 27) {
-                                        cancelAdd();
-                                    }
-                                })
-                                input.on("blur", function() {
-                                    confirmAdd();
-                                })
-                                selected.treeList.addChild(newItem);
-                                setTimeout(function() {
-                                    input.trigger("focus");
-                                    input.select();
-                                },400);
-                            }
-                            selected.treeList.expand(complete);
-
-                        } },
-                        // null,
-                        // {id:"red-ui-library-browser-menu-rename",label:"Rename", onselect: function() {} },
-                        // {id:"red-ui-library-browser-menu-delete",label:"Delete", onselect: function() {} }
-                    ]
-                }).on('mouseleave', function(){ $(this).remove(); dirList.focus() })
-                  .on('mouseup', function() { var self = $(this);self.hide(); dirList.focus(); setTimeout(function() { self.remove() },100)})
-                  .appendTo("body");
-                menuOptionMenu.css({
-                    position: "absolute",
-                    top: elementPos.top+"px",
-                    left: (elementPos.left - menuOptionMenu.width() + 20)+"px"
-                }).show();
-
-            }).appendTo(itemTools);
+        var itemTools = null;
         if (options.folderTools) {
             dirList.on('treelistselect', function(event, item) {
                 if (item.writable !== false && item.treeList) {
+                    if (itemTools) {
+                        itemTools.remove();
+                    }
+                    itemTools = $("<div>").css({position: "absolute",bottom:"6px",right:"8px"});
+                    var menuButton = $('<button class="red-ui-button red-ui-button-small" type="button"><i class="fa fa-ellipsis-h"></i></button>')
+                        .on("click", function(evt) {
+                            evt.preventDefault();
+                            evt.stopPropagation();
+                            var elementPos = menuButton.offset();
+
+                            var menuOptionMenu
+                                = RED.menu.init({id:"red-ui-library-browser-menu",
+                                      options: [
+                                          {id:"red-ui-library-browser-menu-addFolder",label:RED._("library.newFolder"), onselect: function() {
+                                              var defaultFolderName = "new-folder";
+                                              var defaultFolderNameMatches = {};
+
+                                              var selected = dirList.treeList('selected');
+                                              if (!selected.children) {
+                                                  selected = selected.parent;
+                                              }
+                                              var complete = function() {
+                                                  selected.children.forEach(function(c) {
+                                                      if (/^new-folder/.test(c.label)) {
+                                                          defaultFolderNameMatches[c.label] = true
+                                                      }
+                                                  });
+                                                  var folderIndex = 2;
+                                                  while(defaultFolderNameMatches[defaultFolderName]) {
+                                                      defaultFolderName = "new-folder-"+(folderIndex++)
+                                                  }
+
+                                                  selected.treeList.expand();
+                                                  var input = $('<input type="text" class="red-ui-treeList-input">').val(defaultFolderName);
+                                                  var newItem = {
+                                                      icon: "fa fa-folder-o",
+                                                      children:[],
+                                                      path: selected.path,
+                                                      element: input
+                                                  }
+                                                  var confirmAdd = function() {
+                                                      var val = input.val().trim();
+                                                      if (val === "") {
+                                                          cancelAdd();
+                                                          return;
+                                                      } else {
+                                                          for (var i=0;i<selected.children.length;i++) {
+                                                              if (selected.children[i].label === val) {
+                                                                  cancelAdd();
+                                                                  return;
+                                                              }
+                                                          }
+                                                      }
+                                                      newItem.treeList.remove();
+                                                      var finalItem = {
+                                                          library: selected.library,
+                                                          type: selected.type,
+                                                          icon: "fa fa-folder",
+                                                          children:[],
+                                                          label: val,
+                                                          path: newItem.path+val+"/"
+                                                      }
+                                                      selected.treeList.addChild(finalItem,true);
+                                                  }
+                                                  var cancelAdd = function() {
+                                                      newItem.treeList.remove();
+                                                  }
+                                                  input.on('keydown', function(evt) {
+                                                      evt.stopPropagation();
+                                                      if (evt.keyCode === 13) {
+                                                          confirmAdd();
+                                                      } else if (evt.keyCode === 27) {
+                                                          cancelAdd();
+                                                      }
+                                                  })
+                                                  input.on("blur", function() {
+                                                      confirmAdd();
+                                                  })
+                                                  selected.treeList.addChild(newItem);
+                                                  setTimeout(function() {
+                                                      input.trigger("focus");
+                                                      input.select();
+                                                  },400);
+                                              }
+                                              selected.treeList.expand(complete);
+
+                                          } },
+                                          // null,
+                                          // {id:"red-ui-library-browser-menu-rename",label:"Rename", onselect: function() {} },
+                                          // {id:"red-ui-library-browser-menu-delete",label:"Delete", onselect: function() {} }
+                                      ]
+                                                }).on('mouseleave', function(){ $(this).remove(); dirList.focus() })
+                                .on('mouseup', function() { var self = $(this);self.hide(); dirList.focus(); setTimeout(function() { self.remove() },100)})
+                                .appendTo("body");
+                            menuOptionMenu.css({
+                                position: "absolute",
+                                top: elementPos.top+"px",
+                                left: (elementPos.left - menuOptionMenu.width() + 20)+"px"
+                            }).show();
+
+                        }).appendTo(itemTools);
+                    
                     itemTools.appendTo(item.treeList.label);
                 }
             });
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js b/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js
index 1e23d578a..9f20cc674 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js
@@ -208,7 +208,7 @@ RED.palette = (function() {
     }
 
     function escapeCategory(category) {
-        return category.replace(/[ /.]/g,"_");
+        return category.replace(/[\x00-\x2c\x2e-\x2f\x3a-\x40\x5b-\x60\x7b-\x7f]/g,"_");
     }
     function addNodeType(nt,def) {
         if (getPaletteNode(nt).length) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/search.js b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js
index 102c72ded..217fb5a4e 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/search.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js
@@ -148,7 +148,7 @@ RED.search = (function() {
                 var key = keys[i];
                 var kpos = keys[i].indexOf(val);
                 if (kpos > -1) {
-                    var ids = Object.keys(index[key]);
+                    var ids = Object.keys(index[key]||{});
                     for (j=0;j<ids.length;j++) {
                         var node = index[key][ids[j]];
                         var isConfigNode = node.node._def.category === "config" && node.node.type !== 'group';
@@ -264,7 +264,7 @@ RED.search = (function() {
                 }
                 currentResults = search(value);
                 if (currentResults.length > 0) {
-                    for (i=0;i<Math.min(currentResults.length,25);i++) {
+                    for (let i=0;i<Math.min(currentResults.length,25);i++) {
                         searchResults.editableList('addItem',currentResults[i])
                     }
                     if (currentResults.length > 25) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js b/packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js
index 58fca2cb4..ca4f651ab 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js
@@ -604,6 +604,14 @@ RED.subflow = (function() {
         return x;
     }
 
+    function nodeOrJunction(id) {
+        var node = RED.nodes.node(id);
+        if (node) {
+            return node;
+        }
+        return RED.nodes.junction(id);
+    }
+
     function convertToSubflow() {
         var selection = RED.view.selection();
         if (!selection.nodes) {
@@ -792,14 +800,15 @@ RED.subflow = (function() {
 
         subflow.in.forEach(function(input) {
             input.wires.forEach(function(wire) {
-                var link = {source: input, sourcePort: 0, target: RED.nodes.node(wire.id) }
+                var link = {source: input, sourcePort: 0, target: nodeOrJunction(wire.id) }
                 new_links.push(link);
                 RED.nodes.addLink(link);
             });
         });
+
         subflow.out.forEach(function(output,i) {
             output.wires.forEach(function(wire) {
-                var link = {source: RED.nodes.node(wire.id), sourcePort: wire.port , target: output }
+                var link = {source: nodeOrJunction(wire.id), sourcePort: wire.port , target: output }
                 new_links.push(link);
                 RED.nodes.addLink(link);
             });
@@ -815,7 +824,7 @@ RED.subflow = (function() {
                 n.links = n.links.filter(function(id) {
                     var isLocalLink = nodes.hasOwnProperty(id);
                     if (!isLocalLink) {
-                        var otherNode = RED.nodes.node(id);
+                        var otherNode = nodeOrJunction(id);
                         if (otherNode && otherNode.links) {
                             var i = otherNode.links.indexOf(n.id);
                             if (i > -1) {
@@ -831,7 +840,6 @@ RED.subflow = (function() {
             RED.nodes.moveNodeToTab(n, subflow.id);
         }
 
-
         var historyEvent = {
             t:'createSubflow',
             nodes:[subflowInstance.id],
@@ -869,6 +877,7 @@ RED.subflow = (function() {
         RED.nodes.dirty(true);
         RED.view.updateActive();
         RED.view.select(null);
+        RED.view.focus();
     }
 
 
@@ -923,6 +932,7 @@ RED.subflow = (function() {
 
 
     function buildEnvUIRow(row, tenv, ui, node) {
+        console.log(tenv, ui)
         ui.label = ui.label||{};
         if ((tenv.type === "cred" || (tenv.parent && tenv.parent.type === "cred")) && !ui.type) {
             ui.type = "cred";
@@ -983,6 +993,17 @@ RED.subflow = (function() {
                         default: inputType
                     })
                     input.typedInput('value',val.value)
+                    if (inputType === 'cred') {
+                        if (node.credentials) {
+                            if (node.credentials[tenv.name]) {
+                                input.typedInput('value', node.credentials[tenv.name]);
+                            } else if (node.credentials['has_'+tenv.name]) {
+                                input.typedInput('value', "__PWRD__")
+                            } else {
+                                input.typedInput('value', "");
+                            }
+                        }
+                    }
                 } else {
                     input.val(val.value)
                 }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-help.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-help.js
index 154b64364..e5199b5bc 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-help.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-help.js
@@ -20,10 +20,8 @@ RED.sidebar.help = (function() {
     var helpSection;
     var panels;
     var panelRatio;
-    var helpTopics = [];
     var treeList;
     var tocPanel;
-    var helpIndex = {};
 
     function resizeStack() {
         var h = $(content).parent().height() - toolbar.outerHeight();
@@ -97,7 +95,10 @@ RED.sidebar.help = (function() {
         var pendingContentLoad;
         treeList.on('treelistselect', function(e,item) {
             pendingContentLoad = item;
-            if (item.nodeType) {
+            if (item.tour) {
+                RED.tourGuide.run(item.tour);
+            }
+            else if (item.nodeType) {
                 showNodeTypeHelp(item.nodeType);
             } else if (item.content) {
                 helpSection.empty();
@@ -189,7 +190,6 @@ RED.sidebar.help = (function() {
     }
 
     function refreshHelpIndex() {
-        helpTopics = [];
         var modules = RED.nodes.registry.getModuleList();
         var moduleNames = Object.keys(modules);
         moduleNames.sort();
@@ -198,15 +198,32 @@ RED.sidebar.help = (function() {
             label: RED._("sidebar.help.nodeHelp"),
             children: [],
             expanded: true
-        }
+        };
+        var tours = RED.tourGuide.list().map(function (item) {
+            return {
+                icon: "fa fa-play-circle-o",
+                label: item.label,
+                tour: item.path,
+            };
+        });
         var helpData = [
             {
-                id: 'changelog',
-                label: "Node-RED v"+RED.settings.version,
-                content: getChangelog
+                label: "Node-RED",
+                children: [
+                    {
+                        id: 'changelog',
+                        label: RED._("sidebar.help.changeLog"),
+                        content: getChangelog
+                    },
+                    {
+                        label: RED._("tourGuide.welcomeTours"),
+                        children: tours
+                    }
+
+                ]
             },
             nodeHelp
-        ]
+        ];
         var subflows = RED.nodes.registry.getNodeTypes().filter(function(t) {return /subflow/.test(t)});
         if (subflows.length > 0) {
             nodeHelp.children.push({
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tour/tourGuide.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tour/tourGuide.js
index 31612cfeb..406715651 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/tour/tourGuide.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tour/tourGuide.js
@@ -433,9 +433,30 @@ RED.tourGuide = (function() {
         })
     }
 
+    function listTour() {
+        return [
+            {
+                id: "3_0",
+                label: "3.0",
+                path: "./tours/welcome.js"
+            },
+            {
+                id: "2_2",
+                label: "2.2",
+                path: "./tours/2.2/welcome.js"
+            },
+            {
+                id: "2_1",
+                label: "2.1",
+                path: "./tours/2.1/welcome.js"
+            }
+        ];
+    }
+
     return {
         load: loadTour,
         run: run,
+        list: listTour,
         reset: function() {
             RED.settings.set("editor.tours.welcome",'');
         }
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js b/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js
index 0fc633071..fc5b8e99e 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js
@@ -104,7 +104,9 @@ RED.typeSearch = (function() {
                     var index = Math.max(0,selected);
                     if (index < children.length) {
                         var n = $(children[index]).find(".red-ui-editableList-item-content").data('data');
-                        typesUsed[n.type] = Date.now();
+                        if (!/^_action_:/.test(n.type)) {
+                            typesUsed[n.type] = Date.now();
+                        }
                         if (n.def.outputs === 0) {
                             confirm(n);
                         } else {
@@ -173,6 +175,8 @@ RED.typeSearch = (function() {
                 var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(div);
                 if (object.type === "junction") {
                     nodeDiv.addClass("red-ui-palette-icon-junction");
+                } else if (/^_action_:/.test(object.type)) {
+                    nodeDiv.addClass("red-ui-palette-icon-junction")
                 } else {
                     var colour = RED.utils.getNodeColor(object.type,def);
                     nodeDiv.css('backgroundColor',colour);
@@ -182,11 +186,14 @@ RED.typeSearch = (function() {
                 var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
                 RED.utils.createIconElement(icon_url, iconContainer, false);
 
-                if (object.type !== "junction" && def.inputs > 0) {
-                    $('<div/>',{class:"red-ui-search-result-node-port"}).appendTo(nodeDiv);
-                }
-                if (object.type !== "junction" && def.outputs > 0) {
-                    $('<div/>',{class:"red-ui-search-result-node-port red-ui-search-result-node-output"}).appendTo(nodeDiv);
+
+                if (!/^_action_:/.test(object.type) && object.type !== "junction") {
+                    if (def.inputs > 0) {
+                        $('<div/>',{class:"red-ui-search-result-node-port"}).appendTo(nodeDiv);
+                    }
+                    if (def.outputs > 0) {
+                        $('<div/>',{class:"red-ui-search-result-node-port red-ui-search-result-node-output"}).appendTo(nodeDiv);
+                    }
                 }
 
                 var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div);
@@ -207,7 +214,9 @@ RED.typeSearch = (function() {
     }
     function confirm(def) {
         hide();
-        typesUsed[def.type] = Date.now();
+        if (!/^_action_:/.test(def.type)) {
+            typesUsed[def.type] = Date.now();
+        }
         addCallback(def.type);
     }
 
@@ -316,6 +325,7 @@ RED.typeSearch = (function() {
     function applyFilter(filter,type,def) {
         return !filter ||
             (
+                (!filter.spliceMultiple) &&
                 (!filter.type || type === filter.type) &&
                 (!filter.input || type === 'junction' || def.inputs > 0) &&
                 (!filter.output || type === 'junction' || def.outputs > 0)
@@ -330,6 +340,13 @@ RED.typeSearch = (function() {
             'inject','debug','function','change','switch','junction'
         ].filter(function(t) { return applyFilter(opts.filter,t,RED.nodes.getType(t)); });
 
+        // if (opts.filter && opts.filter.input && opts.filter.output && !opts.filter.type) {
+        //     if (opts.filter.spliceMultiple) {
+        //         common.push('_action_:core:split-wires-with-junctions')
+        //     }
+        //     common.push('_action_:core:split-wire-with-link-nodes')
+        // }
+
         var recentlyUsed = Object.keys(typesUsed);
         recentlyUsed.sort(function(a,b) {
             return typesUsed[b]-typesUsed[a];
@@ -354,6 +371,8 @@ RED.typeSearch = (function() {
             var itemDef = RED.nodes.getType(common[i]);
             if (common[i] === 'junction') {
                 itemDef = { inputs:1, outputs: 1, label: 'junction', type: 'junction'}
+            } else if (/^_action_:/.test(common[i]) ) {
+                itemDef = { inputs:1, outputs: 1, label: common[i], type: common[i]}
             }
             if (itemDef) {
                 item = {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js
index c3ea0ddd1..2c4cdca6b 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js
@@ -1032,6 +1032,8 @@ RED.utils = (function() {
             return "font-awesome/fa-circle-o"
         } else if (def.category === 'config') {
             return RED.settings.apiRootUrl+"icons/node-red/cog.svg"
+        } else if ((node && /^_action_:/.test(node.type)) || /^_action_:/.test(def.type)) {
+            return "font-awesome/fa-cogs"
         } else if (node && node.type === 'tab') {
             return "red-ui-icons/red-ui-icons-flow"
             // return RED.settings.apiRootUrl+"images/subflow_tab.svg"
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/view-tools.js b/packages/node_modules/@node-red/editor-client/src/js/ui/view-tools.js
index 699e5f222..bc81d4a43 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/view-tools.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/view-tools.js
@@ -105,6 +105,9 @@ RED.view.tools = (function() {
                 $(document).one('keyup',endKeyboardMove);
                 endMoveSet = true;
             }
+            var dim = RED.view.dimensions();
+            var space_width = dim.width;
+            var space_height = dim.height;
             var minX = 0;
             var minY = 0;
             var node;
@@ -120,6 +123,12 @@ RED.view.tools = (function() {
                 node.n.dirty = true;
                 node.n.x += dx;
                 node.n.y += dy;
+                if ((node.n.x +node.n.w/2) >= space_width) {
+                    node.n.x = space_width -node.n.w/2;
+                }
+                if ((node.n.y +node.n.h/2) >= space_height) {
+                    node.n.y = space_height -node.n.h/2;
+                }
                 node.n.dirty = true;
                 if (node.n.type === "group") {
                     RED.group.markDirty(node.n);
@@ -336,17 +345,17 @@ RED.view.tools = (function() {
 
     }
 
-    function addNode() {
-        var selection = RED.view.selection();
-        if (selection.nodes && selection.nodes.length === 1 && selection.nodes[0].outputs > 0) {
-            var selectedNode = selection.nodes[0];
-            RED.view.showQuickAddDialog([
-                selectedNode.x + selectedNode.w + 50,selectedNode.y
-            ])
-        } else {
-            RED.view.showQuickAddDialog();
-        }
-    }
+    // function addNode() {
+    //     var selection = RED.view.selection();
+    //     if (selection.nodes && selection.nodes.length === 1 && selection.nodes[0].outputs > 0) {
+    //         var selectedNode = selection.nodes[0];
+    //         RED.view.showQuickAddDialog([
+    //             selectedNode.x + selectedNode.w + 50,selectedNode.y
+    //         ])
+    //     } else {
+    //         RED.view.showQuickAddDialog();
+    //     }
+    // }
 
 
     function gotoNearestNode(direction) {
@@ -814,7 +823,10 @@ RED.view.tools = (function() {
      * @param {Object || Object[]} wires The wire(s) to split and replace with link-out, link-in nodes.
      */
     function splitWiresWithLinkNodes(wires) {
-        let wiresToSplit = wires || RED.view.selection().links;
+        let wiresToSplit = wires || (RED.view.selection().links && RED.view.selection().links.filter(e => !e.link));
+        if (!wiresToSplit) {
+            return
+        }
         if (!Array.isArray(wiresToSplit)) {
             wiresToSplit = [wiresToSplit];
         }
@@ -976,13 +988,14 @@ RED.view.tools = (function() {
      *  - it uses `<paletteLabel> <N>` - where N is the next available integer that
      *    doesn't clash with any existing nodes of that type
      * @param {Object} node The node to set the name of - if not provided, uses current selection
+     * @param {{ renameBlank: boolean, renameClash: boolean, generateHistory: boolean }} options Possible options are `renameBlank`, `renameClash` and `generateHistory`
      */
     function generateNodeNames(node, options) {
-        options = options || {
+        options = Object.assign({
             renameBlank: true,
             renameClash: true,
             generateHistory: true
-        }
+        }, options)
         let nodes = node;
         if (node) {
             if (!Array.isArray(node)) {
@@ -1047,6 +1060,138 @@ RED.view.tools = (function() {
         }
     }
 
+    function addJunctionsToWires(wires) {
+        let wiresToSplit = wires || (RED.view.selection().links && RED.view.selection().links.filter(e => !e.link));
+        if (!wiresToSplit) {
+            return
+        }
+        if (!Array.isArray(wiresToSplit)) {
+            wiresToSplit = [wiresToSplit];
+        }
+        if (wiresToSplit.length === 0) {
+            return;
+        }
+
+        var removedLinks = new Set()
+        var addedLinks = []
+        var addedJunctions = []
+
+        var groupedLinks = {}
+        wiresToSplit.forEach(function(l) {
+            var sourceId = l.source.id+":"+l.sourcePort
+            groupedLinks[sourceId] = groupedLinks[sourceId] || []
+            groupedLinks[sourceId].push(l)
+
+            groupedLinks[l.target.id] = groupedLinks[l.target.id] || []
+            groupedLinks[l.target.id].push(l)
+        });
+        var linkGroups = Object.keys(groupedLinks)
+        linkGroups.sort(function(A,B) {
+            return groupedLinks[B].length - groupedLinks[A].length
+        })
+        const wasDirty = RED.nodes.dirty()
+        linkGroups.forEach(function(gid) {
+            var links = groupedLinks[gid]
+            var junction = {
+                _def: {defaults:{}},
+                type: 'junction',
+                z: RED.workspaces.active(),
+                id: RED.nodes.id(),
+                x: 0,
+                y: 0,
+                w: 0, h: 0,
+                outputs: 1,
+                inputs: 1,
+                dirty: true
+            }
+            links = links.filter(function(l) { return !removedLinks.has(l) })
+            if (links.length === 0) {
+                return
+            }
+            let pointCount = 0
+            links.forEach(function(l) {
+                if (l._sliceLocation) {
+                    junction.x += l._sliceLocation.x
+                    junction.y += l._sliceLocation.y
+                    delete l._sliceLocation
+                    pointCount++
+                } else {
+                    junction.x += l.source.x + l.source.w/2 + l.target.x - l.target.w/2
+                    junction.y += l.source.y + l.target.y
+                    pointCount += 2
+                }
+            })
+            junction.x = Math.round(junction.x/pointCount)
+            junction.y = Math.round(junction.y/pointCount)
+            if (RED.view.snapGrid) {
+                let gridSize = RED.view.gridSize()
+                junction.x = (gridSize*Math.round(junction.x/gridSize));
+                junction.y = (gridSize*Math.round(junction.y/gridSize));
+            }
+
+            var nodeGroups = new Set()
+
+            RED.nodes.addJunction(junction)
+            addedJunctions.push(junction)
+            let newLink
+            if (gid === links[0].source.id+":"+links[0].sourcePort) {
+                newLink = {
+                    source: links[0].source,
+                    sourcePort: links[0].sourcePort,
+                    target: junction
+                }
+            } else {
+                newLink = {
+                    source: junction,
+                    sourcePort: 0,
+                    target: links[0].target
+                }
+            }
+            addedLinks.push(newLink)
+            RED.nodes.addLink(newLink)
+            links.forEach(function(l) {
+                removedLinks.add(l)
+                RED.nodes.removeLink(l)
+                let newLink
+                if (gid === l.target.id) {
+                    newLink = {
+                        source: l.source,
+                        sourcePort: l.sourcePort,
+                        target: junction
+                    }
+                } else {
+                    newLink = {
+                        source: junction,
+                        sourcePort: 0,
+                        target: l.target
+                    }
+                }
+                addedLinks.push(newLink)
+                RED.nodes.addLink(newLink)
+                nodeGroups.add(l.source.g || "__NONE__")
+                nodeGroups.add(l.target.g || "__NONE__")
+            })
+            if (nodeGroups.size === 1) {
+                var group = nodeGroups.values().next().value
+                if (group !== "__NONE__") {
+                    RED.group.addToGroup(RED.nodes.group(group), junction)
+                }
+            }
+        })
+        if (addedJunctions.length > 0) {
+            RED.history.push({
+                dirty: wasDirty,
+                t: 'add',
+                links: addedLinks,
+                junctions: addedJunctions,
+                removedLinks: Array.from(removedLinks)
+            })
+            RED.nodes.dirty(true)
+            RED.view.select({nodes: addedJunctions });
+        }
+        RED.view.redraw(true);
+    }
+
     return {
         init: function() {
             RED.actions.add("core:show-selected-node-labels", function() { setSelectedNodeLabelState(true); })
@@ -1109,6 +1254,7 @@ RED.view.tools = (function() {
             RED.actions.add("core:wire-node-to-multiple", function() { wireNodeToMultiple() })
 
             RED.actions.add("core:split-wire-with-link-nodes", function () { splitWiresWithLinkNodes() });
+            RED.actions.add("core:split-wires-with-junctions", function () { addJunctionsToWires() });
 
             RED.actions.add("core:generate-node-names", generateNodeNames )
 
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
index a95bc91e4..8c7ea22a3 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
@@ -95,6 +95,7 @@ RED.view = (function() {
     let flashingNodeId;
 
     var clipboard = "";
+    let clipboardSource
 
     // Note: these are the permitted status colour aliases. The actual RGB values
     //       are set in the CSS - flow.scss/colors.scss
@@ -172,7 +173,8 @@ RED.view = (function() {
             length: function() { return set.length},
             get: function(i) { return set[i] },
             forEach: function(func) { set.forEach(func) },
-            nodes: function() { return set.map(function(n) { return n.n })}
+            nodes: function() { return set.map(function(n) { return n.n })},
+            has: function(node) { return setIds.has(node.id) }
         }
         return api;
     })();
@@ -204,13 +206,16 @@ RED.view = (function() {
 
     function init() {
 
-// setTimeout(function() {
-//     function snap(p) { return RED.view.gridSize() * Math.round(p/RED.view.gridSize())}; for (var i = 0;i<10;i++) {
-//     RED.nodes.addJunction({_def:{defaults:{}}, type:'junction', z:"0ccdc1d81f2729cc",id:RED.nodes.id(),x:snap(Math.floor(Math.random()*600)),y:snap(Math.floor(Math.random()*600)), w:0,h:0})
-// } ; RED.view.redraw(true)
-// },2000)
         chart = $("#red-ui-workspace-chart");
-
+        chart.on('contextmenu', function(evt) {
+            evt.preventDefault()
+            evt.stopPropagation()
+            RED.contextMenu.show({
+                x:evt.clientX-5,
+                y:evt.clientY-5
+            })
+            return false
+        })
         outer = d3.select("#red-ui-workspace-chart")
             .append("svg:svg")
             .attr("width", space_width)
@@ -234,6 +239,7 @@ RED.view = (function() {
             .on("mousedown", canvasMouseDown)
             .on("mouseup", canvasMouseUp)
             .on("mouseenter", function() {
+                d3.select(document).on('mouseup.red-ui-workspace-tracker', null)
                 if (lasso) {
                     if (d3.event.buttons !== 1) {
                         lasso.remove();
@@ -249,6 +255,7 @@ RED.view = (function() {
                     }
                 }
             })
+            .on("mouseleave", canvasMouseLeave)
             .on("touchend", function() {
                 d3.event.preventDefault();
                 clearTimeout(touchStartTime);
@@ -389,6 +396,9 @@ RED.view = (function() {
         drag_lines = [];
 
         RED.events.on("workspace:change",function(event) {
+            // Just in case the mouse left the workspace whilst doing an action,
+            // put us back into default mode so the refresh works
+            mouse_mode = 0
             if (event.old !== 0) {
                 workspaceScrollPositions[event.old] = {
                     left:chart.scrollLeft(),
@@ -530,6 +540,23 @@ RED.view = (function() {
                 nn.x = mousePos[0];
                 nn.y = mousePos[1];
 
+                var minX = nn.w/2 -5;
+                if (nn.x < minX) {
+                    nn.x = minX;
+                }
+                var minY = nn.h/2 -5;
+                if (nn.y < minY) {
+                    nn.y = minY;
+                }
+                var maxX = space_width -nn.w/2 +5;
+                if (nn.x > maxX) {
+                    nn.x = maxX;
+                }
+                var maxY = space_height -nn.h +5;
+                if (nn.y > maxY) {
+                    nn.y = maxY;
+                }
+
                 if (snapGrid) {
                     var gridOffset = RED.view.tools.calculateGridSnapOffsets(nn);
                     nn.x -= gridOffset.x;
@@ -602,8 +629,10 @@ RED.view = (function() {
         });
 
         RED.actions.add("core:copy-selection-to-internal-clipboard",copySelection);
-        RED.actions.add("core:cut-selection-to-internal-clipboard",function(){copySelection();deleteSelection();});
-        RED.actions.add("core:paste-from-internal-clipboard",function(){importNodes(clipboard,{generateIds: true, generateDefaultNames: true});});
+        RED.actions.add("core:cut-selection-to-internal-clipboard",function(){copySelection(true);deleteSelection();});
+        RED.actions.add("core:paste-from-internal-clipboard",function(){
+            importNodes(clipboard,{generateIds: clipboardSource === 'copy', generateDefaultNames: clipboardSource === 'copy'});
+        });
 
         RED.actions.add("core:detach-selected-nodes", function() { detachSelectedNodes() })
 
@@ -959,8 +988,10 @@ RED.view = (function() {
     }
 
     function canvasMouseDown() {
-        if (RED.view.DEBUG) { console.warn("canvasMouseDown", mouse_mode); }
-        var point;
+        if (RED.view.DEBUG) {
+            console.warn("canvasMouseDown", { mouse_mode, point: d3.mouse(this), event: d3.event });
+        }
+        RED.contextMenu.hide();
         if (mouse_mode === RED.state.SELECTING_NODE) {
             d3.event.stopPropagation();
             return;
@@ -973,49 +1004,56 @@ RED.view = (function() {
             scroll_position = [chart.scrollLeft(),chart.scrollTop()];
             return;
         }
-        if (!mousedown_node && !mousedown_link && !mousedown_group) {
+        if (d3.event.button === 2) {
+            return
+        }
+        if (!mousedown_node && !mousedown_link && !mousedown_group && !d3.event.shiftKey) {
             selectedLinks.clear();
             updateSelection();
         }
-        if (mouse_mode === 0) {
-            if (lasso) {
-                lasso.remove();
-                lasso = null;
-            }
+        if (mouse_mode === 0 && lasso) {
+            lasso.remove();
+            lasso = null;
         }
-        if ((mouse_mode === 0 || mouse_mode === RED.state.QUICK_JOINING) && (d3.event.touches || d3.event.button === 0) && (d3.event.metaKey || d3.event.ctrlKey)) {
-            // Trigger quick add dialog
-            d3.event.stopPropagation();
-            clearSelection();
-            point = d3.mouse(this);
-            var clickedGroup = getGroupAt(point[0],point[1]);
-            if (drag_lines.length > 0) {
-                clickedGroup = clickedGroup || RED.nodes.group(drag_lines[0].node.g)
+        if (d3.event.touches || d3.event.button === 0) {
+            if ((mouse_mode === 0 || mouse_mode === RED.state.QUICK_JOINING) && (d3.event.metaKey || d3.event.ctrlKey) && !(d3.event.altKey || d3.event.shiftKey)) {
+                // Trigger quick add dialog
+                d3.event.stopPropagation();
+                clearSelection();
+                const point = d3.mouse(this);
+                var clickedGroup = getGroupAt(point[0], point[1]);
+                if (drag_lines.length > 0) {
+                    clickedGroup = clickedGroup || RED.nodes.group(drag_lines[0].node.g)
+                }
+                showQuickAddDialog({ position: point, group: clickedGroup });
+            } else if (mouse_mode === 0 && !(d3.event.metaKey || d3.event.ctrlKey)) {
+                // CTRL not being held
+                if (!d3.event.altKey) {
+                    // ALT not held (shift is allowed) Trigger lasso
+                    if (!touchStartTime) {
+                        const point = d3.mouse(this);
+                        lasso = eventLayer.append("rect")
+                            .attr("ox", point[0])
+                            .attr("oy", point[1])
+                            .attr("rx", 1)
+                            .attr("ry", 1)
+                            .attr("x", point[0])
+                            .attr("y", point[1])
+                            .attr("width", 0)
+                            .attr("height", 0)
+                            .attr("class", "nr-ui-view-lasso");
+                        d3.event.preventDefault();
+                    }
+                } else if (d3.event.altKey) {
+                    //Alt [+shift] held - Begin slicing
+                    clearSelection();
+                    mouse_mode = (d3.event.shiftKey) ? RED.state.SLICING_JUNCTION : RED.state.SLICING;
+                    const point = d3.mouse(this);
+                    slicePath = eventLayer.append("path").attr("class", "nr-ui-view-slice").attr("d", `M${point[0]} ${point[1]}`)
+                    slicePathLast = point;
+                    RED.view.redraw();
+                }
             }
-            showQuickAddDialog({position:point, group:clickedGroup});
-        } else if (mouse_mode === 0 && (d3.event.touches || d3.event.button === 0) && !(d3.event.metaKey || d3.event.ctrlKey)) {
-            // Tigger lasso
-            if (!touchStartTime) {
-                point = d3.mouse(this);
-                lasso = eventLayer.append("rect")
-                .attr("ox",point[0])
-                .attr("oy",point[1])
-                .attr("rx",1)
-                .attr("ry",1)
-                .attr("x",point[0])
-                .attr("y",point[1])
-                .attr("width",0)
-                .attr("height",0)
-                .attr("class","nr-ui-view-lasso");
-                d3.event.preventDefault();
-            }
-        } else if (mouse_mode === 0 && d3.event.button === 2 && (d3.event.metaKey || d3.event.ctrlKey || d3.event.shiftKey)) {
-            clearSelection();
-            mouse_mode = (d3.event.metaKey || d3.event.ctrlKey)?RED.state.SLICING : RED.state.SLICING_JUNCTION;
-            point = d3.mouse(this);
-            slicePath = eventLayer.append("path").attr("class","nr-ui-view-slice").attr("d",`M${point[0]} ${point[1]}`)
-            slicePathLast = point;
-            RED.view.redraw();
         }
     }
 
@@ -1023,6 +1061,7 @@ RED.view = (function() {
         options = options || {};
         var point = options.position || lastClickPosition;
         var spliceLink = options.splice;
+        var spliceMultipleLinks = options.spliceMultiple
         var targetGroup = options.group;
         var touchTrigger = options.touchTrigger;
 
@@ -1035,6 +1074,10 @@ RED.view = (function() {
         var ox = point[0];
         var oy = point[1];
 
+        const offset = $("#red-ui-workspace-chart").offset()
+        var clientX = ox + offset.left - $("#red-ui-workspace-chart").scrollLeft()
+        var clientY = oy + offset.top - $("#red-ui-workspace-chart").scrollTop()
+
         if (RED.settings.get("editor").view['view-snap-grid']) {
             // eventLayer.append("circle").attr("cx",point[0]).attr("cy",point[1]).attr("r","2").attr('fill','red')
             point[0] = Math.round(point[0] / gridSize) * gridSize;
@@ -1086,8 +1129,12 @@ RED.view = (function() {
             }
             hideDragLines();
         }
-        if (spliceLink) {
-            filter = {input:true, output:true}
+        if (spliceLink || spliceMultipleLinks) {
+            filter = {
+                input:true,
+                output:true,
+                spliceMultiple: spliceMultipleLinks
+            }
         }
 
         var rebuildQuickAddLink = function() {
@@ -1112,8 +1159,8 @@ RED.view = (function() {
         var lastAddedWidth;
 
         RED.typeSearch.show({
-            x:d3.event.clientX-mainPos.left-node_width/2 - (ox-point[0]),
-            y:d3.event.clientY-mainPos.top+ node_height/2 + 5 - (oy-point[1]),
+            x:clientX-mainPos.left-node_width/2 - (ox-point[0]),
+            y:clientY-mainPos.top+ node_height/2 + 5 - (oy-point[1]),
             disableFocus: touchTrigger,
             filter: filter,
             move: function(dx,dy) {
@@ -1141,7 +1188,7 @@ RED.view = (function() {
                 hideDragLines();
                 redraw();
             },
-            add: function(type,keepAdding) {
+            add: function(type, keepAdding) {
                 if (touchTrigger) {
                     keepAdding = false;
                     resetMouseVars();
@@ -1149,7 +1196,13 @@ RED.view = (function() {
 
                 var nn;
                 var historyEvent;
-                if (type === 'junction') {
+                if (/^_action_:/.test(type)) {
+                    const actionName = type.substring(9)
+                    quickAddActive = false;
+                    ghostNode.remove();
+                    RED.actions.invoke(actionName)
+                    return
+                } else if (type === 'junction') {
                     nn = {
                         _def: {defaults:{}},
                         type: 'junction',
@@ -1715,12 +1768,24 @@ RED.view = (function() {
             redraw();
         }
     }
-
+    function canvasMouseLeave() {
+        if (mouse_mode !== 0 && d3.event.buttons !== 0) {
+            d3.select(document).on('mouseup.red-ui-workspace-tracker', function() {
+                d3.select(document).on('mouseup.red-ui-workspace-tracker', null)
+                canvasMouseUp.call(this)
+            })
+        }
+    }
     function canvasMouseUp() {
         lastClickPosition = [d3.event.offsetX/scaleFactor,d3.event.offsetY/scaleFactor];
-        if (RED.view.DEBUG) { console.warn("canvasMouseUp", mouse_mode); }
+        if (RED.view.DEBUG) {
+            console.warn("canvasMouseUp", { mouse_mode, point: d3.mouse(this), event: d3.event });
+        }
         var i;
         var historyEvent;
+        if (d3.event.button === 2) {
+            return
+        }
         if (mouse_mode === RED.state.PANNING) {
             resetMouseVars();
             return
@@ -1812,8 +1877,20 @@ RED.view = (function() {
                     }
                 }
             })
-
-
+            activeLinks.forEach(function(link) {
+                if (!link.selected) {
+                    var sourceY = link.source.y
+                    var targetY = link.target.y
+                    var sourceX = link.source.x+(link.source.w/2) + 10
+                    var targetX = link.target.x-(link.target.w/2) - 10
+                    if (
+                        sourceX > x && sourceX < x2 && sourceY > y && sourceY < y2 &&
+                        targetX > x && targetX < x2 && targetY > y && targetY < y2
+                    ) {
+                        selectedLinks.add(link);
+                    }
+                }
+            })
 
             // var selectionChanged = false;
             // do {
@@ -1861,86 +1938,118 @@ RED.view = (function() {
             slicePath = null;
             RED.view.redraw(true);
         } else if (mouse_mode == RED.state.SLICING_JUNCTION) {
-            var removedLinks = []
-            var addedLinks = []
-            var addedJunctions = []
-
-            var groupedLinks = {}
-            selectedLinks.forEach(function(l) {
-                var sourceId = l.source.id+":"+l.sourcePort
-                groupedLinks[sourceId] = groupedLinks[sourceId] || []
-                groupedLinks[sourceId].push(l)
-            });
-            var linkGroups = Object.keys(groupedLinks)
-            linkGroups.forEach(function(gid) {
-                var links = groupedLinks[gid]
-                var junction = {
-                    _def: {defaults:{}},
-                    type: 'junction',
-                    z: RED.workspaces.active(),
-                    id: RED.nodes.id(),
-                    x: 0,
-                    y: 0,
-                    w: 0, h: 0,
-                    outputs: 1,
-                    inputs: 1,
-                    dirty: true
-                }
-                links.forEach(function(l) {
-                    junction.x += l._sliceLocation.x
-                    junction.y += l._sliceLocation.y
-                })
-                junction.x = Math.round(junction.x/links.length)
-                junction.y = Math.round(junction.y/links.length)
-                if (snapGrid) {
-                    junction.x = (gridSize*Math.round(junction.x/gridSize));
-                    junction.y = (gridSize*Math.round(junction.y/gridSize));
-                }
-
-                var nodeGroups = new Set()
-
-                RED.nodes.addJunction(junction)
-                addedJunctions.push(junction)
-                var newLink = {
-                    source: links[0].source,
-                    sourcePort: links[0].sourcePort,
-                    target: junction
-                }
-                addedLinks.push(newLink)
-                RED.nodes.addLink(newLink)
-                links.forEach(function(l) {
-                    removedLinks.push(l)
-                    RED.nodes.removeLink(l)
-                    var newLink = {
-                        source: junction,
-                        sourcePort: 0,
-                        target: l.target
-                    }
-                    addedLinks.push(newLink)
-                    RED.nodes.addLink(newLink)
-                    nodeGroups.add(l.source.g || "__NONE__")
-                    nodeGroups.add(l.target.g || "__NONE__")
-                })
-                if (nodeGroups.size === 1) {
-                    var group = nodeGroups.values().next().value
-                    if (group !== "__NONE__") {
-                        RED.group.addToGroup(RED.nodes.group(group), junction)
-                    }
-                }
-            })
+            RED.actions.invoke("core:split-wires-with-junctions")
             slicePath.remove();
             slicePath = null;
 
-            if (addedJunctions.length > 0) {
-                RED.history.push({
-                    t: 'add',
-                    links: addedLinks,
-                    junctions: addedJunctions,
-                    removedLinks: removedLinks
-                })
-                RED.nodes.dirty(true)
-            }
-            RED.view.redraw(true);
+            // var removedLinks = new Set()
+            // var addedLinks = []
+            // var addedJunctions = []
+            //
+            // var groupedLinks = {}
+            // selectedLinks.forEach(function(l) {
+            //     var sourceId = l.source.id+":"+l.sourcePort
+            //     groupedLinks[sourceId] = groupedLinks[sourceId] || []
+            //     groupedLinks[sourceId].push(l)
+            //
+            //     groupedLinks[l.target.id] = groupedLinks[l.target.id] || []
+            //     groupedLinks[l.target.id].push(l)
+            // });
+            // var linkGroups = Object.keys(groupedLinks)
+            // linkGroups.sort(function(A,B) {
+            //     return groupedLinks[B].length - groupedLinks[A].length
+            // })
+            // linkGroups.forEach(function(gid) {
+            //     var links = groupedLinks[gid]
+            //     var junction = {
+            //         _def: {defaults:{}},
+            //         type: 'junction',
+            //         z: RED.workspaces.active(),
+            //         id: RED.nodes.id(),
+            //         x: 0,
+            //         y: 0,
+            //         w: 0, h: 0,
+            //         outputs: 1,
+            //         inputs: 1,
+            //         dirty: true
+            //     }
+            //     links = links.filter(function(l) { return !removedLinks.has(l) })
+            //     if (links.length === 0) {
+            //         return
+            //     }
+            //     links.forEach(function(l) {
+            //         junction.x += l._sliceLocation.x
+            //         junction.y += l._sliceLocation.y
+            //     })
+            //     junction.x = Math.round(junction.x/links.length)
+            //     junction.y = Math.round(junction.y/links.length)
+            //     if (snapGrid) {
+            //         junction.x = (gridSize*Math.round(junction.x/gridSize));
+            //         junction.y = (gridSize*Math.round(junction.y/gridSize));
+            //     }
+            //
+            //     var nodeGroups = new Set()
+            //
+            //     RED.nodes.addJunction(junction)
+            //     addedJunctions.push(junction)
+            //     let newLink
+            //     if (gid === links[0].source.id+":"+links[0].sourcePort) {
+            //         newLink = {
+            //             source: links[0].source,
+            //             sourcePort: links[0].sourcePort,
+            //             target: junction
+            //         }
+            //     } else {
+            //         newLink = {
+            //             source: junction,
+            //             sourcePort: 0,
+            //             target: links[0].target
+            //         }
+            //     }
+            //     addedLinks.push(newLink)
+            //     RED.nodes.addLink(newLink)
+            //     links.forEach(function(l) {
+            //         removedLinks.add(l)
+            //         RED.nodes.removeLink(l)
+            //         let newLink
+            //         if (gid === l.target.id) {
+            //             newLink = {
+            //                 source: l.source,
+            //                 sourcePort: l.sourcePort,
+            //                 target: junction
+            //             }
+            //         } else {
+            //             newLink = {
+            //                 source: junction,
+            //                 sourcePort: 0,
+            //                 target: l.target
+            //             }
+            //         }
+            //         addedLinks.push(newLink)
+            //         RED.nodes.addLink(newLink)
+            //         nodeGroups.add(l.source.g || "__NONE__")
+            //         nodeGroups.add(l.target.g || "__NONE__")
+            //     })
+            //     if (nodeGroups.size === 1) {
+            //         var group = nodeGroups.values().next().value
+            //         if (group !== "__NONE__") {
+            //             RED.group.addToGroup(RED.nodes.group(group), junction)
+            //         }
+            //     }
+            // })
+            // slicePath.remove();
+            // slicePath = null;
+            //
+            // if (addedJunctions.length > 0) {
+            //     RED.history.push({
+            //         t: 'add',
+            //         links: addedLinks,
+            //         junctions: addedJunctions,
+            //         removedLinks: Array.from(removedLinks)
+            //     })
+            //     RED.nodes.dirty(true)
+            // }
+            // RED.view.redraw(true);
         }
         if (mouse_mode == RED.state.MOVING_ACTIVE) {
             if (movingSet.length() > 0) {
@@ -2043,6 +2152,9 @@ RED.view = (function() {
             }
         }
         if (mouse_mode == RED.state.IMPORT_DRAGGING) {
+            if (clipboardSource === 'cut') {
+                clipboardSource = 'copy'
+            }
             updateActiveNodes();
             RED.nodes.dirty(true);
         }
@@ -2597,7 +2709,7 @@ RED.view = (function() {
         }
     }
 
-    function copySelection() {
+    function copySelection(isCut) {
         if (mouse_mode === RED.state.SELECTING_NODE) {
             return;
         }
@@ -2661,6 +2773,7 @@ RED.view = (function() {
                 }
             }
             clipboard = JSON.stringify(nns);
+            clipboardSource = isCut ? 'cut' : 'copy'
             RED.menu.setDisabled("menu-item-edit-paste", false);
             if (nodeCount > 0) {
                 RED.notify(RED._("clipboard.nodeCopied",{count:nodeCount}),{id:"clipboard"});
@@ -2801,6 +2914,7 @@ RED.view = (function() {
 
     function portMouseDown(d,portType,portIndex, evt) {
         if (RED.view.DEBUG) { console.warn("portMouseDown", mouse_mode,d,portType,portIndex); }
+        RED.contextMenu.hide();
         evt = evt || d3.event;
         if (evt === 1) {
             return;
@@ -2917,7 +3031,7 @@ RED.view = (function() {
                     } else if (drag_line.portType === PORT_TYPE_INPUT) {
                         src = mouseup_node;
                         dst = drag_line.node;
-                        src_port = portIndex;
+                        src_port = portIndex || 0;
                     }
                     var link = {source: src, sourcePort:src_port, target: dst};
                     if (drag_line.virtualLink) {
@@ -3179,11 +3293,17 @@ RED.view = (function() {
 
         if (active && ((portType === PORT_TYPE_INPUT && ((d._def && d._def.inputLabels)||d.inputLabels)) || (portType === PORT_TYPE_OUTPUT && ((d._def && d._def.outputLabels)||d.outputLabels)))) {
             portLabelHoverTimeout = setTimeout(function() {
+                const n = port && port.node()
+                const nId = n && n.__data__ && n.__data__.id
+                //check see if node has been deleted since timeout started
+                if(!n || !n.parentNode || !RED.nodes.node(n.__data__.id)) {
+                    return; //node is gone!
+                }
                 var tooltip = getPortLabel(d,portType,portIndex);
                 if (!tooltip) {
                     return;
                 }
-                var pos = getElementPosition(port.node());
+                var pos = getElementPosition(n);
                 portLabelHoverTimeout = null;
                 portLabelHover = showTooltip(
                     (pos[0]+(portType===PORT_TYPE_INPUT?-2:12)),
@@ -3208,52 +3328,16 @@ RED.view = (function() {
         port.classed("red-ui-flow-port-hovered",false);
     }
 
-    function junctionMouseOver(junction, d) {
-        junction.classed("red-ui-flow-junction-hovered",true);
+    function junctionMouseOver(junction, d, portType) {
+        var active = (portType === undefined) ||
+                     (mouse_mode !== RED.state.JOINING && mouse_mode !== RED.state.QUICK_JOINING) ||
+                     (drag_lines.length > 0 && drag_lines[0].portType !== portType && !drag_lines[0].virtualLink)
+        junction.classed("red-ui-flow-junction-hovered", active);
     }
     function junctionMouseOut(junction, d) {
         junction.classed("red-ui-flow-junction-hovered",false);
     }
 
-    function junctionMouseDown(junction, d, evt) {
-        if (RED.view.DEBUG) { console.warn("junctionMouseDown", d); }
-        evt = evt || d3.event;
-        d3.event = evt
-        if (evt === 1) {
-            return;
-        }
-        if (mouse_mode === RED.state.SELECTING_NODE) {
-            evt.stopPropagation();
-            return;
-        }
-        if (mouse_mode == RED.state.QUICK_JOINING) {
-            d3.event.stopPropagation();
-            return;
-        }
-
-        // mousedown_node = d;
-        // mousedown_port_type = portType;
-        // mousedown_port_index = portIndex || 0;
-        if (mouse_mode !== RED.state.QUICK_JOINING && (evt.ctrlKey || evt.metaKey)) {
-            mouse_mode = RED.state.QUICK_JOINING;
-            document.body.style.cursor = "crosshair";
-            showDragLines([{node:d,port:0,portType: PORT_TYPE_OUTPUT}]);
-            $(window).on('keyup',disableQuickJoinEventHandler);
-        } else if (event.button != 2) {
-            nodeMouseDown.call(junction[0][0],d)
-            // clearSelection();
-            // movingSet.add(d);
-            // mousedown_node = d;
-            // mouse_mode = RED.state.MOVING;
-            // var mouse = d3.touches(junction[0][0])[0]||d3.mouse(junction[0][0]);
-            // mouse[0] += d.x-d.w/2;
-            // mouse[1] += d.y-d.h/2;
-            // prepareDrag(mouse);
-        }
-        evt.stopPropagation();
-        evt.preventDefault();
-    }
-
     function prepareDrag(mouse) {
         mouse_mode = RED.state.MOVING;
         // Called when movingSet should be prepared to be dragged
@@ -3345,6 +3429,7 @@ RED.view = (function() {
     function nodeMouseDown(d) {
         if (RED.view.DEBUG) { console.warn("nodeMouseDown", mouse_mode,d); }
         focusView();
+        RED.contextMenu.hide();
         if (d3.event.button === 1) {
             return;
         }
@@ -3405,6 +3490,9 @@ RED.view = (function() {
             updateSelection();
             RED.nodes.dirty(true);
             redraw();
+            if (clipboardSource === 'cut') {
+                clipboardSource = 'copy'
+            }
             resetMouseVars();
             d3.event.stopPropagation();
             return;
@@ -3413,6 +3501,9 @@ RED.view = (function() {
             return;
         } else if (mouse_mode === RED.state.SELECTING_NODE) {
             d3.event.stopPropagation();
+            if (d.type === 'junction') {
+                return
+            }
             if (selectNodesOptions.single) {
                 selectNodesOptions.done(d);
                 return;
@@ -3439,12 +3530,12 @@ RED.view = (function() {
         var now = Date.now();
         clickElapsed = now-clickTime;
         clickTime = now;
-        dblClickPrimed = (lastClickNode == mousedown_node &&
+        dblClickPrimed = lastClickNode == mousedown_node &&
             (d3.event.touches || d3.event.button === 0) &&
             !d3.event.shiftKey && !d3.event.altKey &&
-            clickElapsed < dblClickInterval
-            )
-            lastClickNode = mousedown_node;
+            clickElapsed < dblClickInterval &&
+            d.type !== 'junction'
+        lastClickNode = mousedown_node;
 
         if (!d.selected && d.g /*&& !RED.nodes.group(d.g).selected*/) {
             var nodeGroup = RED.nodes.group(d.g);
@@ -3570,9 +3661,9 @@ RED.view = (function() {
                     clearSelection();
                 }
                 var clickPosition = (d3.event.offsetX/scaleFactor - mousedown_node.x)
-                var edgeDelta = (mousedown_node.w/2) - Math.abs(clickPosition);
+                var edgeDelta = ((mousedown_node.w||10)/2) - Math.abs(clickPosition);
                 var cnodes;
-                var targetEdgeDelta = mousedown_node.w > 30 ? 25 : 8;
+                var targetEdgeDelta = mousedown_node.w > 30 ? 25 : (mousedown_node.w > 0 ? 8 : 3);
                 if (edgeDelta < targetEdgeDelta) {
                     if (clickPosition < 0) {
                         cnodes = [mousedown_node].concat(RED.nodes.getAllUpstreamNodes(mousedown_node));
@@ -3649,6 +3740,10 @@ RED.view = (function() {
             if (d.hasOwnProperty('l')?!d.l : (d.type === "link in" || d.type === "link out")) {
                 var parentNode = this.parentNode;
                 portLabelHoverTimeout = setTimeout(function() {
+                    //check see if node has been deleted since timeout started
+                    if(!parentNode || !parentNode.parentNode || !RED.nodes.node(parentNode.id)) {
+                        return; //node is gone!
+                    }
                     var tooltip;
                     if (d._def.label) {
                         tooltip = d._def.label;
@@ -3717,12 +3812,14 @@ RED.view = (function() {
     function portMouseOverProxy(e) { portMouseOver(d3.select(this), this.__data__,this.__portType__,this.__portIndex__, e); }
     function portMouseOutProxy(e) { portMouseOut(d3.select(this), this.__data__,this.__portType__,this.__portIndex__, e); }
 
-    function junctionMouseOverProxy(e) { junctionMouseOver(d3.select(this), this.__data__) }
+    function junctionMouseOverProxy(e) { junctionMouseOver(d3.select(this), this.__data__, this.__portType__) }
     function junctionMouseOutProxy(e) { junctionMouseOut(d3.select(this), this.__data__) }
-    function junctionMouseDownProxy(e) { junctionMouseDown(d3.select(this), this.__data__, e) }
-    function junctionMouseUpProxy(e) { junctionMouseUp(d3.select(this), this.__data__) }
 
     function linkMouseDown(d) {
+        if (RED.view.DEBUG) {
+            console.warn("linkMouseDown", { mouse_mode, point: d3.mouse(this), event: d3.event });
+        }
+        RED.contextMenu.hide();
         if (mouse_mode === RED.state.SELECTING_NODE) {
             d3.event.stopPropagation();
             return;
@@ -3782,6 +3879,9 @@ RED.view = (function() {
     }
 
     function groupMouseUp(g) {
+        if (RED.view.DEBUG) {
+            console.warn("groupMouseUp", { mouse_mode, event: d3.event });
+        }
         if (dblClickPrimed && mousedown_group == g && clickElapsed > 0 && clickElapsed < dblClickInterval) {
             mouse_mode = RED.state.DEFAULT;
             RED.editor.editGroup(g);
@@ -3797,6 +3897,10 @@ RED.view = (function() {
         //     return
         // }
 
+        if (RED.view.DEBUG) {
+            console.warn("groupMouseDown", { mouse_mode, point: mouse, event: d3.event });
+        }
+        RED.contextMenu.hide();
         focusView();
         if (d3.event.button === 1) {
             return;
@@ -4002,7 +4106,7 @@ RED.view = (function() {
         var mdn = mousedown_node;
         var options = [];
         options.push({name:"delete",disabled:(movingSet.length()===0 && selectedLinks.length() === 0),onselect:function() {deleteSelection();}});
-        options.push({name:"cut",disabled:(movingSet.length()===0),onselect:function() {copySelection();deleteSelection();}});
+        options.push({name:"cut",disabled:(movingSet.length()===0),onselect:function() {copySelection(true);deleteSelection();}});
         options.push({name:"copy",disabled:(movingSet.length()===0),onselect:function() {copySelection();}});
         options.push({name:"paste",disabled:(clipboard.length===0),onselect:function() {importNodes(clipboard, {generateIds: true, touchImport: true});}});
         options.push({name:"edit",disabled:(movingSet.length() != 1),onselect:function() { RED.editor.edit(mdn);}});
@@ -4476,12 +4580,10 @@ RED.view = (function() {
                     icon_groupEl.setAttribute("y",0);
                     icon_groupEl.style["pointer-events"] = "none";
                     node[0][0].__iconGroup__ = icon_groupEl;
-                    var icon_shade = document.createElementNS("http://www.w3.org/2000/svg","rect");
+                    var icon_shade = document.createElementNS("http://www.w3.org/2000/svg","path");
                     icon_shade.setAttribute("x",0);
                     icon_shade.setAttribute("y",0);
                     icon_shade.setAttribute("class","red-ui-flow-node-icon-shade")
-                    icon_shade.setAttribute("width",30);
-                    icon_shade.setAttribute("height",Math.min(50,d.h-4));
                     icon_groupEl.appendChild(icon_shade);
                     node[0][0].__iconShade__ = icon_shade;
 
@@ -4774,9 +4876,20 @@ RED.view = (function() {
                             }
 
                             icon.attr("y",function(){return (d.h-d3.select(this).attr("height"))/2;});
-                            this.__iconShade__.setAttribute("height", d.h );
+
+
+                            const iconShadeHeight = d.h
+                            const iconShadeWidth = 30
+                            this.__iconShade__.setAttribute("d", hideLabel ?
+                                `M5 0 h${iconShadeWidth-10} a 5 5 0 0 1 5 5 v${iconShadeHeight-10} a 5 5 0 0 1 -5 5 h-${iconShadeWidth-10} a 5 5 0 0 1 -5 -5  v-${iconShadeHeight-10} a 5 5 0 0 1 5 -5` : (
+                                    "right" === d._def.align ?
+                                    `M 0 0 h${iconShadeWidth-5} a 5 5 0 0 1 5 5 v${iconShadeHeight-10} a 5 5 0 0 1 -5 5 h-${iconShadeWidth-5} v-${iconShadeHeight}` :
+                                    `M5 0 h${iconShadeWidth-5} v${iconShadeHeight} h-${iconShadeWidth-5} a 5 5 0 0 1 -5 -5  v-${iconShadeHeight-10} a 5 5 0 0 1 5 -5`
+                                    )
+                            )
+                            this.__iconShadeBorder__.style.display = hideLabel?'none':''
                             this.__iconShadeBorder__.setAttribute("d",
-                                                                  "M " + (((!d._def.align && d.inputs !== 0 && d.outputs === 0) || "right" === d._def.align) ? 0 : 30) + " 1 l 0 " + (d.h - 2)
+                                                                  "M " + (((!d._def.align && d.inputs !== 0 && d.outputs === 0) || "right" === d._def.align) ? 0.5 : 29.5) + " "+(d.selected?1:0.5)+" l 0 " + (d.h - (d.selected?2:1))
                                                                  );
                             faIcon.attr("y",(d.h+13)/2);
                         }
@@ -4793,6 +4906,9 @@ RED.view = (function() {
                         if (d._def.button) {
                             var buttonEnabled = isButtonEnabled(d);
                             this.__buttonGroup__.classList.toggle("red-ui-flow-node-button-disabled", !buttonEnabled);
+                            if (RED.runtime && Object.hasOwn(RED.runtime,'started')) {
+                                this.__buttonGroup__.classList.toggle("red-ui-flow-node-button-stopped", !RED.runtime.started);
+                            }
 
                             var x = d._def.align == "right"?d.w-6:-25;
                             if (d._def.button.toggle && !d[d._def.button.toggle]) {
@@ -4871,22 +4987,56 @@ RED.view = (function() {
                 junctionBack.setAttribute("y",-5);
                 junctionBack.setAttribute("width",10);
                 junctionBack.setAttribute("height",10);
-                junctionBack.setAttribute("rx",5);
-                junctionBack.setAttribute("ry",5);
+                junctionBack.setAttribute("rx",3);
+                junctionBack.setAttribute("ry",3);
                 junctionBack.__data__ = d;
                 this.__junctionBack__ = junctionBack;
                 contents.appendChild(junctionBack);
 
+                var junctionInput = document.createElementNS("http://www.w3.org/2000/svg","rect");
+                junctionInput.setAttribute("class","red-ui-flow-junction-port red-ui-flow-junction-port-input");
+                junctionInput.setAttribute("x",-5);
+                junctionInput.setAttribute("y",-5);
+                junctionInput.setAttribute("width",10);
+                junctionInput.setAttribute("height",10);
+                junctionInput.setAttribute("rx",3);
+                junctionInput.setAttribute("ry",3);
+                junctionInput.__data__ = d;
+                junctionInput.__portType__ = PORT_TYPE_INPUT;
+                junctionInput.__portIndex__ = 0;
+                this.__junctionInput__ = junctionOutput;
+                contents.appendChild(junctionInput);
+                junctionInput.addEventListener("mouseup", portMouseUpProxy);
+                junctionInput.addEventListener("mousedown", portMouseDownProxy);
+
+
+                this.__junctionInput__ = junctionInput;
+                contents.appendChild(junctionInput);
+                var junctionOutput = document.createElementNS("http://www.w3.org/2000/svg","rect");
+                junctionOutput.setAttribute("class","red-ui-flow-junction-port red-ui-flow-junction-port-output");
+                junctionOutput.setAttribute("x",-5);
+                junctionOutput.setAttribute("y",-5);
+                junctionOutput.setAttribute("width",10);
+                junctionOutput.setAttribute("height",10);
+                junctionOutput.setAttribute("rx",3);
+                junctionOutput.setAttribute("ry",3);
+                junctionOutput.__data__ = d;
+                junctionOutput.__portType__ = PORT_TYPE_OUTPUT;
+                junctionOutput.__portIndex__ = 0;
+                this.__junctionOutput__ = junctionOutput;
+                contents.appendChild(junctionOutput);
+                junctionOutput.addEventListener("mouseup", portMouseUpProxy);
+                junctionOutput.addEventListener("mousedown", portMouseDownProxy);
+
+                junctionOutput.addEventListener("mouseover", junctionMouseOverProxy);
+                junctionOutput.addEventListener("mouseout", junctionMouseOutProxy);
+                junctionInput.addEventListener("mouseover", junctionMouseOverProxy);
+                junctionInput.addEventListener("mouseout", junctionMouseOutProxy);
                 junctionBack.addEventListener("mouseover", junctionMouseOverProxy);
                 junctionBack.addEventListener("mouseout", junctionMouseOutProxy);
-                junctionBack.addEventListener("mouseup", portMouseUpProxy);
-                junctionBack.addEventListener("mousedown", junctionMouseDownProxy);
 
-                // d3.select(junctionBack).on("mousedown", nodeMouseDown);
-
-                this.__portType__ = PORT_TYPE_INPUT
-                this.__portIndex__ = 0
-// function portMouseUpProxy(e) { portMouseUp(this.__data__,this.__portType__,this.__portIndex__, e); }
+                // These handlers expect to be registered as d3 events
+                d3.select(junctionBack).on("mousedown", nodeMouseDown).on("mouseup", nodeMouseUp);
 
                 junction[0][0].appendChild(contents);
             })
@@ -4895,6 +5045,7 @@ RED.view = (function() {
                 var junction = d3.select(this);
                 this.setAttribute("transform", "translate(" + (d.x) + "," + (d.y) + ")");
                 if (d.dirty) {
+                    junction.classed("red-ui-flow-junction-dragging", mouse_mode === RED.state.MOVING_ACTIVE && movingSet.has(d))
                     junction.classed("selected", !!d.selected)
                     dirtyNodes[d.id] = d;
 
@@ -4935,10 +5086,11 @@ RED.view = (function() {
                     .on("touchstart",linkTouchStart)
                     .on("mousemove", function(d) {
                         if (mouse_mode === RED.state.SLICING) {
+
                             selectedLinks.add(d)
                             l.classed("red-ui-flow-link-splice",true)
                             redraw()
-                        } else if (mouse_mode === RED.state.SLICING_JUNCTION) {
+                        } else if (mouse_mode === RED.state.SLICING_JUNCTION && !d.link) {
                             if (!l.classed("red-ui-flow-link-splice")) {
                                 // Find intersection point
                                 var lineLength = pathLine.getTotalLength();
@@ -5684,7 +5836,12 @@ RED.view = (function() {
                         node.dirty = true;
                         node.dirtyStatus = true;
                         node.changed = true;
-                        RED.events.emit("nodes:change",node);
+                        if (node.type === "junction") {
+                            RED.events.emit("junctions:change",node);
+                        }
+                        else {
+                            RED.events.emit("nodes:change",node);
+                        }
                     }
                 }
             }
@@ -5747,6 +5904,7 @@ RED.view = (function() {
      * @private
      */
      function createNode(type, x, y, z) {
+        const wasDirty = RED.nodes.dirty()
         var m = /^subflow:(.+)$/.exec(type);
         var activeSubflow = z ? RED.nodes.subflow(z) : null;
         if (activeSubflow && m) {
@@ -5805,7 +5963,7 @@ RED.view = (function() {
         var historyEvent = {
             t: "add",
             nodes: [nn.id],
-            dirty: RED.nodes.dirty()
+            dirty: wasDirty
         }
         if (activeSubflow) {
             var subflowRefresh = RED.subflow.refresh(true);
@@ -6107,6 +6265,12 @@ RED.view = (function() {
         showQuickAddDialog:showQuickAddDialog,
         calculateNodeDimensions: calculateNodeDimensions,
         getElementPosition:getElementPosition,
-        showTooltip:showTooltip
+        showTooltip:showTooltip,
+        dimensions: function() {
+            return {
+                width: space_width,
+                height: space_height
+            };
+        }
     };
 })();
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js b/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js
index 673607229..1f5cdf0f1 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js
@@ -284,9 +284,22 @@ RED.workspaces = (function() {
                         onselect: "core:show-last-hidden-flow"
                     }
                 ]
-                if (hideStack.length > 0) {
+                let hiddenFlows = new Set()
+                for (let i = 0; i < hideStack.length; i++) {
+                    let ids = hideStack[i]
+                    if (!Array.isArray(ids)) {
+                        ids = [ids]
+                    }
+                    ids.forEach(id => {
+                        if (RED.nodes.workspace(id)) {
+                            hiddenFlows.add(id)
+                        }
+                    })
+                }
+                const flowCount = hiddenFlows.size;
+                if (flowCount > 0) {
                     menuItems.unshift({
-                        label: RED._("workspace.hiddenFlows",{count: hideStack.length}),
+                        label: RED._("workspace.hiddenFlows",{count: flowCount}),
                         onselect: "core:list-hidden-flows"
                     })
                 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ace.scss b/packages/node_modules/@node-red/editor-client/src/sass/ace.scss
index cd3739800..5aad96b4d 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ace.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ace.scss
@@ -2,48 +2,48 @@
 
     .ace_read-only {
         .ace_scroller {
-            background: $text-editor-background-disabled;
-            color: $text-editor-color-disabled;
+            background: var(--red-ui-text-editor-background-disabled);
+            color: var(--red-ui-text-editor-color-disabled);
         }
         .ace_cursor {
            color: transparent !important;
         }
     }
     .ace_gutter {
-        background: $text-editor-gutter-background;
+        background: var(--red-ui-text-editor-gutter-background);
         border-top-left-radius: 4px;
         border-bottom-left-radius: 4px;
     }
     .ace_scroller {
-        background: $text-editor-background;
+        background: var(--red-ui-text-editor-background);
         border-top-right-radius: 4px;
         border-bottom-right-radius: 4px;
-        color: $text-editor-color;
+        color: var(--red-ui-text-editor-color);
     }
     .ace_marker-layer .ace_active-line {
-        background: $text-editor-active-line-background;
+        background: var(--red-ui-text-editor-active-line-background);
     }
     .ace_marker-layer .ace_selection {
-        background: $text-editor-selection-background;
+        background: var(--red-ui-text-editor-selection-background);
         border-radius: 1px;
     }
     .ace_gutter-cell  {
-        color: $text-editor-color;
+        color: var(--red-ui-text-editor-gutter-color);
     }
     .ace_gutter-active-line {
-        background: $text-editor-gutter-active-line-background;
+        background: var(--red-ui-text-editor-gutter-active-line-background);
     }
     .ace_tooltip {
-        font-family: $primary-font;
+        font-family: var(--red-ui-primary-font);
         line-height: 1.4em;
         max-width: 400px;
         white-space: normal;
         background-image: none;
-        background: $popover-background;
-        color: $popover-color;
+        background: var(--red-ui-popover-background);
+        color: var(--red-ui-popover-color);
         border-radius: 4px;
         @include component-shadow;
-        border-color: $popover-background;
+        border-color: var(--red-ui-popover-background);
     }
     .ace_content {
         line-height: 1;
@@ -55,14 +55,14 @@
 
     #red-ui-event-log-editor {
         .ace_scroller {
-            background: $event-log-background;
-            color: $event-log-color;
+            background: var(--red-ui-event-log-background);
+            color: var(--red-ui-event-log-color);
         }
         .ace_marker-layer .ace_active-line {
-            background: $event-log-active-line-background;
+            background: var(--red-ui-event-log-active-line-background);
         }
         .ace_marker-layer .ace_selection {
-            background: $event-log-selection-background;
+            background: var(--red-ui-event-log-selection-background);
         }
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/base.scss b/packages/node_modules/@node-red/editor-client/src/sass/base.scss
index c22a1d606..92a98913f 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/base.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/base.scss
@@ -20,12 +20,12 @@ body {
 }
 
 .red-ui-editor {
-    font-size: $primary-font-size;
-    font-family: $primary-font;
+    font-size: var(--red-ui-primary-font-size);
+    font-family: var(--red-ui-primary-font);
     padding: 0;
     margin: 0;
-    background: $primary-background;
-    color: $primary-text-color;
+    background: var(--red-ui-primary-background);
+    color: var(--red-ui-primary-text-color);
     line-height: 20px;
 }
 
@@ -44,7 +44,7 @@ body {
 
 #red-ui-palette-shade, #red-ui-editor-shade, #red-ui-header-shade, #red-ui-sidebar-shade  {
     @include shade;
-    z-index: 2;
+    z-index: 5;
 }
 #red-ui-sidebar-shade  {
     left: -8px;
@@ -63,15 +63,15 @@ body {
 .red-ui-icon-picker {
     a {
         text-decoration: none;
-        color: $primary-text-color;
+        color: var(--red-ui-primary-text-color);
     }
     a:hover,
     a:focus {
         text-decoration: none;
-        color: $primary-text-color;
+        color: var(--red-ui-primary-text-color);
     }
     a:focus {
-        outline: 1px solid $form-input-focus-color;
+        outline: 1px solid var(--red-ui-form-input-focus-color);
     }
 
     p {
@@ -130,7 +130,7 @@ body {
     hr {
         margin: 20px 0;
         border: 0;
-        border-top: 1px solid $tertiary-border-color;
+        border-top: 1px solid var(--red-ui-tertiary-border-color);
     }
 
 
@@ -150,22 +150,22 @@ body {
         mask-position: 50% 50%;
         -webkit-mask-repeat: no-repeat;
         mask-repeat: no-repeat;
-        background-color: $spinner-color;
+        background-color: var(--red-ui-spinner-color);
         }
 
     .red-ui-font-code {
-        font-family: $monospace-font;
-        font-size: $primary-font-size;
-        color: $text-color-code;
+        font-family: var(--red-ui-monospace-font);
+        font-size: var(--red-ui-primary-font-size);
+        color: var(--red-ui-text-color-code);
         white-space: nowrap;
     }
 
     code {
-        font-family: $monospace-font;
-        font-size: $primary-font-size;
+        font-family: var(--red-ui-monospace-font);
+        font-size: var(--red-ui-primary-font-size);
         padding: 0px;
         margin: 1px;
-        color: $text-color-code;
+        color: var(--red-ui-text-color-code);
         white-space: nowrap;
     }
 
@@ -177,8 +177,8 @@ body {
         word-break: break-all;
         word-wrap: break-word;
         white-space: pre-wrap;
-        background-color:$tertiary-background;
-        border: 1px solid $tertiary-border-color;
+        background-color:var(--red-ui-tertiary-background);
+        border: 1px solid var(--red-ui-tertiary-border-color);
         border-radius: 2px;
     }
 
@@ -217,8 +217,8 @@ body {
     blockquote {
         padding: 0 0 0 15px;
         margin: 0 0 20px;
-        border-left: 4px solid $secondary-border-color;
-        color: $secondary-text-color;
+        border-left: 4px solid var(--red-ui-secondary-border-color);
+        color: var(--red-ui-secondary-text-color);
 
         p {
             font-size: 14px;
@@ -244,7 +244,7 @@ body {
     right: 1px;
     text-align: center;
     padding: 40px;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     &:before {
       content: '';
       display: inline-block;
@@ -258,14 +258,14 @@ body {
         width: 80px;
     }
     &.red-ui-component-spinner-sidebar {
-        background: $secondary-background;
+        background: var(--red-ui-secondary-background);
         padding:0;
         img {
             width: 40px;
         }
     }
     &.projects-version-control-spinner-sidebar {
-        background: $secondary-background;
+        background: var(--red-ui-secondary-background);
         padding:0;
         img {
             width: 20px;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/colors.scss b/packages/node_modules/@node-red/editor-client/src/sass/colors.scss
index d8b4fb175..ce71bcdba 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/colors.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/colors.scss
@@ -112,9 +112,13 @@ $tab-text-color-disabled-inactive: $secondary-text-color-disabled-inactive;
 $tab-badge-color: $tertiary-text-color;
 $tab-background: $secondary-background;
 $tab-background-active: $secondary-background;
+$tab-background-active-alpha: rgba($tab-background-active, 0.001);
 $tab-background-selected: $secondary-background-selected;
+$tab-background-selected-alpha: rgba($tab-background-selected, 0.001);
 $tab-background-inactive: $secondary-background-inactive;
+$tab-background-inactive-alpha: rgba($tab-background-inactive, 0.001);
 $tab-background-hover: $secondary-background-hover;
+$tab-background-hover-alpha: rgba($tab-background-hover, 0.001);
 
 $palette-header-background: $primary-background;
 $palette-header-color: $header-text-color;
@@ -213,6 +217,7 @@ $node-icon-border-color: #000;
 $node-icon-border-color-opacity: 0.1;
 
 $node-config-background: #f3f3f3;
+$node-config-icon-container-disabled: #aaa;
 
 $node-link-port-background: #eee;
 
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/debug.scss b/packages/node_modules/@node-red/editor-client/src/sass/debug.scss
index 0c810c03f..58099877f 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/debug.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/debug.scss
@@ -17,7 +17,7 @@
 .red-ui-debug-window {
     padding:0;
     margin:0;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     line-height: 20px;
     .red-ui-debug-msg-payload {
         font-size: 14px;
@@ -38,15 +38,15 @@
     left: 0px;
     right: 0px;
     z-index: 20;
-    background: $tertiary-background;
+    background: var(--red-ui-tertiary-background);
     padding: 10px;
-    border-bottom: 1px solid $secondary-border-color;
-    box-shadow: 0 2px 6px $shadow;
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
+    box-shadow: 0 2px 6px var(--red-ui-shadow);
 }
 #red-ui-sidebar-debug-filter-node-list-row {
     .red-ui-treeList-label.disabled {
         font-style: italic;
-        color: $secondary-text-color-disabled;
+        color: var(--red-ui-secondary-text-color-disabled);
     }
 
     .red-ui-treeList-label {
@@ -57,22 +57,22 @@
             background: inherit;
         }
         &.focus, &.focus .red-ui-treeList-sublabel-text {
-            background: $list-item-background-hover !important;
+            background: var(--red-ui-list-item-background-hover) !important;
         }
     }
 }
 .red-ui-debug-msg {
     position: relative;
-    border-bottom: 1px solid $debug-message-border;
-    border-left: 8px solid $debug-message-border;
-    border-right: 8px solid $debug-message-border;
+    border-bottom: 1px solid var(--red-ui-debug-message-border);
+    border-left: 8px solid var(--red-ui-debug-message-border);
+    border-right: 8px solid var(--red-ui-debug-message-border);
     padding: 2px;
     &>.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
         display: none;
     }
 
     &.red-ui-debug-msg-hover {
-        border-right-color: $debug-message-border-hover;
+        border-right-color: var(--red-ui-debug-message-border-hover);
         &>.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
             display: inline-block;
         }
@@ -86,7 +86,7 @@
         display: inline-block;
     }
     &:hover {
-        background: $debug-message-background-hover;
+        background: var(--red-ui-debug-message-background-hover);
         &>.red-ui-debug-msg-tools {
             .red-ui-debug-msg-tools-copy {
                 display: inline-block;
@@ -120,9 +120,9 @@
 }
 
 .red-ui-debug-msg-meta {
-    background: $debug-message-background;
+    background: var(--red-ui-debug-message-background);
     font-size: 11px;
-    color: $secondary-text-color-inactive;
+    color: var(--red-ui-secondary-text-color-inactive);
     overflow-wrap: anywhere;
 }
 .red-ui-debug-msg-date {
@@ -131,11 +131,11 @@
 }
 .red-ui-debug-msg-topic {
     display: block;
-    color: $debug-message-text-color-meta;
+    color: var(--red-ui-debug-message-text-color-meta);
 }
 .red-ui-debug-msg-name {
     padding: 1px 0px;
-    color: $secondary-text-color-inactive;
+    color: var(--red-ui-secondary-text-color-inactive);
     white-space: nowrap;
 }
 .red-ui-debug-msg-tools {
@@ -152,39 +152,39 @@
 .red-ui-debug-msg-payload {
     display: block;
     padding: 2px;
-    background: $debug-message-background;
-    font-family: $monospace-font;
+    background: var(--red-ui-debug-message-background);
+    font-family: var(--red-ui-monospace-font);
     font-size: 13px !important;
 }
 .red-ui-debug-msg-level-log {
-    border-left-color: $debug-message-border;
-    border-right-color: $debug-message-border;
+    border-left-color: var(--red-ui-debug-message-border);
+    border-right-color: var(--red-ui-debug-message-border);
 }
 .red-ui-debug-msg-level-30 {
-    border-left-color: $debug-message-border-warning;
-    border-right-color: $debug-message-border-warning;
+    border-left-color: var(--red-ui-debug-message-border-warning);
+    border-right-color: var(--red-ui-debug-message-border-warning);
 }
 .red-ui-debug-msg-level-20 {
-    border-left-color: $debug-message-border-error;
-    border-right-color: $debug-message-border-error;
+    border-left-color: var(--red-ui-debug-message-border-error);
+    border-right-color: var(--red-ui-debug-message-border-error);
 }
 .red-ui-debug-msg-object-entry {
     position: relative;
     padding-left: 15px;
 }
 .red-ui-debug-msg-element {
-    color: $debug-message-text-color;
+    color: var(--red-ui-debug-message-text-color);
     line-height: 1.3em;
     overflow-wrap: break-word;
 }
 .red-ui-debug-msg-object-key {
-    color: $debug-message-text-color-object-key;
+    color: var(--red-ui-debug-message-text-color-object-key);
 }
 .red-ui-debug-msg-object-value {
 
 }
 .red-ui-debug-msg-object-handle {
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     font-size: 1em;
     width: 1em;
     text-align: center;
@@ -219,17 +219,17 @@
     display:none;
 }
 .red-ui-debug-msg-object-entry pre {
-    font-family: $monospace-font;
+    font-family: var(--red-ui-monospace-font);
     font-size: 13px;
     line-height: 1.2em;
     margin: 0 0 0 -1em;
 }
 
-.red-ui-debug-msg-type-other { color: $debug-message-text-color-msg-type-other; }
-.red-ui-debug-msg-type-string { color: $debug-message-text-color-msg-type-string; }
-.red-ui-debug-msg-type-null { color: $debug-message-text-color-msg-type-null; font-style: italic;}
-.red-ui-debug-msg-type-meta { color: $debug-message-text-color-msg-type-meta; font-style: italic;}
-.red-ui-debug-msg-type-number { color: $debug-message-text-color-msg-type-number; };
+.red-ui-debug-msg-type-other { color: var(--red-ui-debug-message-text-color-msg-type-other); }
+.red-ui-debug-msg-type-string { color: var(--red-ui-debug-message-text-color-msg-type-string); }
+.red-ui-debug-msg-type-null { color: var(--red-ui-debug-message-text-color-msg-type-null); font-style: italic;}
+.red-ui-debug-msg-type-meta { color: var(--red-ui-debug-message-text-color-msg-type-meta); font-style: italic;}
+.red-ui-debug-msg-type-number { color: var(--red-ui-debug-message-text-color-msg-type-number); }
 .red-ui-debug-msg-type-number-toggle { cursor: pointer;}
 
 .red-ui-debug-msg-type-string {
@@ -241,14 +241,14 @@
     padding: 4px 2px 2px;
     position: relative;
     &.red-ui-debug-msg-row-pinned {
-        background: $secondary-background-selected;
+        background: var(--red-ui-secondary-background-selected);
     }
 }
 .red-ui-debug-msg-expandable {
     cursor: pointer;
 }
 .red-ui-debug-msg-expandable:hover .red-ui-debug-msg-object-handle {
-    color:$secondary-text-color-hover;
+    color:var(--red-ui-secondary-text-color-hover);
 }
 
 .red-ui-debug-msg-buffer-opts {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/diff.scss b/packages/node_modules/@node-red/editor-client/src/sass/diff.scss
index 38fd36252..a7b3d4dc8 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/diff.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/diff.scss
@@ -23,11 +23,11 @@
     .red-ui-editableList-container {
         border-radius:1px;
         padding:0;
-        background: $tertiary-background;
+        background: var(--red-ui-tertiary-background);
     }
     .red-ui-diff-list {
         li {
-            background: $tertiary-background;
+            background: var(--red-ui-tertiary-background);
             padding: 0px;
             border: none;
             min-height: 0;
@@ -62,29 +62,29 @@
         white-space: nowrap;
         text-overflow: ellipsis;
         width: 50%;
-        background: $tertiary-background;
+        background: var(--red-ui-tertiary-background);
         text-align: center;
-        border-top: 1px solid $secondary-border-color;
-        border-color:$secondary-border-color;
-        border-left: 1px solid $secondary-border-color;
+        border-top: 1px solid var(--red-ui-secondary-border-color);
+        border-color:var(--red-ui-secondary-border-color);
+        border-left: 1px solid var(--red-ui-secondary-border-color);
     }
     div:last-child {
-        border-right: 1px solid $secondary-border-color;
+        border-right: 1px solid var(--red-ui-secondary-border-color);
     }
 }
 
 .red-ui-diff-dialog-toolbar {
     box-sizing: border-box;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     text-align: right;
     padding: 8px 10px;
-    background: $primary-background;
-    border-bottom: 1px solid $secondary-border-color;
+    background: var(--red-ui-primary-background);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     white-space: nowrap;
 }
 .red-ui-diff-list-flow {
-    background: $secondary-background;
-    border: 1px solid $secondary-border-color;
+    background: var(--red-ui-secondary-background);
+    border: 1px solid var(--red-ui-secondary-border-color);
     border-radius: 1px;
     overflow: hidden;
 
@@ -114,10 +114,10 @@
     font-size: 0.9em;
 
     &:first-child {
-        border-top: 1px solid $tertiary-border-color;
+        border-top: 1px solid var(--red-ui-tertiary-border-color);
     }
     &:not(:last-child) {
-        border-bottom: 1px solid $tertiary-border-color;
+        border-bottom: 1px solid var(--red-ui-tertiary-border-color);
     }
 
     &.collapsed {
@@ -150,8 +150,8 @@
         width: 100%;
     }
     td, th {
-        border-top: 1px solid $secondary-border-color;
-        border-left: 1px solid $secondary-border-color;
+        border-top: 1px solid var(--red-ui-secondary-border-color);
+        border-left: 1px solid var(--red-ui-secondary-border-color);
         &:first-child {
             border-left: none;
         }
@@ -166,7 +166,7 @@
             overflow:hidden;
         }
         &:hover {
-            background: $secondary-background-selected;
+            background: var(--red-ui-secondary-background-selected);
         }
 
     }
@@ -212,7 +212,7 @@
     cursor: pointer;
     padding: 0;
     &:hover {
-        background: $secondary-background-selected;
+        background: var(--red-ui-secondary-background-selected);
     }
 }
 .red-ui-diff-list-flow-title-meta {
@@ -223,7 +223,7 @@
 .red-ui-diff-list-node-header {
     cursor: pointer;
     &:hover {
-        background: $secondary-background-selected;
+        background: var(--red-ui-secondary-background-selected);
     }
 }
 .red-ui-diff-list-node-icon {
@@ -232,9 +232,9 @@
     margin: 5px;
     width: 18px;
     height: 15px;
-    background: $form-input-background;
+    background: var(--red-ui-form-input-background);
     border-radius: 2px;
-    border: 1px solid $node-border;
+    border: 1px solid var(--red-ui-node-border);
     background-position: 5% 50%;
     background-repeat: no-repeat;
     background-size: contain;
@@ -267,7 +267,7 @@
 .red-ui-diff-status-deleted {
     cursor: default !important;
     .red-ui-diff-status {
-        color: $diff-state-deleted;
+        color: var(--red-ui-diff-state-deleted);
     }
     .red-ui-diff-list-node-node {
         opacity: 0.5;
@@ -280,28 +280,28 @@
 .red-ui-diff-status-added {
     cursor: default !important;
     .red-ui-diff-status {
-        color: $diff-state-added;
+        color: var(--red-ui-diff-state-added);
     }
 }
 .red-ui-diff-status-moved {
     .red-ui-diff-status {
-        color: $diff-state-moved;
+        color: var(--red-ui-diff-state-moved);
     }
 }
 
 .red-ui-diff-status-changed {
     .red-ui-diff-status {
-        color: $diff-state-changed;
+        color: var(--red-ui-diff-state-changed);
     }
 }
 .red-ui-diff-status-unchanged {
     .red-ui-diff-status {
-        color: $diff-state-unchanged;
+        color: var(--red-ui-diff-state-unchanged);
     }
 }
 .red-ui-diff-status-conflict {
     .red-ui-diff-status {
-        color: $diff-state-conflict;
+        color: var(--red-ui-diff-state-conflict);
     }
 }
 .red-ui-diff-list-node-title {
@@ -312,7 +312,7 @@
 }
 .red-ui-diff-list-node-properties {
     margin: 0;
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
 }
 .red-ui-diff-status {
     display: inline-block;
@@ -329,7 +329,7 @@
 }
 
 .red-ui-diff-list-node-description {
-    color: $form-text-color;
+    color: var(--red-ui-form-text-color);
     margin-right: 5px;
     padding-top: 5px;
     display: inline-block;
@@ -340,11 +340,11 @@
     }
 }
 
-.red-ui-diff-state-added { color: $diff-state-added; }
-.red-ui-diff-state-deleted { color: $diff-state-deleted; }
-.red-ui-diff-state-changed { color: $diff-state-changed; }
-.red-ui-diff-state-unchanged { color: $diff-state-unchanged; }
-.red-ui-diff-state-conflicted { color: $diff-state-conflicted; }
+.red-ui-diff-state-added { color: var(--red-ui-diff-state-added); }
+.red-ui-diff-state-deleted { color: var(--red-ui-diff-state-deleted); }
+.red-ui-diff-state-changed { color: var(--red-ui-diff-state-changed); }
+.red-ui-diff-state-unchanged { color: var(--red-ui-diff-state-unchanged); }
+.red-ui-diff-state-conflicted { color: var(--red-ui-diff-state-conflicted); }
 
 
 .red-ui-diff-list-node-cell {
@@ -353,19 +353,19 @@
     box-sizing: border-box;
     width: calc( (100% - 20px) / 2);
     height: 32px;
-    border-left: 1px solid $secondary-border-color;
+    border-left: 1px solid var(--red-ui-secondary-border-color);
     padding-top: 2px;
     white-space: nowrap;
     overflow: hidden;
     position: relative;
 }
 .red-ui-diff-empty {
-    background: $secondary-background-disabled;
+    background: var(--red-ui-secondary-background-disabled);
     background: repeating-linear-gradient(
         20deg,
-        $secondary-background, $secondary-background 5px,
-        $secondary-background-disabled 5px,
-        $secondary-background-disabled 10px
+        var(--red-ui-secondary-background), var(--red-ui-secondary-background) 5px,
+        var(--red-ui-secondary-background-disabled) 5px,
+        var(--red-ui-secondary-background-disabled) 10px
         );
 }
 .red-ui-diff-list-node-cell:first-child {
@@ -425,10 +425,10 @@
         background: none;
     }
     &.red-ui-diff-status-changed {
-        background: $diff-state-changed-background;
+        background: var(--red-ui-diff-state-changed-background);
     }
     &.red-ui-diff-status-conflict {
-        background: $diff-state-conflict-background;
+        background: var(--red-ui-diff-state-conflict-background);
     }
 }
 
@@ -439,42 +439,42 @@ label.red-ui-diff-selectbox {
     bottom:0;
     width: 35px;
     text-align: center;
-    border-left: 1px solid $secondary-border-color;
+    border-left: 1px solid var(--red-ui-secondary-border-color);
     margin:0;
     input[type="radio"] {
         margin-top: 8px;
     }
 
     &:hover {
-        background: $secondary-background-hover;
+        background: var(--red-ui-secondary-background-hover);
     }
 }
 
 .red-ui-diff-list-node-conflict.red-ui-diff-select-remote {
     .red-ui-diff-list-node-remote {
-        background: $diff-state-added-background;
+        background: var(--red-ui-diff-state-added-background);
         label {
-            border-left-color: $diff-state-added-border;
+            border-left-color: var(--red-ui-diff-state-added-border);
         }
     }
     .red-ui-diff-list-node-local {
-        background: $diff-state-deleted-background;
+        background: var(--red-ui-diff-state-deleted-background);
         label {
-            border-left-color: $diff-state-deleted-border;
+            border-left-color: var(--red-ui-diff-state-deleted-border);
         }
     }
 }
 .red-ui-diff-list-node-conflict.red-ui-diff-select-local {
     .red-ui-diff-list-node-local {
-        background: $diff-state-added-background;
+        background: var(--red-ui-diff-state-added-background);
         label {
-            border-left-color: $diff-state-added-border;
+            border-left-color: var(--red-ui-diff-state-added-border);
         }
     }
     .red-ui-diff-list-node-remote {
-        background: $diff-state-deleted-background;
+        background: var(--red-ui-diff-state-deleted-background);
         label {
-            border-left-color: $diff-state-deleted-border;
+            border-left-color: var(--red-ui-diff-state-deleted-border);
         }
     }
 }
@@ -500,10 +500,10 @@ ul.red-ui-deploy-dialog-confirm-list {
         width: 30px;
         margin-right: 10px;
         &.fa-check {
-            color: $text-color-success;
+            color: var(--red-ui-text-color-success);
         }
         &.fa-exclamation {
-            color: $secondary-text-color;
+            color: var(--red-ui-secondary-text-color);
         }
     }
     div {
@@ -529,7 +529,7 @@ ul.red-ui-deploy-dialog-confirm-list {
 
     table.red-ui-diff-text-content {
         margin: 10px;
-        border: 1px solid $secondary-border-color;
+        border: 1px solid var(--red-ui-secondary-border-color);
         border-radius: 3px;
         table-layout: fixed;
         width: calc(100% - 20px);
@@ -538,88 +538,88 @@ ul.red-ui-deploy-dialog-confirm-list {
             word-wrap: break-word;
         }
         td.lineno {
-            font-family: $monospace-font;
+            font-family: var(--red-ui-monospace-font);
             text-align: right;
-            color: $tertiary-text-color;
-            background: $tertiary-background;
+            color: var(--red-ui-tertiary-text-color);
+            background: var(--red-ui-tertiary-background);
             padding: 1px 5px;
             &.added {
-                background: $diff-state-added-header-background;
+                background: var(--red-ui-diff-state-added-header-background);
             }
             &.removed {
-                background: $diff-state-deleted-header-background;
+                background: var(--red-ui-diff-state-deleted-header-background);
             }
         }
         td.lineno:nth-child(3) {
-            border-left: 1px solid $secondary-border-color;
+            border-left: 1px solid var(--red-ui-secondary-border-color);
         }
         td.linetext {
-            font-family: $monospace-font;
+            font-family: var(--red-ui-monospace-font);
             white-space: pre-wrap;
             padding: 1px 5px;
-            border-left: 1px solid $tertiary-border-color;
+            border-left: 1px solid var(--red-ui-tertiary-border-color);
             span.prefix {
                 width: 30px;
                 display: inline-block;
                 text-align: center;
-                color: $diff-state-prefix-color;
+                color: var(--red-ui-diff-state-prefix-color);
             }
 
             &.added {
-                border-left-color: $diff-state-added-header-border;
+                border-left-color: var(--red-ui-diff-state-added-header-border);
             }
             &.removed {
-                border-left-color: $diff-state-deleted-header-border;
+                border-left-color: var(--red-ui-diff-state-deleted-header-border);
             }
         }
         td.blank {
-            background: $tertiary-background;
+            background: var(--red-ui-tertiary-background);
         }
         td.added {
-            background: $diff-state-added-background;
-            color: $diff-state-color;
+            background: var(--red-ui-diff-state-added-background);
+            color: var(--red-ui-diff-state-color);
         }
         td.removed {
-            background: $diff-state-deleted-background;
-            color: $diff-state-color;
+            background: var(--red-ui-diff-state-deleted-background);
+            color: var(--red-ui-diff-state-color);
         }
         tr.mergeHeader td {
-            color: $diff-merge-header-color;
-            background: $diff-merge-header-background;
+            color: var(--red-ui-diff-merge-header-color);
+            background: var(--red-ui-diff-merge-header-background);
             height: 26px;
             vertical-align: middle;
         }
         tr.mergeHeader-separator td {
-            color: $diff-merge-header-color;
-            background: $diff-merge-header-border-color;
+            color: var(--red-ui-diff-merge-header-color);
+            background: var(--red-ui-diff-merge-header-border-color);
             height: 0px;
         }
         tr.mergeHeader-ours td {
-            border-top: 2px solid $diff-merge-header-border-color;
+            border-top: 2px solid var(--red-ui-diff-merge-header-border-color);
         }
         tr.mergeHeader-theirs td {
-            border-bottom: 2px solid $diff-merge-header-border-color;
+            border-bottom: 2px solid var(--red-ui-diff-merge-header-border-color);
         }
         td.unchanged {
-            background: $diff-state-unchanged-background;
-            color: $diff-state-unchanged;
+            background: var(--red-ui-diff-state-unchanged-background);
+            color: var(--red-ui-diff-state-unchanged);
         }
         tr.unchanged {
-            background: $diff-state-unchanged-background;
+            background: var(--red-ui-diff-state-unchanged-background);
         }
         tr.start-block {
-            border-top: 1px solid $secondary-border-color;
+            border-top: 1px solid var(--red-ui-secondary-border-color);
         }
         tr.end-block {
-            border-bottom: 1px solid $secondary-border-color;
+            border-bottom: 1px solid var(--red-ui-secondary-border-color);
         }
         tr.red-ui-diff-text-file-header td {
             .filename {
-                font-family: $monospace-font;
+                font-family: var(--red-ui-monospace-font);
             }
-            background: $primary-background;
+            background: var(--red-ui-primary-background);
             padding: 5px 10px 5px 0;
-            color: $primary-text-color;
+            color: var(--red-ui-primary-text-color);
             cursor: pointer;
             i.red-ui-diff-list-chevron {
                 width: 30px;
@@ -631,17 +631,17 @@ ul.red-ui-deploy-dialog-confirm-list {
             }
         }
         tr.red-ui-diff-text-commit-header td {
-            background: $primary-background;
+            background: var(--red-ui-primary-background);
             padding: 5px 10px;
-            color: $primary-text-color;
+            color: var(--red-ui-primary-text-color);
             h3 {
                 font-size: 1.4em;
                 margin: 0;
             }
             .commit-summary {
-                border-top: 1px solid $secondary-border-color;
+                border-top: 1px solid var(--red-ui-secondary-border-color);
                 padding-top: 5px;
-                color: $secondary-text-color;
+                color: var(--red-ui-secondary-text-color);
             }
             .commit-body {
                 margin-bottom:15px;
@@ -651,20 +651,20 @@ ul.red-ui-deploy-dialog-confirm-list {
         }
 
         tr.red-ui-diff-text-header > td:not(.red-ui-diff-flow-diff) {
-            font-family: $monospace-font;
+            font-family: var(--red-ui-monospace-font);
             padding: 5px 10px;
             text-align: left;
-            color: $diff-text-header-color;
-            background: $diff-text-header-background;
+            color: var(--red-ui-diff-text-header-color);
+            background: var(--red-ui-diff-text-header-background);
             height: 30px;
             vertical-align: middle;
-            border-top: 1px solid $secondary-border-color;
-            border-bottom: 1px solid $secondary-border-color;
+            border-top: 1px solid var(--red-ui-secondary-border-color);
+            border-bottom: 1px solid var(--red-ui-secondary-border-color);
         }
         tr.red-ui-diff-text-expand td {
             cursor: pointer;
             &:hover {
-                background: $diff-text-header-background;
+                background: var(--red-ui-diff-text-header-background);
             }
         }
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/dragdrop.scss b/packages/node_modules/@node-red/editor-client/src/sass/dragdrop.scss
index 1476cf890..78646e0e7 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/dragdrop.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/dragdrop.scss
@@ -18,7 +18,7 @@
     position: absolute;
     top: 0; bottom: 0;
     left: 0; right: 0;
-    background: $dnd-background;
+    background: var(--red-ui-dnd-background);
     display:table;
     width: 100%;
     height: 100%;
@@ -30,7 +30,7 @@
         vertical-align: middle;
         text-align: center;
         font-size: 40px;
-        color: $dnd-color;
+        color: var(--red-ui-dnd-color);
         i {
             pointer-events: none;
             font-size: 80px;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/dropdownMenu.scss b/packages/node_modules/@node-red/editor-client/src/sass/dropdownMenu.scss
index 98ab3bd3b..f6a2d6fde 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/dropdownMenu.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/dropdownMenu.scss
@@ -15,8 +15,8 @@
  **/
 
 .red-ui-menu-dropdown {
-    font-family: $primary-font;
-    font-size: $primary-font-size;
+    font-family: var(--red-ui-primary-font);
+    font-size: var(--red-ui-primary-font-size);
     position: absolute;
     top: 100%;
     width: 230px;
@@ -28,9 +28,9 @@
     margin-left: 0px !important;
     padding: 5px 0;
     list-style: none;
-    background: $menuBackground;
-    border: 1px solid $secondary-border-color;
-    box-shadow: 0 5px 10px $shadow;
+    background: var(--red-ui-menuBackground);
+    border: 1px solid var(--red-ui-secondary-border-color);
+    box-shadow: 0 5px 10px var(--red-ui-shadow);
 
     &.pull-right {
         right: 0;
@@ -41,7 +41,7 @@
         height: 1px;
         margin: 9px 1px;
         overflow: hidden;
-        background-color: $menuDivider;
+        background-color: var(--red-ui-menuDivider);
     }
     & > li > a,
     & > li > a:focus {
@@ -50,27 +50,45 @@
         clear: both;
         font-weight: normal;
         line-height: 20px;
-        color: $menuColor;
+        color: var(--red-ui-menuColor);
         white-space: normal !important;
         outline: none;
     }
+    & > li.pull-left > a,
+    & > li.pull-left > a:focus {
+        padding: 4px 12px 4px 32px;
+    }
+    &.red-ui-menu-dropdown-noicons > li > a,
+    &.red-ui-menu-dropdown-noicons > li > a:focus {
+        padding: 4px 12px 4px 12px;
+    }
+
+    &.red-ui-menu-dropdown-submenus.red-ui-menu-dropdown-direction-right > li > a,
+    &.red-ui-menu-dropdown-submenus.red-ui-menu-dropdown-direction-right > li > a:focus {
+        padding-right: 20px;
+    }
+    &.red-ui-menu-dropdown-submenus.red-ui-menu-dropdown-direction-left > li > a,
+    &.red-ui-menu-dropdown-submenus.red-ui-menu-dropdown-direction-left > li > a:focus {
+        padding-left: 20px;
+    }
+
 
     & > .active > a,
     & > .active > a:hover,
     & > .active > a:focus {
-        color: $menuActiveColor;
+        color: var(--red-ui-menuActiveColor);
         text-decoration: none;
-        background-color: $menuActiveBackground;
+        background-color: var(--red-ui-menuActiveBackground);
         outline: 0;
     }
 
     & > .disabled > a,
     & > .disabled > a:hover,
     & > .disabled > a:focus {
-        color: $menuDisabledColor;
+        color: var(--red-ui-menuDisabledColor);
         .red-ui-popover-key {
-            color: $menuDisabledColor;
-            border-color: $menuDisabledColor;
+            color: var(--red-ui-menuDisabledColor);
+            border-color: var(--red-ui-menuDisabledColor);
         }
     }
 
@@ -118,8 +136,8 @@
             padding: 0;
             font-size: 13px;
             // float: right;
-            color: $menuColor;
-            border-color: $menuColor;
+            color: var(--red-ui-menuColor);
+            border-color: var(--red-ui-menuColor);
         }
     }
 
@@ -136,17 +154,17 @@
 .red-ui-menu-dropdown > li > a:focus,
 .red-ui-menu-dropdown-submenu:hover > a,
 .red-ui-menu-dropdown-submenu:focus > a {
-    color: $menuHoverColor;
+    color: var(--red-ui-menuHoverColor);
     text-decoration: none;
-    background-color: $menuHoverBackground;
+    background-color: var(--red-ui-menuHoverBackground);
 }
 
 .red-ui-menu-dropdown-submenu {
     position: relative;
     & > .red-ui-menu-dropdown {
         top: 0;
-        left: 100%;
-        margin-top: -6px;
+        left: calc(100% - 5px);
+        margin-top: 0;
         margin-left: -1px;
     }
     &.open > .red-ui-menu-dropdown,
@@ -161,7 +179,7 @@
       margin-top: 5px;
       margin-right: -10px;
       border-color: transparent;
-      border-left-color: $menuCaret;
+      border-left-color: var(--red-ui-menuCaret);
       border-style: solid;
       border-width: 5px 0 5px 5px;
       content: " ";
@@ -175,32 +193,50 @@
     }
 }
 
-.red-ui-menu-dropdown-submenu>a:after {
+.red-ui-menu-dropdown-submenu.pull-left>a:after {
     display: none;
 }
-.red-ui-menu-dropdown-submenu>a:before {
+.red-ui-menu-dropdown-submenu.pull-left>a:before {
     display: block;
     float: left;
     width: 0;
     height: 0;
     margin-top: 5px;
-    margin-left: -30px;
+    margin-left: -15px;
     /* Caret Arrow */
     border-color: transparent;
-    border-right-color: $menuCaret;
+    border-right-color: var(--red-ui-menuCaret);
     border-style: solid;
     border-width: 5px 5px 5px 0;
     content: " ";
 }
-
+.red-ui-menu-dropdown-direction-right {
+    .red-ui-menu-dropdown-submenu>a:after {
+        display: none;
+    }
+    .red-ui-menu-dropdown-submenu>a:before {
+        display: block;
+        float: right;
+        width: 0;
+        height: 0;
+        margin-top: 5px;
+        margin-right: -15px;
+        /* Caret Arrow */
+        border-color: transparent;
+        border-left-color: var(--red-ui-menuCaret);
+        border-style: solid;
+        border-width: 5px 0 5px 5px;
+        content: " ";
+    }
+}
 .red-ui-menu-dropdown-submenu.disabled > a:before {
-    border-right-color: $menuCaret;
+    border-right-color: var(--red-ui-menuCaret);
 }
 
 
 // Menu NG
 ul.red-ui-menu:not(.red-ui-menu-dropdown) {
-    font-family: $primary-font;
+    font-family: var(--red-ui-primary-font);
     font-size: 12px;
     list-style-type: none;
     padding: 0;
@@ -211,14 +247,14 @@ ul.red-ui-menu:not(.red-ui-menu-dropdown) {
         clear: both;
         font-weight: normal;
         line-height: 20px;
-        color: $menuColor;
+        color: var(--red-ui-menuColor);
         white-space: nowrap;
         text-decoration: none;
 
         &:hover,&:focus {
-            color: $menuHoverColor;
+            color: var(--red-ui-menuHoverColor);
             text-decoration: none;
-            background-color: $menuHoverBackground;
+            background-color: var(--red-ui-menuHoverBackground);
             border: none;
             outline: none;
         }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/editor.scss b/packages/node_modules/@node-red/editor-client/src/sass/editor.scss
index 75133df8a..1730b9e35 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/editor.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/editor.scss
@@ -32,9 +32,9 @@
     width: auto;
     right: -1000px;
     bottom: 0;
-    background: $secondary-background;
-    border-left: 1px solid $secondary-border-color;
-    border-bottom: 1px solid $primary-border-color;
+    background: var(--red-ui-secondary-background);
+    border-left: 1px solid var(--red-ui-secondary-border-color);
+    border-bottom: 1px solid var(--red-ui-primary-border-color);
     box-sizing: content-box;
 }
 .red-ui-tray.open {
@@ -67,8 +67,8 @@
     position: relative;
     box-sizing: border-box;
     font-weight: bold;
-    border-bottom: 1px solid $secondary-border-color;
-    background: $palette-header-background;
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
+    background: var(--red-ui-palette-header-background);
     &:after {
         content: "";
         display: table;
@@ -88,8 +88,8 @@
         height: 26px;
         line-height: 26px;
         &.toggle:not(.selected) {
-            color: $workspace-button-color-selected !important;
-            background: $workspace-button-background-active;
+            color: var(--red-ui-workspace-button-color-selected) !important;
+            background: var(--red-ui-workspace-button-background-active);
         }
     }
 
@@ -116,8 +116,8 @@
 }
 
 .red-ui-tray-titlebar {
-    color: $header-text-color;
-    border-bottom: 1px solid $secondary-border-color;
+    color: var(--red-ui-header-text-color);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     padding: 8px;
 }
 .red-ui-editor ul.red-ui-tray-breadcrumbs {
@@ -131,7 +131,7 @@
         margin:0;
 
         &:not(:last-child) {
-            color: $workspace-button-color;
+            color: var(--red-ui-workspace-button-color);
             font-weight: normal;
 
             &:after {
@@ -149,10 +149,10 @@
     bottom: 0px;
     width: 7px;
     left: -9px;
-    background-color: $primary-background;
+    background-color: var(--red-ui-primary-background);
     cursor: col-resize;
-    border-left: 1px solid $primary-border-color;
-    box-shadow: -1px 0 6px $shadow;
+    border-left: 1px solid var(--red-ui-primary-border-color);
+    box-shadow: -1px 0 6px var(--red-ui-shadow);
 
     &:before {
         content: '';
@@ -167,11 +167,11 @@
         mask-position: 50% 50%;
         -webkit-mask-repeat: no-repeat;
         mask-repeat: no-repeat;
-        background-color: $grip-color;
+        background-color: var(--red-ui-grip-color);
     }
     
     &.red-ui-tray-resize-maximised {
-        background: $primary-background;
+        background: var(--red-ui-primary-background);
         cursor: default;
     }
 }
@@ -182,10 +182,10 @@ button.red-ui-tray-resize-button {
     height: 37px;
     line-height: 35px;
     border: none;
-    border-bottom: 1px solid $secondary-border-color;
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     margin: 0;
-    background: $primary-background;
-    color: $workspace-button-color;
+    background: var(--red-ui-primary-background);
+    color: var(--red-ui-workspace-button-color);
 }
 
 .red-ui-editor .red-ui-tray {
@@ -203,16 +203,16 @@ button.red-ui-tray-resize-button {
     }
 
     .input-error {
-        border-color: $form-input-border-error-color !important;
+        border-color: var(--red-ui-form-input-border-error-color) !important;
     }
 
     .input-updated {
-        border-color: $node-selected-color !important;
+        border-color: var(--red-ui-node-selected-color) !important;
     }
 
     .form-row {
         clear: both;
-        color: $form-text-color;
+        color: var(--red-ui-form-text-color);
         margin-bottom:12px;
     }
     .form-row label {
@@ -223,10 +223,10 @@ button.red-ui-tray-resize-button {
         width:70%;
     }
     .form-tips {
-        background: $form-tips-background;
+        background: var(--red-ui-form-tips-background);
         padding: 8px;
         border-radius: 2px;
-        border: 1px solid $secondary-border-color;
+        border: 1px solid var(--red-ui-secondary-border-color);
         max-width: 450px;
     }
     .form-tips code {
@@ -238,7 +238,7 @@ button.red-ui-tray-resize-button {
     }
 
     .form-warning {
-        border-color: $text-color-error;
+        border-color: var(--red-ui-text-color-error);
     }
 }
 
@@ -255,11 +255,11 @@ button.red-ui-tray-resize-button {
     }
 }
 .red-ui-editor-text-container {
-    border:1px solid $tertiary-border-color;
+    border:1px solid var(--red-ui-tertiary-border-color);
     border-radius:5px;
     overflow: hidden;
-    font-size: $primary-font-size !important;
-    font-family: $monospace-font !important;
+    font-size: var(--red-ui-primary-font-size !important);
+    font-family: var(--red-ui-monospace-font !important);
     height: 100%;
 
     &.red-ui-editor-text-container-toolbar {
@@ -302,7 +302,7 @@ button.red-ui-button-small
 #red-ui-editor-config-scope-warning {
     display: inline-block;
     margin-right: 5px;
-    color: $text-color-warning;
+    color: var(--red-ui-text-color-warning);
     vertical-align: middle;
 }
 #red-ui-editor-config-scope {
@@ -358,18 +358,18 @@ button.red-ui-button-small
         padding: 20px 20px 10px;
         &:last-child {
             padding-top: 60px;
-            background: $primary-background;
+            background: var(--red-ui-primary-background);
 
         }
     }
 }
 .red-ui-editor-type-markdown-panel-preview {
     padding: 10px;
-    border:1px solid $secondary-border-color;
+    border:1px solid var(--red-ui-secondary-border-color);
     border-radius:5px;
     height: calc(100% - 21px);
     overflow-y: scroll;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
 }
 
 #red-ui-clipboard-hidden {
@@ -402,7 +402,7 @@ button.red-ui-button-small
     span {
         padding-left: 50px;
         width: 100px;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
 }
 
@@ -427,14 +427,14 @@ button.red-ui-button.red-ui-editor-node-appearance-button {
 
 .red-ui-group-layout-picker {
     padding: 5px;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
 }
 .red-ui-group-layout-picker-cell-text {
     position: absolute;
     width: 14px;
     height: 2px;
-    border-top: 2px solid $secondary-text-color;
-    border-bottom: 2px solid $secondary-text-color;
+    border-top: 2px solid var(--red-ui-secondary-text-color);
+    border-bottom: 2px solid var(--red-ui-secondary-text-color);
     margin: 2px;
 
     &.red-ui-group-layout-text-pos-nw { top: 0; left: 0; }
@@ -451,7 +451,7 @@ button.red-ui-button.red-ui-editor-node-appearance-button {
         background-color: #FFF;
         background-size: 100% 100%;
         background-position: 0 0, 50% 50%;
-        background-image: linear-gradient(45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%,  transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%,  transparent 55%, transparent);
+        background-image: linear-gradient(45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%,  transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%,  transparent 55%, transparent);
         border: none;
     }
 }
@@ -475,17 +475,17 @@ button.red-ui-group-layout-picker-none {
         width: 100%;
         margin-bottom: 0;
         border: none;
-        border-bottom: 1px solid $form-input-border-color;
+        border-bottom: 1px solid var(--red-ui-form-input-border-color);
     }
     small {
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         margin-left: 5px;
         margin-right: 4px;
         display: inline-block;
         min-width: 35px;
         text-align: right;
     }
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
 }
 .red-ui-editor-node-appearance-button {
     .red-ui-search-result-node {
@@ -496,7 +496,7 @@ button.red-ui-group-layout-picker-none {
     padding: 0;
     border-style: solid;
     border-width: 1px;
-    border-color: $secondary-border-color;
+    border-color: var(--red-ui-secondary-border-color);
 }
 .red-ui-color-picker-swatch {
     position: absolute;
@@ -509,7 +509,7 @@ button.red-ui-group-layout-picker-none {
     background-color: #FFF;
     background-size: 100% 100%;
     background-position: 0 0, 50% 50%;
-    background-image: linear-gradient(45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%,  transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, $secondary-border-color 45%, $secondary-border-color 55%,  transparent 55%, transparent)
+    background-image: linear-gradient(45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%,  transparent 55%, transparent),linear-gradient(-45deg, transparent 45%, var(--red-ui-secondary-border-color) 45%, var(--red-ui-secondary-border-color) 55%,  transparent 55%, transparent)
 }
 .red-ui-search-result-node .red-ui-color-picker-cell-none {
     border-radius: 4px;
@@ -536,7 +536,7 @@ button.red-ui-group-layout-picker-none {
     top:0;right:0;left:0;bottom:0;
     background-image:linear-gradient(90deg, transparent 0%, #f00 100%);
     background-size: 100% 100%;
-    border: 1px solid $primary-border-color;
+    border: 1px solid var(--red-ui-primary-border-color);
 }
 
 div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
@@ -547,9 +547,9 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
     width: 10px;
     height: 22px;
     padding: 0;
-    border: 1px solid $primary-border-color;
+    border: 1px solid var(--red-ui-primary-border-color);
     border-radius: 1px;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     box-sizing: border-box;
 }
 .red-ui-icon-picker {
@@ -567,10 +567,10 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
     position: relative;
     &.red-ui-icon-list-dark {
         .red-ui-palette-icon-fa {
-            color: $secondary-text-color;
+            color: var(--red-ui-secondary-text-color);
         }
         .red-ui-palette-icon-container {
-            background: $secondary-background;
+            background: var(--red-ui-secondary-background);
             border-radius: 4px;
         }
     }
@@ -583,10 +583,10 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
     border-radius: 4px;
 
     &:hover {
-        background: $list-item-background-hover;
+        background: var(--red-ui-list-item-background-hover);
     }
     &.selected {
-        background: $list-item-background-selected;
+        background: var(--red-ui-list-item-background-selected);
         .red-ui-search-result-node {
             // border-color: white;
         }
@@ -597,22 +597,22 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
     }
 }
 .red-ui-icon-list-module {
-    background: $palette-header-background;
+    background: var(--red-ui-palette-header-background);
     font-size: 0.9em;
     padding: 3px;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     clear: both;
     i {
         margin-right: 5px;
     }
 }
 .red-ui-icon-meta {
-    border-top: 1px solid $secondary-border-color;
-    background: $tertiary-background;
+    border-top: 1px solid var(--red-ui-secondary-border-color);
+    background: var(--red-ui-tertiary-background);
     height: 24px;
     span {
         padding: 4px;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         font-size: 0.9em;
         line-height: 24px;
     }
@@ -630,7 +630,7 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
 .red-ui-editor-type-json-editor {
     height: calc(100% - 10px);
     .red-ui-treeList-container {
-        background: $secondary-background;
+        background: var(--red-ui-secondary-background);
     }
     .red-ui-treeList-label {
         padding-top: 0;
@@ -647,7 +647,7 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
             vertical-align: middle;
         }
         &:hover, &:hover .red-ui-treeList-sublabel-text {
-            background: $secondary-background-disabled;
+            background: var(--red-ui-secondary-background-disabled);
             .red-ui-editor-type-json-editor-item-gutter {
                 > span, > button {
                     display: inline-block;
@@ -656,11 +656,11 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
         }
         &.selected {
             .red-ui-editor-type-json-editor-item-gutter {
-                background: $secondary-background-hover;
+                background: var(--red-ui-secondary-background-hover);
             }
             &:hover {
                 .red-ui-editor-type-json-editor-item-gutter {
-                    background: $secondary-background-selected;
+                    background: var(--red-ui-secondary-background-selected);
                 }
             }
         }
@@ -698,7 +698,7 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
     border: 2px solid rgba(0,0,0,0);
     border-radius: 3px;
     &:not(.red-ui-editor-type-json-editor-label-array-key):hover {
-        border-color: $list-item-background-hover;
+        border-color: var(--red-ui-list-item-background-hover);
         border-style: dashed;
     }
     &.readonly {
@@ -712,8 +712,8 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle {
 
     height: 100%;
     line-height: 35px;
-    color: $tertiary-text-color;
-    background: $secondary-background-disabled;
+    color: var(--red-ui-tertiary-text-color);
+    background: var(--red-ui-secondary-background-disabled);
     > span {
         display: inline-block;
         height: 35px;
@@ -755,7 +755,7 @@ button.red-ui-toggleButton.toggle {
     }
     >div:first-child {
         font-size: 0.9em;
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
         margin: 3px 0 -4px;
         >div {
             padding-left: 3px;
@@ -767,15 +767,15 @@ button.red-ui-toggleButton.toggle {
             line-height: 30px;
             display: inline-block;
             box-sizing: border-box;
-            // border-left: 2px dashed $secondary-border-color;
-            // border-bottom: 2px dashed $secondary-border-color;
-            // border: 1px dashed $secondary-border-color;
+            // border-left: 2px dashed var(--red-ui-secondary-border-color);
+            // border-bottom: 2px dashed var(--red-ui-secondary-border-color);
+            // border: 1px dashed var(--red-ui-secondary-border-color);
             border-right: none;
             &:not(:first-child) {
                 padding: 3px;
             }
             // &:last-child {
-            //     border-right: 1px dashed $secondary-border-color;
+            //     border-right: 1px dashed var(--red-ui-secondary-border-color);
             // }
             .placeholder-input {
                 position: relative;
@@ -800,8 +800,8 @@ button.red-ui-toggleButton.toggle {
                         height: 100%;
                         width: 20px;
                         text-align:center;
-                        border-right: 1px solid $secondary-border-color;
-                        background: $tertiary-background;
+                        border-right: 1px solid var(--red-ui-secondary-border-color);
+                        background: var(--red-ui-tertiary-background);
                     }
                 }
                 input[type="checkbox"] {
@@ -817,13 +817,13 @@ button.red-ui-toggleButton.toggle {
             .red-ui-editableList-item-handle {
                 position:relative;
                 top: 0px;
-                color: $tertiary-text-color;
+                color: var(--red-ui-tertiary-text-color);
             }
         }
         >div:nth-child(2) {
             margin: 4px;
             height: 32px;
-            border: 1px dashed $secondary-border-color;
+            border: 1px dashed var(--red-ui-secondary-border-color);
             text-align: center;
             a {
                 display: block;
@@ -831,7 +831,7 @@ button.red-ui-toggleButton.toggle {
                 height: 100%;
                 line-height: 32px;
                 &:hover {
-                    background: $secondary-background-hover;
+                    background: var(--red-ui-secondary-background-hover);
                 }
                 i {
                     height: 100%;
@@ -851,7 +851,7 @@ button.red-ui-toggleButton.toggle {
 span.red-ui-editor-subflow-env-lang-icon {
     position: absolute;
     display: inline-block;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     opacity: 0.8;
     width: 20px;
     line-height: 32px;
@@ -864,12 +864,12 @@ span.red-ui-editor-subflow-env-lang-icon {
 }
 
 .red-ui-editor-subflow-env-input-type {
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     height: 100%;
     box-sizing: border-box;
 }
 .red-ui-editor-subflow-env-input-type-placeholder {
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
     padding-left: 4px;
 }
 
@@ -886,7 +886,7 @@ span.red-ui-editor-subflow-env-lang-icon {
 //             border-top: none;
 //         }
 //         &.ui-sortable-helper {
-//             border: 2px dashed $secondary-border-color;
+//             border: 2px dashed var(--red-ui-secondary-border-color);
 //             .red-ui-editableList-item-content {
 //                 >div {
 //                     border: none;
@@ -901,15 +901,15 @@ span.red-ui-editor-subflow-env-lang-icon {
 //         >div>div {
 //             display: inline-block;
 //             box-sizing: border-box;
-//             border-left: 1px dashed $secondary-border-color;
-//             border-bottom: 1px dashed $secondary-border-color;
+//             border-left: 1px dashed var(--red-ui-secondary-border-color);
+//             border-bottom: 1px dashed var(--red-ui-secondary-border-color);
 //         }
 //         >div:first-child {
 //             font-size: 0.9em;
 //             display: grid;
 //             grid-template-columns: 25px auto 20px;
 //             >div {
-//                 border-top: 1px dashed $secondary-border-color;
+//                 border-top: 1px dashed var(--red-ui-secondary-border-color);
 //                 padding: 1px;
 //             }
 //             >div:nth-child(3) {
@@ -929,9 +929,9 @@ span.red-ui-editor-subflow-env-lang-icon {
 //                 // line-height: 30px;
 //                 // box-sizing: border-box;
 //                 //
-//                 // border-left: 2px dashed $secondary-border-color;
+//                 // border-left: 2px dashed var(--red-ui-secondary-border-color);
 //                 border-top: none;
-//                 // border-bottom: 2px dashed $secondary-border-color;
+//                 // border-bottom: 2px dashed var(--red-ui-secondary-border-color);
 //                 &:not(:first-child) {
 //                     padding: 6px 3px;
 //                 }
@@ -963,7 +963,7 @@ span.red-ui-editor-subflow-env-lang-icon {
 //                     height: 100%;
 //                     line-height: 45px;
 //                     &:hover {
-//                         background: $secondary-background-hover;
+//                         background: var(--red-ui-secondary-background-hover);
 //                     }
 //                 }
 //             }
@@ -993,11 +993,11 @@ span.red-ui-editor-subflow-env-lang-icon {
 // }
 .red-ui-editor-subflow-ui-edit-panel {
     padding-bottom: 3px;
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
     .red-ui-editableList-border {
         border: none;
         border-radius: 0;
-        border-bottom: 1px solid $secondary-border-color;
+        border-bottom: 1px solid var(--red-ui-secondary-border-color);
     }
     .red-ui-editableList-container {
     }
@@ -1005,10 +1005,10 @@ span.red-ui-editor-subflow-env-lang-icon {
         margin-left: 2px;
     }
     .red-ui-editableList-header {
-        background: $primary-background;
+        background: var(--red-ui-primary-background);
         display: grid;
         grid-template-columns: 50% 50%;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         div:first-child {
             padding-left: 23px;
         }
@@ -1019,7 +1019,7 @@ span.red-ui-editor-subflow-env-lang-icon {
     .red-ui-editableList-container {
         padding: 0 1px;
         li {
-            background: $secondary-background;
+            background: var(--red-ui-secondary-background);
             // border-bottom: none;
             padding: 0;
             .red-ui-editableList-item-content {
@@ -1034,14 +1034,14 @@ span.red-ui-editor-subflow-env-lang-icon {
                 margin-bottom: 0;
                 border:none;
                 width: 100%;
-                border-right: 1px solid $secondary-border-color;
+                border-right: 1px solid var(--red-ui-secondary-border-color);
 
                 border-radius: 0;
                 &:focus {
-                    box-shadow: 0 0 0 1px inset $form-input-focus-color;
+                    box-shadow: 0 0 0 1px inset var(--red-ui-form-input-focus-color);
                 }
                 &:first-child {
-                    border-left: 1px solid $secondary-border-color;
+                    border-left: 1px solid var(--red-ui-secondary-border-color);
                 }
             }
             button.red-ui-typedInput-type-select, button.red-ui-typedInput-option-expand, button.red-ui-typedInput-option-trigger {
@@ -1131,7 +1131,7 @@ span.red-ui-editor-subflow-env-lang-icon {
         border-top-left-radius: 4px;
         border-top-right-radius: 4px;
 
-        background: $tertiary-background;
+        background: var(--red-ui-tertiary-background);
         padding: 0;
         >div {
             display: grid;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/flow.scss b/packages/node_modules/@node-red/editor-client/src/sass/flow.scss
index 91f80ac0c..be8db6c93 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/flow.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/flow.scss
@@ -16,14 +16,14 @@
 
 .nr-ui-view-lasso {
     stroke-width: 1px;
-    stroke: $view-lasso-stroke;
-    fill: $view-lasso-fill;
+    stroke: var(--red-ui-view-lasso-stroke);
+    fill: var(--red-ui-view-lasso-fill);
     stroke-dasharray: 10 5;
 }
 
 .nr-ui-view-slice {
     stroke-width: 1px;
-    stroke: $view-lasso-stroke;
+    stroke: var(--red-ui-view-lasso-stroke);
     fill: none;
     stroke-dasharray: 10 5;
 }
@@ -33,11 +33,11 @@
     font-style: italic;
 }
 .red-ui-flow-node-label-white {
-    fill: $view-background !important;
+    fill: var(--red-ui-view-background) !important;
 }
 .red-ui-flow-node-label {
     stroke-width: 0;
-    fill: $node-label-color;
+    fill: var(--red-ui-node-label-color);
     font-size: 14px;
     pointer-events: none;
     -webkit-touch-callout: none;
@@ -54,7 +54,7 @@
 
 .red-ui-flow-port-label {
     stroke-width: 0;
-    fill: $node-port-label-color;
+    fill: var(--red-ui-node-port-label-color);
     font-size: 16px;
     dominant-baseline: middle;
     text-anchor: middle;
@@ -65,7 +65,7 @@
 
 
 .red-ui-flow-node {
-    stroke: $node-border;
+    stroke: var(--red-ui-node-border);
     cursor: move;
     stroke-width: 1;
 }
@@ -80,7 +80,7 @@
         opacity: 0.9;
         .red-ui-flow-node {
             stroke-width: 2;
-            stroke: $node-selected-color !important;
+            stroke: var(--red-ui-node-selected-color) !important;
             stroke-dasharray: 10, 4;
         }
     }
@@ -95,53 +95,53 @@
     }
     &.red-ui-flow-group-active-hovered:not(.red-ui-flow-group-hovered) {
         .red-ui-flow-group-outline-select {
-            stroke: $link-link-color;
+            stroke: var(--red-ui-link-link-color);
         }
     }
 }
 
 .red-ui-flow-group-outline {
     fill: none;
-    stroke: $node-selected-color;
+    stroke: var(--red-ui-node-selected-color);
     stroke-opacity: 0;
     stroke-width: 12;
     pointer-events: stroke;
 }
 .red-ui-flow-group-outline-select {
     fill: none;
-    stroke: $node-selected-color;
+    stroke: var(--red-ui-node-selected-color);
     pointer-events: stroke;
     stroke-opacity: 0;
     stroke-width: 3;
 
     &.red-ui-flow-group-outline-select-background {
-        stroke: $view-background;
+        stroke: var(--red-ui-view-background);
         stroke-width: 6;
     }
 }
 .red-ui-flow-group-body {
     pointer-events: none;
-    fill: $group-default-fill;
-    fill-opacity: $group-default-fill-opacity;
+    fill: var(--red-ui-group-default-fill);
+    fill-opacity: var(--red-ui-group-default-fill-opacity);
     stroke-width: 2;
-    stroke: $group-default-stroke;
-    stroke-opacity: $group-default-stroke-opacity;
+    stroke: var(--red-ui-group-default-stroke);
+    stroke-opacity: var(--red-ui-group-default-stroke-opacity);
 }
 .red-ui-flow-group-label {
     @include disable-selection;
-    fill: $group-default-label-color;
+    fill: var(--red-ui-group-default-label-color);
 }
 
 
 
 .red-ui-flow-node-unknown {
     stroke-dasharray:10,4;
-    stroke: $node-border-unknown;
+    stroke: var(--red-ui-node-border-unknown);
 }
 .red-ui-flow-node-placeholder {
     stroke-dasharray:10,4;
-    stroke: $node-border-placeholder;
-    fill: $node-background-placeholder;
+    stroke: var(--red-ui-node-border-placeholder);
+    fill: var(--red-ui-node-background-placeholder);
     opacity: 0.5;
     stroke-width: 2;
 }
@@ -152,19 +152,19 @@
     .fa-lg {
         @include disable-selection;
         stroke: none;
-        fill: $node-icon-color;
+        fill: var(--red-ui-node-icon-color);
         text-anchor: middle;
         font-family: FontAwesome;
     }
 }
 .red-ui-flow-node-icon-shade {
     stroke: none;
-    fill: $node-icon-background-color-fill;
-    fill-opacity: $node-icon-background-color-opacity;
+    fill: var(--red-ui-node-icon-background-color-fill);
+    fill-opacity: var(--red-ui-node-icon-background-color-opacity);
 }
 .red-ui-flow-node-icon-shade-border {
-    stroke-opacity: $node-icon-border-color-opacity;
-    stroke: $node-icon-border-color;
+    stroke-opacity: var(--red-ui-node-icon-border-color-opacity);
+    stroke: var(--red-ui-node-icon-border-color);
     stroke-width: 1;
 }
 
@@ -176,32 +176,39 @@
             cursor: default;
         }
     }
+    &.red-ui-flow-node-button-stopped {
+        opacity: 0.4;
+        .red-ui-flow-node-button-button {
+            cursor: default;
+            pointer-events: none;
+        }
+    }
 }
 .red-ui-flow-node-button-button {
     cursor: pointer;
 }
 .red-ui-flow-node-button-background {
-    fill: $node-background-placeholder;
+    fill: var(--red-ui-node-background-placeholder);
 }
 
 .red-ui-flow-port {
-    stroke: $node-border;
+    stroke: var(--red-ui-node-border);
     stroke-width: 1;
-    fill: $node-port-background;
+    fill: var(--red-ui-node-port-background);
     cursor: crosshair;
 }
 
 .red-ui-flow-node-error {
-    fill: $node-status-error-background;
-    stroke: $node-status-error-border;
+    fill: var(--red-ui-node-status-error-background);
+    stroke: var(--red-ui-node-status-error-border);
     stroke-width:1px;
     cursor: default;
     stroke-linejoin: round;
     stroke-linecap: round;
 }
 .red-ui-flow-node-changed {
-    fill: $node-status-changed-background;
-    stroke: $node-status-changed-border;
+    fill: var(--red-ui-node-status-changed-background);
+    stroke: var(--red-ui-node-status-changed-border);
     cursor: default;
     stroke-width:1px;
     stroke-linejoin: round;
@@ -214,13 +221,13 @@ g.red-ui-flow-node-selected {
     }
     .red-ui-flow-node,.red-ui-flow-subflow-port {
         stroke-width: 2;
-        stroke: $node-selected-color !important;
+        stroke: var(--red-ui-node-selected-color) !important;
     }
 }
 .red-ui-flow-node-highlighted {
-    border-color: $node-selected-color !important;
+    border-color: var(--red-ui-node-selected-color) !important;
     border-style: dashed !important;
-    stroke: $node-selected-color;
+    stroke: var(--red-ui-node-selected-color);
     stroke-width: 3;
     stroke-dasharray: 8, 4;
 }
@@ -236,7 +243,7 @@ g.red-ui-flow-node-selected {
     .red-ui-flow-link-line {
         stroke-dasharray: 10,8 !important;
         stroke-width: 2 !important;
-        stroke: $link-disabled-color;
+        stroke: var(--red-ui-link-disabled-color);
     }
     .red-ui-flow-port {
         fill-opacity: 1;
@@ -254,7 +261,7 @@ g.red-ui-flow-node-selected {
     &.red-ui-flow-link-line {
         stroke-dasharray: 10,8 !important;
         stroke-width: 2 !important;
-        stroke: $link-disabled-color;
+        stroke: var(--red-ui-link-disabled-color);
     }
     .red-ui-flow-port {
         fill-opacity: 1;
@@ -263,49 +270,49 @@ g.red-ui-flow-node-selected {
 }
 @each $current-color in red green yellow blue grey gray {
     .red-ui-flow-node-status-dot-#{""+$current-color} {
-        fill: map-get($node-status-colors,$current-color);
-        stroke: map-get($node-status-colors,$current-color);
+        fill: var(--red-ui-node-status-colors-#{"" + $current-color});
+        stroke: var(--red-ui-node-status-colors-#{"" + $current-color});
     }
     .red-ui-flow-node-status-ring-#{""+$current-color} {
-        fill: $view-background;
-        stroke: map-get($node-status-colors,$current-color);
+        fill: var(--red-ui-view-background);
+        stroke: var(--red-ui-node-status-colors-#{"" + $current-color});
     }
 }
 
 .red-ui-flow-node-status-label {
     @include disable-selection;
     stroke-width: 0;
-    fill: $secondary-text-color;
+    fill: var(--red-ui-secondary-text-color);
     font-size:9pt;
     text-anchor:start;
 }
 
 .red-ui-flow-port-hovered {
-    stroke: $port-selected-color;
-    fill:  $port-selected-color;
+    stroke: var(--red-ui-port-selected-color);
+    fill:  var(--red-ui-port-selected-color);
 }
 
 .red-ui-flow-subflow-port {
-    fill: $node-background-placeholder;
-    stroke: $node-border;
+    fill: var(--red-ui-node-background-placeholder);
+    stroke: var(--red-ui-node-border);
 }
 
 .red-ui-flow-drag-line {
-    stroke: $node-selected-color !important;
+    stroke: var(--red-ui-node-selected-color) !important;
     stroke-width: 3;
     fill: none;
     pointer-events: none;
 }
 
 .red-ui-flow-link-line {
-    stroke: $link-color;
+    stroke: var(--red-ui-link-color);
     stroke-width: 3;
     fill: none;
     pointer-events: none;
 }
 .red-ui-flow-link-link {
     stroke-width: 2;
-    stroke: $link-link-color;
+    stroke: var(--red-ui-link-link-color);
     fill: none;
     stroke-dasharray: 25,4;
 }
@@ -314,19 +321,19 @@ g.red-ui-flow-node-selected {
 }
 
 .red-ui-flow-link-port {
-    fill: $node-link-port-background;
-    stroke: $link-link-color;
+    fill: var(--red-ui-node-link-port-background);
+    stroke: var(--red-ui-link-link-color);
     stroke-width: 1;
 }
 .red-ui-flow-link-group-active .red-ui-flow-link-port {
-    stroke: $link-link-active-color;
+    stroke: var(--red-ui-link-link-active-color);
 }
 .red-ui-flow-link-group:hover {
     cursor: pointer;
 }
 
 .red-ui-flow-link-outline {
-    stroke: $view-background;
+    stroke: var(--red-ui-view-background);
     stroke-opacity: 0.4;
     stroke-width: 5;
     cursor: crosshair;
@@ -334,7 +341,7 @@ g.red-ui-flow-node-selected {
     pointer-events: none;
 }
 .red-ui-flow-link-background {
-    stroke: $view-background;
+    stroke: var(--red-ui-view-background);
     opacity: 0;
     stroke-width: 20;
     cursor: crosshair;
@@ -345,10 +352,10 @@ g.red-ui-flow-node-selected {
 }
 
 g.red-ui-flow-link-selected path.red-ui-flow-link-line {
-    stroke: $node-selected-color;
+    stroke: var(--red-ui-node-selected-color);
 }
 g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
-    stroke: $link-unknown-color;
+    stroke: var(--red-ui-link-unknown-color);
     stroke-width: 2;
     stroke-dasharray: 10, 4;
 }
@@ -364,32 +371,67 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
     pointer-events: none;
 
     path:first-child {
-        fill: $popover-background;
-        stroke: $popover-background;
+        fill: var(--red-ui-popover-background);
+        stroke: var(--red-ui-popover-background);
         stroke-width: 1;
     }
 }
 .red-ui-flow-port-tooltip-label {
     stroke-width: 0;
-    fill: $popover-color;
-    font-family: $primary-font;
+    fill: var(--red-ui-popover-color);
+    font-family: var(--red-ui-primary-font);
     font-size: 12px;
     pointer-events: none;
     -webkit-touch-callout: none;
     white-space: pre;
     @include disable-selection;
 }
-.red-ui-flow-junction-background {
-    stroke: $node-border;
+.red-ui-flow-junction-dragging {
+    .red-ui-flow-junction-background {
+        background: red !important
+    }
+}
+.red-ui-flow-junction:not(.red-ui-flow-junction-dragging):hover {
+    .red-ui-flow-junction-background {
+        transform: scale(1.4);
+        stroke-width: 0.6;
+    }
+    .red-ui-flow-junction-port {
+        opacity: 1;
+        pointer-events: auto;
+    }
+    .red-ui-flow-junction-port-input {
+        transform: translate(-10px,0)
+    }
+    .red-ui-flow-junction-port-output {
+        transform: translate(10px,0)
+    }
+}
+.red-ui-flow-junction-port {
+    stroke: var(--red-ui-node-border);
     stroke-width: 1;
-    fill: $node-port-background;
+    fill: var(--red-ui-node-port-background);
     cursor: crosshair;
+    transition: transform 0.1s;
+    opacity: 0;
+    pointer-events: none;
+}
+.red-ui-flow-junction-background {
+    stroke: var(--red-ui-node-border);
+    stroke-width: 1;
+    fill: var(--red-ui-node-port-background);
+    cursor: crosshair;
+    transform: scale(1);
+    transition: transform 0.1s;
+    &:hover {
+
+    }
 }
 .red-ui-flow-junction-hovered {
-    stroke: $port-selected-color;
-    fill:  $port-selected-color;
+    stroke: var(--red-ui-port-selected-color);
+    fill:  var(--red-ui-port-selected-color);
 }
 .red-ui-flow-junction.selected .red-ui-flow-junction-background {
-    stroke: $port-selected-color;
-    // fill:  $port-selected-color;
+    stroke: var(--red-ui-port-selected-color);
+    // fill:  var(--red-ui-port-selected-color);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/forms.scss b/packages/node_modules/@node-red/editor-client/src/sass/forms.scss
index 022579b27..a281b9265 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/forms.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/forms.scss
@@ -99,13 +99,13 @@
         margin-bottom: 20px;
         font-size: 21px;
         line-height: 40px;
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
         border: 0;
-        border-bottom: 1px solid $secondary-border-color;
+        border-bottom: 1px solid var(--red-ui-secondary-border-color);
     }
 
     legend small {
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
     }
 
 
@@ -125,7 +125,7 @@
     button,
     select,
     textarea {
-        font-family: $primary-font;
+        font-family: var(--red-ui-primary-font);
     }
 
     label {
@@ -159,7 +159,7 @@
         margin-bottom: 10px;
         font-size: 14px;
         line-height: 20px;
-        color: $form-text-color;
+        color: var(--red-ui-form-text-color);
         vertical-align: middle;
         border-radius: 4px;
     }
@@ -193,8 +193,8 @@
     div[contenteditable="true"],
     .uneditable-input,
     .placeholder-input {
-        background-color: $form-input-background;
-        border: 1px solid $form-input-border-color;
+        background-color: var(--red-ui-form-input-background);
+        border: 1px solid var(--red-ui-form-input-border-color);
     }
 
     textarea:focus,
@@ -214,7 +214,7 @@
     input[type="color"]:focus,
     div[contenteditable="true"]:focus,
     .uneditable-input:focus {
-        border-color: $form-input-focus-color;
+        border-color: var(--red-ui-form-input-focus-color);
         outline: 0;
         outline: thin dotted \9;
     }
@@ -245,8 +245,8 @@
 
     select {
         width: 220px;
-        background-color: $form-input-background;
-        border: 1px solid $form-input-border-color;
+        background-color: var(--red-ui-form-input-background);
+        border: 1px solid var(--red-ui-form-input-border-color);
     }
 
     select[multiple],
@@ -258,16 +258,16 @@
     input[type="file"]:focus,
     input[type="radio"]:focus,
     input[type="checkbox"]:focus {
-        outline: 2px auto $form-input-focus-color;
+        outline: 2px auto var(--red-ui-form-input-focus-color);
         outline-offset: -3px;
     }
 
     .uneditable-input,
     .uneditable-textarea {
-        color: $form-text-color-disabled;
+        color: var(--red-ui-form-text-color-disabled);
         cursor: not-allowed;
-        background-color: $form-input-background-disabled;
-        border-color: $form-input-border-color;
+        background-color: var(--red-ui-form-input-background-disabled);
+        border-color: var(--red-ui-form-input-border-color);
     }
 
     .uneditable-input {
@@ -282,19 +282,19 @@
 
     input:-moz-placeholder,
     textarea:-moz-placeholder {
-        color: $form-placeholder-color;
+        color: var(--red-ui-form-placeholder-color);
     }
 
     input:-ms-input-placeholder,
     div[contenteditable="true"]:-ms-input-placeholder,
     textarea:-ms-input-placeholder {
-        color: $form-placeholder-color;
+        color: var(--red-ui-form-placeholder-color);
     }
 
     input::-webkit-input-placeholder,
     div[contenteditable="true"]::-webkit-input-placeholder,
     textarea::-webkit-input-placeholder {
-        color: $form-placeholder-color;
+        color: var(--red-ui-form-placeholder-color);
     }
 
     .radio,
@@ -384,7 +384,7 @@
     }
 
     label.disabled {
-        color: $form-text-color-disabled;
+        color: var(--red-ui-form-text-color-disabled);
         cursor: default;
     }
 
@@ -395,8 +395,8 @@
     select[readonly],
     textarea[readonly] {
         cursor: not-allowed;
-        color: $form-text-color-disabled;
-        background-color: $form-input-background-disabled;
+        color: var(--red-ui-form-text-color-disabled);
+        background-color: var(--red-ui-form-input-background-disabled);
     }
 
     input[type="radio"][disabled],
@@ -410,21 +410,21 @@
     div[contenteditable="true"]:invalid,
     textarea:invalid,
     select:invalid {
-        border-color: $form-input-border-error-color;
+        border-color: var(--red-ui-form-input-border-error-color);
     }
 
     input:focus:invalid,
     div[contenteditable="true"]:focus:invalid,
     textarea:focus:invalid,
     select:focus:invalid {
-        border-color: $form-input-border-error-color;
+        border-color: var(--red-ui-form-input-border-error-color);
     }
 
     input:focus:invalid:focus,
     div[contenteditable="true"]:focus:invalid:focus,
     textarea:focus:invalid:focus,
     select:focus:invalid:focus {
-        border-color: $form-input-border-error-color;
+        border-color: var(--red-ui-form-input-border-error-color);
     }
 
     .input-append,
@@ -488,8 +488,8 @@
         font-weight: normal;
         line-height: 20px;
         text-align: center;
-        background-color: $form-button-background;
-        border: 1px solid $form-input-border-color;
+        background-color: var(--red-ui-form-button-background);
+        border: 1px solid var(--red-ui-form-input-border-color);
     }
 
     .input-append .add-on,
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/header.scss b/packages/node_modules/@node-red/editor-client/src/sass/header.scss
index 697a90729..723c1e9bd 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/header.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/header.scss
@@ -24,10 +24,10 @@
     left: 0;
     width: 100%;
     height: 40px;
-    background: $header-background;
+    background: var(--red-ui-header-background);
     box-sizing: border-box;
     padding: 0px 0px 0px 20px;
-    color: $header-menu-color;
+    color: var(--red-ui-header-menu-color);
     font-size: 14px;
 
     span.red-ui-header-logo {
@@ -81,17 +81,17 @@
         font-size: 20px;
         padding: 0px 12px;
         text-decoration: none;
-        color: $header-menu-color;
+        color: var(--red-ui-header-menu-color);
         margin: auto 5px;
         vertical-align: middle;
-        border-left: 2px solid $header-background;
-        border-right: 2px solid $header-background;
+        border-left: 2px solid var(--red-ui-header-background);
+        border-right: 2px solid var(--red-ui-header-background);
 
         &:hover {
-            border-color: $header-menu-item-hover;
+            border-color: var(--red-ui-header-menu-item-hover);
         }
         &:active, &.active {
-            background: $header-button-background-active;
+            background: var(--red-ui-header-button-background-active);
         }
         &:focus {
             outline: none;
@@ -116,18 +116,18 @@
     }
 
     .red-ui-deploy-button {
-        background: $deploy-button-background;
-        color: $deploy-button-color;
+        background: var(--red-ui-deploy-button-background);
+        color: var(--red-ui-deploy-button-color);
 
         &:hover {
-            background: $deploy-button-background-hover;
+            background: var(--red-ui-deploy-button-background-hover);
         }
         &:focus {
             outline: none;
         }
         &:active {
-            background: $deploy-button-background-active;
-            color: $deploy-button-color-active;
+            background: var(--red-ui-deploy-button-background-active);
+            color: var(--red-ui-deploy-button-color-active);
         }
     }
 
@@ -149,21 +149,21 @@
         padding: 4px 12px;
         &.disabled {
             cursor: default;
-            background: $deploy-button-background-disabled;
-            color: $deploy-button-color-disabled;
+            background: var(--red-ui-deploy-button-background-disabled);
+            color: var(--red-ui-deploy-button-color-disabled);
 
             .red-ui-deploy-button-content>img {
                 opacity: 0.3;
             }
             &+ #red-ui-header-button-deploy-options {
-                background: $deploy-button-background-disabled;
-                color: $deploy-button-color-active;
+                background: var(--red-ui-deploy-button-background-disabled);
+                color: var(--red-ui-deploy-button-color-active);
             }
             &+ #red-ui-header-button-deploy-options:hover {
-                background: $deploy-button-background-disabled-hover;
+                background: var(--red-ui-deploy-button-background-disabled-hover);
             }
             &+ #red-ui-header-button-deploy-options:active {
-                background: $deploy-button-background-disabled;
+                background: var(--red-ui-deploy-button-background-disabled);
             }
         }
 
@@ -174,24 +174,24 @@
 
     .red-ui-deploy-button-group.open {
         #red-ui-header-button-deploy-options {
-            background: $header-button-background-active !important;
+            background: var(--red-ui-header-button-background-active) !important;
         }
     }
 
     li.open .button {
-        background: $header-button-background-active;
-        border-color: $header-button-background-active;
+        background: var(--red-ui-header-button-background-active);
+        border-color: var(--red-ui-header-button-background-active);
     }
 
 
     ul.red-ui-menu-dropdown {
-        background: $header-menu-background;
-        border: 1px solid $header-menu-background;
+        background: var(--red-ui-header-menu-background);
+        border: 1px solid var(--red-ui-header-menu-background);
         width: 260px !important;
         margin-top: 0;
         li a {
-            color: $header-menu-color;
-            padding: 3px 10px 3px 40px;
+            color: var(--red-ui-header-menu-color);
+            padding: 3px 10px 3px 30px;
             img {
                 max-width: 100%;
                 margin-right: 10px;
@@ -199,11 +199,11 @@
                 border: 3px solid transparent;
             }
             .red-ui-popover-key {
-                color: $header-menu-color-disabled !important;
-                border-color: $header-menu-color-disabled !important;
+                color: var(--red-ui-header-menu-color-disabled) !important;
+                border-color: var(--red-ui-header-menu-color-disabled) !important;
             }
             &.active img {
-                border: 3px solid $header-menu-item-border-active;
+                border: 3px solid var(--red-ui-header-menu-item-border-active);
             }
 
             span.red-ui-menu-label-container {
@@ -217,9 +217,9 @@
                 text-indent: 0px;
             }
             span.red-ui-menu-sublabel {
-                color: $header-menu-sublabel-color;
+                color: var(--red-ui-header-menu-sublabel-color);
                 font-size: 13px;
-                display: inline-block;
+                display: block;
                 text-indent: 0px;
             }
         }
@@ -228,13 +228,13 @@
         > li > a:focus,
         > li:hover > a,
         > li:focus > a {
-            background: $header-menu-item-hover !important;
+            background: var(--red-ui-header-menu-item-hover) !important;
         }
         li.red-ui-menu-divider {
-            background: $headerMenuItemDivider;
+            background: var(--red-ui-headerMenuItemDivider);
         }
         li.disabled a {
-            color:  $header-menu-color-disabled;
+            color:  var(--red-ui-header-menu-color-disabled);
         }
         > li.disabled > a:hover,
         > li.disabled > a:focus {
@@ -242,7 +242,8 @@
         }
     }
     .red-ui-menu-dropdown-submenu>a:before {
-        border-right-color: $headerMenuCaret;
+        border-right-color: var(--red-ui-headerMenuCaret);
+        margin-left: -25px !important;
     }
 
     /* Deploy menu customisations */
@@ -250,7 +251,7 @@
         width: 300px !important;
         li a {
             padding: 10px 30px;
-            color: $header-menu-heading-color;
+            color: var(--red-ui-header-menu-heading-color);
             span.red-ui-menu-label {
                 font-size: 16px;
                 display: inline-block;
@@ -263,7 +264,7 @@
     }
     /* User menu customisations */
     #usermenu-item-username > .red-ui-menu-label {
-        color: $header-menu-heading-color;
+        color: var(--red-ui-header-menu-heading-color);
     }
 
     #red-ui-header-button-user .user-profile {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/jquery.scss b/packages/node_modules/@node-red/editor-client/src/sass/jquery.scss
index a884d6641..ec76049f9 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/jquery.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/jquery.scss
@@ -16,25 +16,27 @@
 
 .ui-widget {
     font-size: 14px !important;
-    font-family: $primary-font;
+    font-family: var(--red-ui-primary-font);
 }
 .ui-widget input, .ui-widget div[contenteditable="true"], .ui-widget select, .ui-widget textarea, .ui-widget button {
     font-size: 14px !important;
-    font-family: $primary-font;
+    font-family: var(--red-ui-primary-font);
 }
 .ui-widget input, .ui-widget div[contenteditable="true"] {
     box-shadow: none;
 }
 
 .ui-widget.ui-widget-content {
-	border: 1px solid $tertiary-border-color;
+    border: 1px solid var(--red-ui-tertiary-border-color);
 }
 .ui-widget-content {
-	border: 1px solid $secondary-border-color;
+    border: 1px solid var(--red-ui-secondary-border-color);
+    background: var(--red-ui-secondary-background);
+    color: var(--red-ui-primary-text-color);
 }
 
 .ui-widget-header {
-    color: $header-text-color;
+    color: var(--red-ui-header-text-color);
 }
 
 /* jQuery Theme overrides */
@@ -50,7 +52,7 @@
 
 .ui-dialog {
     border-radius: 1px;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     padding: 0;
     @include component-shadow;
 }
@@ -62,20 +64,20 @@
 }
 .ui-dialog .ui-dialog-titlebar {
     padding: 10px;
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
     border: none;
-    border-bottom: 1px solid $primary-border-color;
+    border-bottom: 1px solid var(--red-ui-primary-border-color);
     border-radius: 0;
 }
 .ui-dialog .ui-dialog-buttonpane.ui-widget-content {
-    background: $tertiary-background;
+    background: var(--red-ui-tertiary-background);
 
 }
 .ui-corner-all {
     border-radius: 1px;
 }
 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
 }
 .ui-dialog-no-close .ui-dialog-titlebar-close {
     display: none;
@@ -95,8 +97,8 @@
     padding: 6px 14px;
     margin-right: 8px;
     border-radius: 2px;
-    color: $workspace-button-color;
-    background: $workspace-button-background;
+    color: var(--red-ui-workspace-button-color);
+    background: var(--red-ui-workspace-button-background);
 
     &.leftButton {
         float: left;
@@ -107,18 +109,18 @@
     }
 
     &.primary {
-        border-color: $workspace-button-background-primary;
-        color: $workspace-button-color-primary !important;
-        background: $workspace-button-background-primary;
+        border-color: var(--red-ui-workspace-button-background-primary);
+        color: var(--red-ui-workspace-button-color-primary) !important;
+        background: var(--red-ui-workspace-button-background-primary);
         &:not(.disabled):hover {
-            border-color: $workspace-button-background-primary-hover;
-            background: $workspace-button-background-primary-hover;
-            color: $workspace-button-color-primary !important;
+            border-color: var(--red-ui-workspace-button-background-primary-hover);
+            background: var(--red-ui-workspace-button-background-primary-hover);
+            color: var(--red-ui-workspace-button-color-primary) !important;
         }
         &.disabled {
-            border-color: $form-input-border-color;
-            color: $workspace-button-color-disabled !important;
-            background: $workspace-button-background;
+            border-color: var(--red-ui-form-input-border-color);
+            color: var(--red-ui-workspace-button-color-disabled) !important;
+            background: var(--red-ui-workspace-button-background);
         }
     }
     &.disabled {
@@ -142,10 +144,10 @@
 .ui-spinner {
     border-radius: 4px;
     padding: 0;
-    border: 1px solid $form-input-border-color;
+    border: 1px solid var(--red-ui-form-input-border-color);
 }
 .ui-spinner input {
-    background: $form-input-background;
+    background: var(--red-ui-form-input-background);
     margin: 0 17px 0 0;
     padding: 6px;
     border: none;
@@ -169,8 +171,18 @@
 .ui-button,
 html .ui-button.ui-state-disabled:hover,
 html .ui-button.ui-state-disabled:active {
-    border: 1px solid $secondary-border-color;
-    background: $form-button-background;
+    border: 1px solid var(--red-ui-secondary-border-color);
+    background: var(--red-ui-form-button-background);
+}
+
+.ui-state-default a,
+.ui-state-default a:link,
+.ui-state-default a:visited,
+a.ui-button,
+a:link.ui-button,
+a:visited.ui-button,
+.ui-button{
+    color: var(--red-ui-primary-text-color);
 }
 
 .ui-state-hover,
@@ -180,9 +192,9 @@ html .ui-button.ui-state-disabled:active {
 .ui-widget-content .ui-state-focus,
 .ui-widget-header .ui-state-focus,
 .ui-button:hover, .ui-button:focus {
-    border: 1px solid $secondary-border-color;
-    background: $workspace-button-background-hover;
-    color: $workspace-button-color-hover;
+    border: 1px solid var(--red-ui-secondary-border-color);
+    background: var(--red-ui-workspace-button-background-hover);
+    color: var(--red-ui-workspace-button-color-hover);
 }
 
 .ui-state-active,
@@ -191,10 +203,10 @@ html .ui-button.ui-state-disabled:active {
 a.ui-button:active,
 .ui-button:active,
 .ui-button.ui-state-active:hover {
-    border: 1px solid $secondary-border-color;
-    background: $workspace-button-background-active;
+    border: 1px solid var(--red-ui-secondary-border-color);
+    background: var(--red-ui-workspace-button-background-active);
     font-weight: normal;
-    color: $workspace-button-color-active;
+    color: var(--red-ui-workspace-button-color-active);
 }
 
 .ui-state-active .ui-icon, .ui-button:active .ui-icon {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/keyboard.scss b/packages/node_modules/@node-red/editor-client/src/sass/keyboard.scss
index 8c4e5a3a8..c11aa0592 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/keyboard.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/keyboard.scss
@@ -23,9 +23,9 @@
     }
     .keyboard-shortcut-list-header {
         padding:0 5px 0 5px;
-        border-bottom: 1px solid $primary-border-color;
+        border-bottom: 1px solid var(--red-ui-primary-border-color);
         div {
-            color: $header-text-color !important;
+            color: var(--red-ui-header-text-color) !important;
         }
         .red-ui-searchBox-container {
             width: calc(100% - 20px);
@@ -49,7 +49,7 @@
             }
         }
         li:hover {
-            background: $list-item-background-hover;
+            background: var(--red-ui-list-item-background-hover);
         }
     }
     .keyboard-shortcut-entry {
@@ -78,13 +78,13 @@
         width: calc(100% - 160px - 100px - 10px);
         overflow: hidden;
         i {
-            color: $tertiary-text-color;
+            color: var(--red-ui-tertiary-text-color);
             margin-right: 5px;
         }
     }
     .keyboard-shortcut-entry-scope {
         width:100px;
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
         vertical-align: middle;
         text-align: right;
     }
@@ -94,13 +94,13 @@
         }
     }
     .keyboard-shortcut-entry-unassigned {
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
         .keyboard-shortcut-entry-key {
             font-style: italic;
         }
     }
     .keyboard-shortcut-entry-expanded {
-        background: $list-item-background-selected;
+        background: var(--red-ui-list-item-background-selected);
         .keyboard-shortcut-entry-key {
             width: 150px;
         }
@@ -115,12 +115,12 @@
     }
 }
 .help-key {
-    border: 1px solid $tertiary-border-color;
+    border: 1px solid var(--red-ui-tertiary-border-color);
     padding: 4px;
     border-radius: 3px;
-    background: $tertiary-background;
-    font-family: $monospace-font;
-    box-shadow: $shade-color  1px 1px 1px;
+    background: var(--red-ui-tertiary-background);
+    font-family: var(--red-ui-monospace-font);
+    box-shadow: var(--red-ui-shade-color  1px 1px 1px);
 }
 .help-key-block {
     white-space: nowrap;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/library.scss b/packages/node_modules/@node-red/editor-client/src/sass/library.scss
index 0d284ffce..bb651e4ea 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/library.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/library.scss
@@ -18,13 +18,13 @@
     pre {
         margin: 10px 0;
         border: none;
-        color: $primary-text-color;
+        color: var(--red-ui-primary-text-color);
         span {
             padding: 5px 0;
         }
         span.error {
             padding: 5px;
-            border: 1px solid $form-input-border-error-color;
+            border: 1px solid var(--red-ui-form-input-border-error-color);
             margin: 0 1px;
         }
     }
@@ -52,16 +52,16 @@
 
 .red-ui-clipboard-dialog-tab-clipboard {
     textarea {
-        color: $secondary-text-color-active !important;
+        color: var(--red-ui-secondary-text-color-active) !important;
         resize: none;
         width: 100%;
         border-radius: 4px;
-        font-family: $monospace-font !important;
+        font-family: var(--red-ui-monospace-font !important);
         font-size: 13px !important;
         height: 100%;
         line-height: 1.3em;
         padding: 6px 10px;
-        background: $clipboard-textarea-background;
+        background: var(--red-ui-clipboard-textarea-background);
     }
 }
 
@@ -80,7 +80,7 @@
     right: 0;
     bottom: 0;
     padding: 0;
-    background: $form-input-background;
+    background: var(--red-ui-form-input-background);
     &>div {
         height: 100%;
         box-sizing: border-box;
@@ -89,7 +89,7 @@
 .red-ui-clipboard-dialog-box {
     height: 400px;
     position:relative;
-    border:1px solid $primary-border-color;
+    border:1px solid var(--red-ui-primary-border-color);
 }
 
 #red-ui-clipboard-dialog-export-tab-library-filename {
@@ -111,7 +111,7 @@
 .red-ui-clipboard-dialog-tabs-content>div.red-ui-clipboard-dialog-export-tab-library-browser {
     height: calc(100% - 60px);
     margin-bottom: 13px;
-    border-bottom: 1px solid $primary-border-color;
+    border-bottom: 1px solid var(--red-ui-primary-border-color);
     box-sizing: border-box;
 }
 #red-ui-clipboard-dialog-import-tab-library-browser {
@@ -124,7 +124,7 @@
     position: relative;
     height: 100%;
     .red-ui-treeList-container {
-        background: $secondary-background;
+        background: var(--red-ui-secondary-background);
         border: none;
         border-radius: 0;
         li {
@@ -149,14 +149,14 @@
 
 #red-ui-library-dialog-save-browser {
     height: calc(100% - 60px);
-    border: 1px solid $primary-border-color;
+    border: 1px solid var(--red-ui-primary-border-color);
     margin-bottom: 10px;
 }
 #red-ui-library-dialog-load-browser {
-    // border: 1px solid $primary-border-color;
+    // border: 1px solid var(--red-ui-primary-border-color);
 }
 #red-ui-library-dialog-load-panes {
-    border: 1px solid $primary-border-color;
+    border: 1px solid var(--red-ui-primary-border-color);
 }
 
 
@@ -180,15 +180,15 @@
     position: relative;
 
     li:not(:first-child) .red-ui-clipboard-dialog-import-conflicts-item-header {
-        // border-top: 1px solid $secondary-border-color;
+        // border-top: 1px solid var(--red-ui-secondary-border-color);
     }
 
 }
 
 .red-ui-clipboard-dialog-import-conflicts-item-header {
-    background: $tertiary-background;
+    background: var(--red-ui-tertiary-background);
     & > span:first-child {
-        color: $header-text-color;
+        color: var(--red-ui-header-text-color);
         padding-left: 4px;
         font-size: 12px;
     }
@@ -199,7 +199,7 @@
     bottom: 0;
     right: 0px;
     text-align: center;
-    color: $form-text-color;
+    color: var(--red-ui-form-text-color);
     .form-row & label  {
         padding: 2px 0;
         line-height: 23px;
@@ -210,7 +210,7 @@
         height: 100%;
         width: 80px;
         text-align: center;
-        border-left: 1px solid $secondary-border-color;
+        border-left: 1px solid var(--red-ui-secondary-border-color);
     }
     input[type="checkbox"] {
         display: inline-block;
@@ -265,7 +265,7 @@
     span:nth-child(3), span:nth-child(4) {
         flex-grow: 0;
         padding-right: 5px;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         font-size: 0.9em;
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/mixins.scss b/packages/node_modules/@node-red/editor-client/src/sass/mixins.scss
index 9214ea37b..6262597a1 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/mixins.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/mixins.scss
@@ -31,33 +31,33 @@
 }
 
 @mixin component-border {
-   border: 1px solid $primary-border-color;
+   border: 1px solid var(--red-ui-primary-border-color);
    box-sizing: border-box;
 
 }
 
 @mixin reset-a-style {
-    color: $workspace-button-color !important;
-    background: $workspace-button-background;
+    color: var(--red-ui-workspace-button-color) !important;
+    background: var(--red-ui-workspace-button-background);
     text-decoration: none;
 
     &.disabled, &:disabled  {
         cursor: default;
-        color: $workspace-button-color-disabled !important;
+        color: var(--red-ui-workspace-button-color-disabled) !important;
     }
     &:hover, &:focus {
         text-decoration: none;
     }
-    &:not(.disabled):not(:disabled):hover, {
-        color: $workspace-button-color-hover !important;
-        background: $workspace-button-background-hover;
+    &:not(.disabled):not(:disabled):hover {
+        color: var(--red-ui-workspace-button-color-hover) !important;
+        background: var(--red-ui-workspace-button-background-hover);
     }
     &:not(.disabled):not(:disabled):focus {
-        color: $workspace-button-color-focus !important;
+        color: var(--red-ui-workspace-button-color-focus) !important;
     }
     &:not(.disabled):not(:disabled):active {
-        color: $workspace-button-color-active !important;
-        background: $workspace-button-background-active;
+        color: var(--red-ui-workspace-button-color-active) !important;
+        background: var(--red-ui-workspace-button-background-active);
         text-decoration: none;
     }
 }
@@ -68,14 +68,14 @@
 
     box-sizing: border-box;
     display: inline-block;
-    border: 1px solid $form-input-border-color;
+    border: 1px solid var(--red-ui-form-input-border-color);
     text-align: center;
     margin:0;
     cursor:pointer;
 
     &.selected:not(.disabled):not(:disabled) {
-        color: $workspace-button-color-selected !important;
-        background: $workspace-button-background-active;
+        color: var(--red-ui-workspace-button-color-selected) !important;
+        background: var(--red-ui-workspace-button-background-active);
     }
     .button-group &:not(:first-child) {
         border-left: none;
@@ -108,23 +108,23 @@
     }
 
     &:focus {
-        outline: 1px solid $workspace-button-color-focus-outline;
+        outline: 1px solid var(--red-ui-workspace-button-color-focus-outline);
         outline-offset: 1px;
     }
 
     &.primary {
-        border-color: $workspace-button-background-primary;
-        color: $workspace-button-color-primary !important;
-        background: $workspace-button-background-primary;
+        border-color: var(--red-ui-workspace-button-background-primary);
+        color: var(--red-ui-workspace-button-color-primary) !important;
+        background: var(--red-ui-workspace-button-background-primary);
         &.disabled, &.ui-state-disabled {
             background: none;
-            color: $workspace-button-color !important;
-            border-color: $form-input-border-color;
+            color: var(--red-ui-workspace-button-color) !important;
+            border-color: var(--red-ui-form-input-border-color);
         }
         &:not(.disabled):not(.ui-button-disabled):hover {
-            border-color: $workspace-button-background-primary-hover;
-            background: $workspace-button-background-primary-hover;
-            color: $workspace-button-color-primary !important;
+            border-color: var(--red-ui-workspace-button-background-primary-hover);
+            background: var(--red-ui-workspace-button-background-primary-hover);
+            color: var(--red-ui-workspace-button-color-primary) !important;
         }
     }
     &.secondary {
@@ -151,7 +151,7 @@
         margin-bottom: 1px;
         &.selected:not(.disabled):not(:disabled) {
             border-bottom-width: 2px;
-            border-bottom-color: $form-input-border-selected-color;
+            border-bottom-color: var(--red-ui-form-input-border-selected-color);
             margin-bottom: 0;
             cursor: default;
         }
@@ -166,7 +166,7 @@
     padding: 6px 14px;
     margin-right: 8px;
     &:not(.disabled):hover {
-        //color: $workspace-button-color;
+        //color: var(--red-ui-workspace-button-color);
     }
     &.disabled {
         background: none;
@@ -187,8 +187,8 @@
 }
 
 @mixin component-footer {
-    border-top: 1px solid $primary-border-color;
-    background: $primary-background;
+    border-top: 1px solid var(--red-ui-primary-border-color);
+    background: var(--red-ui-primary-background);
     text-align: right;
     position: absolute;
     bottom: 0;
@@ -231,7 +231,7 @@
 }
 
 @mixin component-shadow {
-    box-shadow: 1px 1px 4px $shadow;
+    box-shadow: 1px 1px 4px var(--red-ui-shadow);
 
 }
 
@@ -241,7 +241,7 @@
     left: 0;
     bottom: 0;
     right: 0;
-    background: $shade-color;
+    background: var(--red-ui-shade-color);
     z-index: 5;
 }
 .red-ui-shade {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/notifications.scss b/packages/node_modules/@node-red/editor-client/src/sass/notifications.scss
index 52e8509b3..efae432b2 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/notifications.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/notifications.scss
@@ -27,10 +27,10 @@
     position: relative;
     padding: 8px 18px 0px;
     margin-bottom: 4px;
-    box-shadow: 0 1px 1px 1px $shadow;
-    background-color: $secondary-background;
-    color: $primary-text-color;
-    border: 1px solid $notification-border-default;
+    box-shadow: 0 1px 1px 1px var(--red-ui-shadow);
+    background-color: var(--red-ui-secondary-background);
+    color: var(--red-ui-primary-text-color);
+    border: 1px solid var(--red-ui-notification-border-default);
     border-left-width: 16px;
     overflow: hidden;
     .ui-dialog-buttonset {
@@ -50,13 +50,13 @@
 }
 
 .red-ui-notification-success {
-    border-color: $notification-border-success;
+    border-color: var(--red-ui-notification-border-success);
 }
 .red-ui-notification-warning {
-    border-color: $notification-border-warning;
+    border-color: var(--red-ui-notification-border-warning);
 }
 .red-ui-notification-error {
-    border-color: $notification-border-error;
+    border-color: var(--red-ui-notification-border-error);
 }
 
 .red-ui-notification-compact {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/palette-editor.scss b/packages/node_modules/@node-red/editor-client/src/sass/palette-editor.scss
index 34fbd3e07..ca387782b 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/palette-editor.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/palette-editor.scss
@@ -27,7 +27,7 @@
     left:0;
     padding: 0;
     box-sizing:border-box;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
 
     .red-ui-editableList-container {
         border: none;
@@ -37,27 +37,27 @@
 
         li {
             // border: none;
-            // border-top: 1px solid $primary-border-color;
+            // border-top: 1px solid var(--red-ui-primary-border-color);
             padding: 0px;
             .red-ui-button {
                 min-width: 60px;
             }
 
             .disabled {
-                // background: $secondary-background-inactive;//f3f3f3;
+                // background: var(--red-ui-secondary-background-inactive;//f3f3f3);
 
                 .red-ui-palette-module-name {
                     font-style: italic;
-                    color: $tertiary-text-color;
+                    color: var(--red-ui-tertiary-text-color);
                 }
                 .red-ui-palette-module-version {
-                    color: $tertiary-text-color;
+                    color: var(--red-ui-tertiary-text-color);
                 }
                 .red-ui-palette-module-errors .fa-warning {
                     opacity: 0.5;
                 }
                 ul.red-ui-palette-module-error-list li {
-                    color: $tertiary-text-color;
+                    color: var(--red-ui-tertiary-text-color);
                 }
 
 
@@ -66,7 +66,7 @@
                 padding: 12px 16px;
             }
             &:last-child {
-                // border-bottom: 1px solid $primary-border-color;
+                // border-bottom: 1px solid var(--red-ui-primary-border-color);
             }
         }
 
@@ -79,14 +79,14 @@
         bottom:0
     }
     .red-ui-palette-editor-toolbar {
-        background: $primary-background;
+        background: var(--red-ui-primary-background);
         box-sizing: border-box;
         padding: 8px 10px;
-        border-bottom: 1px solid $primary-border-color;
+        border-bottom: 1px solid var(--red-ui-primary-border-color);
         text-align: right;
     }
     .red-ui-palette-module-shade-status {
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
     .red-ui-palette-module-updated {
         margin-left: 10px;
@@ -98,7 +98,7 @@
     .red-ui-palette-module-description {
         margin-left: 20px;
         font-size: 0.9em;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
     .red-ui-palette-module-link {
     }
@@ -120,7 +120,7 @@
         }
     }
     .red-ui-palette-module-set {
-        border:1px solid $secondary-border-color;
+        border:1px solid var(--red-ui-secondary-border-color);
         border-radius: 0;
         padding: 5px;
         position: relative;
@@ -138,7 +138,7 @@
     }
 
     .red-ui-palette-module-type {
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         padding-left: 5px;
         font-size: 0.9em;
         @include enable-selection;
@@ -150,8 +150,8 @@
         border-radius: 3px;
         vertical-align: middle;
         margin-right: 5px;
-        background: $primary-background;
-        border: 1px dashed $secondary-border-color;
+        background: var(--red-ui-primary-background);
+        border: 1px dashed var(--red-ui-secondary-border-color);
     }
     .red-ui-palette-module-set-button-group {
         position: absolute;
@@ -160,35 +160,35 @@
     }
 
     .red-ui-palette-module-set-disabled {
-        background: $list-item-background-disabled;
+        background: var(--red-ui-list-item-background-disabled);
         .red-ui-palette-module-type {
-            color: $secondary-text-color-disabled-active;
+            color: var(--red-ui-secondary-text-color-disabled-active);
         }
     }
     .red-ui-palette-module-more {
         padding: 0 !important;
         margin-top: 10px;
         margin-bottom: 10px;
-        background: $tab-background-inactive;
+        background: var(--red-ui-tab-background-inactive);
         a {
             display: block;
             text-align: center;
             padding: 12px 8px;
-            color: $text-color-code;
+            color: var(--red-ui-text-color-code);
 
             &:hover {
                 text-decoration: none;
-                background: $tab-background-hover;
+                background: var(--red-ui-tab-background-hover);
             }
         }
     }
 
 }
 .red-ui-palette-module-meta {
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     position: relative;
     &.disabled {
-        color: $secondary-text-color-disabled;
+        color: var(--red-ui-secondary-text-color-disabled);
     }
 
     .fa {
@@ -198,7 +198,7 @@
     }
 }
 .red-ui-palette-module-name {
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
     white-space: nowrap;
     @include enable-selection;
 }
@@ -216,7 +216,7 @@
     }
 }
 .red-ui-palette-module-meta .fa-warning {
-    color: $text-color-warning;
+    color: var(--red-ui-text-color-warning);
 }
 ul.red-ui-palette-module-error-list {
     display: inline-block;
@@ -264,9 +264,9 @@ button.red-ui-palette-editor-upload-button {
     right: 0;
     top: 44px;
     padding: 20px;
-    background: $secondary-background;
-    border-bottom: 1px $secondary-border-color solid;
-    box-shadow: 1px 1px 4px $shadow;
+    background: var(--red-ui-secondary-background);
+    border-bottom: 1px var(--red-ui-secondary-border-color solid);
+    box-shadow: 1px 1px 4px var(--red-ui-shadow);
 
     .placeholder-input {
         width: calc(100% - 180px);
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/palette.scss b/packages/node_modules/@node-red/editor-client/src/sass/palette.scss
index 397dd4765..fdfe77f09 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/palette.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/palette.scss
@@ -20,7 +20,7 @@
     top: 0px;
     bottom: 0px;
     left:0px;
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
     width: 180px;
     text-align: center;
     @include disable-selection;
@@ -55,26 +55,26 @@
 .red-ui-palette-search {
     position: relative;
     overflow: hidden;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     text-align: center;
     height: 35px;
     padding: 3px;
-    border-bottom: 1px solid $primary-border-color;
+    border-bottom: 1px solid var(--red-ui-primary-border-color);
     box-sizing:border-box;
 }
 
 .red-ui-palette-category {
-    border-bottom: 1px solid $secondary-border-color;
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
 }
 .red-ui-palette-content {
-    background: $palette-content-background;
+    background: var(--red-ui-palette-content-background);
     padding: 3px;
 }
 
 .red-ui-palette-header {
     position: relative;
-    background: $palette-header-background;
-    color: $palette-header-color;
+    background: var(--red-ui-palette-header-background);
+    color: var(--red-ui-palette-header-color);
     cursor: pointer;
     text-align: left;
     padding: 9px;
@@ -83,7 +83,7 @@
     overflow: hidden;
     user-select: none;
     &:hover {
-        background: $palette-header-background !important;
+        background: var(--red-ui-palette-header-background) !important;
     }
 }
 .red-ui-palette-header > i {
@@ -106,7 +106,7 @@
     clear: both;
 }
 .red-ui-palette-label {
-    color: $node-label-color;
+    color: var(--red-ui-node-label-color);
     font-size: 13px;
     margin: 4px 0 4px 32px;
     line-height: 20px;
@@ -121,16 +121,17 @@
 .red-ui-palette-node {
     // display: inline-block;
     cursor: move;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     margin: 10px auto;
     height: 25px;
     border-radius: 5px;
-    border: 1px solid $node-border;
+    border: 1px solid var(--red-ui-node-border);
     background-position: 5% 50%;
     background-repeat: no-repeat;
     width: 120px;
     background-size: contain;
     position: relative;
+    z-index: 4;
     &:not(.red-ui-palette-node-config):not(.red-ui-palette-node-small):first-child {
         margin-top: 15px;
     }
@@ -140,7 +141,7 @@
 }
 .red-ui-palette-node:hover {
     border-color: transparent;
-    box-shadow: 0 0 0 2px $node-selected-color;
+    box-shadow: 0 0 0 2px var(--red-ui-node-selected-color);
 }
 .red-ui-palette-port {
     position: absolute;
@@ -148,11 +149,11 @@
     left: -5px;
     box-sizing: border-box;
     -moz-box-sizing: border-box;
-    background: $node-port-background;
+    background: var(--red-ui-node-port-background);
     border-radius: 3px;
     width: 10px;
     height: 10px;
-    border: 1px solid $node-border;
+    border: 1px solid var(--red-ui-node-border);
 }
 .red-ui-palette-port-output {
     left:auto;
@@ -160,7 +161,7 @@
 }
 
 .red-ui-palette-node:hover .red-ui-palette-port {
-    background-color: $node-port-background-hover;
+    background-color: var(--red-ui-node-port-background-hover);
 }
 .red-ui-palette-icon-container {
     position: absolute;
@@ -169,14 +170,16 @@
     bottom:0;
     left:0;
     width: 30px;
-    border-right: 1px solid $node-icon-background-color;
-    background-color: $node-icon-background-color;
+    border-right: 1px solid var(--red-ui-node-icon-background-color);
+    border-radius: 4px 0px 0px 4px;
+    background-color: var(--red-ui-node-icon-background-color);
 }
 .red-ui-palette-icon-container-right {
     left: auto;
     right: 0;
     border-right: none;
-    border-left: 1px solid $node-icon-background-color;
+    border-left: 1px solid var(--red-ui-node-icon-background-color);
+    border-radius: 0px 4px 4px 0px;
 }
 .red-ui-palette-icon {
     display: inline-block;
@@ -197,7 +200,7 @@
             background: none;
         }
         .red-ui-palette-icon-fa {
-            color: $secondary-text-color;
+            color: var(--red-ui-secondary-text-color);
             font-size: 18px;
         }
     }
@@ -248,12 +251,12 @@
     // width: 30px;
     // height: 25px;
     border-radius: 3px;
-    border: 1px solid $node-border;
+    border: 1px solid var(--red-ui-node-border);
     background-position: 5% 50%;
     background-repeat: no-repeat;
     background-size: contain;
     position: relative;
-    background-color: $node-icon-background-color;
+    background-color: var(--red-ui-node-icon-background-color);
     text-align: center;
 
     .red-ui-palette-icon {
@@ -277,7 +280,7 @@
             background: none;
         }
         .red-ui-palette-icon-fa {
-            color: $secondary-text-color;
+            color: var(--red-ui-secondary-text-color);
             font-size: 16px;
         }
     }
@@ -317,5 +320,5 @@
 .red-ui-node-label {
     white-space: nowrap;
     margin-left: 4px;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/panels.scss b/packages/node_modules/@node-red/editor-client/src/sass/panels.scss
index 95d9210f4..c782b341b 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/panels.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/panels.scss
@@ -35,12 +35,12 @@
 
 .red-ui-panels-separator {
     flex: 0 0 auto;
-    border-top: 1px solid $secondary-border-color;
-    border-bottom: 1px solid $secondary-border-color;
+    border-top: 1px solid var(--red-ui-secondary-border-color);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     height: 7px;
     box-sizing: border-box;
     cursor: ns-resize;
-    background-color: $primary-background;
+    background-color: var(--red-ui-primary-background);
 
     &:before {
         content: '';
@@ -55,7 +55,7 @@
         mask-position: center;
         -webkit-mask-repeat: no-repeat;
         mask-repeat: no-repeat;
-        background-color: $grip-color;
+        background-color: var(--red-ui-grip-color);
     }
 }
 
@@ -80,14 +80,13 @@
         vertical-align: top;
         border-top: none;
         border-bottom: none;
-        border-left: 1px solid $secondary-border-color;
-        border-right: 1px solid $secondary-border-color;
+        border-left: 1px solid var(--red-ui-secondary-border-color);
+        border-right: 1px solid var(--red-ui-secondary-border-color);
         height: 100%;
         width: 7px;
         display: inline-block;
         cursor: ew-resize;
-        background-color: $primary-background;
-    }
+        background-color: var(--red-ui-primary-background);
 
         &:before {
             content: '';
@@ -102,6 +101,7 @@
             mask-position: 50% 50%;
             -webkit-mask-repeat: no-repeat;
             mask-repeat: no-repeat;
-            background-color: $grip-color;
+            background-color: var(--red-ui-grip-color);
         }
+    }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/popover.scss b/packages/node_modules/@node-red/editor-client/src/sass/popover.scss
index 2eb167ef4..7e504b59b 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/popover.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/popover.scss
@@ -25,7 +25,7 @@
     color: var(--red-ui-popover-color);
     border-radius: 4px;
     z-index: 1000;
-    font-family: $primary-font;
+    font-family: var(--red-ui-primary-font);
     font-size: 14px;
     line-height: 1.4em;
     @include component-shadow;
@@ -146,7 +146,7 @@
 
 .red-ui-popover-key {
     font-size: 11px;
-    font-family: $monospace-font;
+    font-family: var(--red-ui-monospace-font);
     margin-left: 3px;
     border: 1px solid var(--red-ui-popover-color);
     border-radius:3px;
@@ -163,42 +163,42 @@
         color: var(--red-ui-popover-color) !important;
     }
     a:focus {
-        outline: 1px solid $form-input-focus-color;
+        outline: 1px solid var(--red-ui-form-input-focus-color);
     }
 }
 .red-ui-popover a.red-ui-button,
 .red-ui-popover button.red-ui-button {
     &:not(.primary) {
-        border-color: $popover-button-border-color;
+        border-color: var(--red-ui-popover-button-border-color);
         background: var(--red-ui-popover-background);
         color: var(--red-ui-popover-color) !important;
     }
     &:not(.primary):not(.disabled):not(.ui-button-disabled):hover {
-        border-color: $popover-button-border-color-hover;
+        border-color: var(--red-ui-popover-button-border-color-hover);
     }
 
 
     &.primary {
-        border-color: $popover-button-border-color;
+        border-color: var(--red-ui-popover-button-border-color);
     }
     &.primary:not(.disabled):not(.ui-button-disabled):hover {
-        border-color: $popover-button-border-color-hover;
+        border-color: var(--red-ui-popover-button-border-color-hover);
     }
 }
 .red-ui-popover code {
     border: none;
     background: none;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
 
 
 .red-ui-popover-panel {
     @include component-shadow;
-    font-family: $primary-font;
-    font-size: $primary-font-size;
+    font-family: var(--red-ui-primary-font);
+    font-size: var(--red-ui-primary-font-size);
     position: absolute;
     box-sizing: border-box;
-    border: 1px solid $primary-border-color;
-    background: $secondary-background;
+    border: 1px solid var(--red-ui-primary-border-color);
+    background: var(--red-ui-secondary-background);
     z-index: 2000;
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/projects.scss b/packages/node_modules/@node-red/editor-client/src/sass/projects.scss
index 681e7b3f9..ee43c7a87 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/projects.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/projects.scss
@@ -29,7 +29,7 @@
     overflow-y: scroll;
 }
 .red-ui-sidebar-vc-shade {
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
 }
 
 .red-ui-projects-edit-form form {
@@ -37,7 +37,7 @@
     .form-row {
         margin-bottom: 15px;
         label {
-            color: $primary-text-color;
+            color: var(--red-ui-primary-text-color);
             width: 100%;
             display: block;
             &.red-ui-projects-edit-form-inline-label {
@@ -57,7 +57,7 @@
 
 }
 .red-ui-projects-edit-form-sublabel {
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
     text-align: right;
     margin-bottom: -15px;
     font-weight: normal;
@@ -76,7 +76,7 @@
         font-size: 1.4em;
         padding: 10px;
         min-height: 40px;
-        color: $primary-text-color;
+        color: var(--red-ui-primary-text-color);
     }
     .red-ui-projects-dialog-screen-start-body {
         min-height: 300px;
@@ -132,21 +132,21 @@
     margin-left: -1px;
     padding: 15px;
     margin-top: -15px;
-    border: 1px solid $secondary-border-color;
+    border: 1px solid var(--red-ui-secondary-border-color);
     border-radius: 3px;
 }
 .red-ui-projects-dialog-credentials-box-left {
     width: 220px;
     > div {
         padding:  7px 8px 3px 8px;
-        border: 1px solid $secondary-border-color;
+        border: 1px solid var(--red-ui-secondary-border-color);
         border-radius: 4px;
         border-top-right-radius: 0;
         border-bottom-right-radius: 0;
-        border-right-color: $form-background;
+        border-right-color: var(--red-ui-form-background);
         &.disabled {
-            border-color: $form-background;
-            border-right-color:$secondary-border-color;
+            border-color: var(--red-ui-form-background);
+            border-right-color:var(--red-ui-secondary-border-color);
         }
         i {
             font-size: 1.4em;
@@ -173,7 +173,7 @@
 }
 
 .red-ui-projects-dialog-project-list-container {
-    border: 1px solid $secondary-border-color;
+    border: 1px solid var(--red-ui-secondary-border-color);
     border-radius: 2px;
     display: flex;
     flex-direction: column;
@@ -197,43 +197,43 @@
 .red-ui-projects-dialog-project-list-entry {
     padding: 12px 0;
 
-    color: $list-item-color;
-    background: $list-item-background;
-    border-left: 3px solid $list-item-background;
-    border-right: 3px solid $list-item-background;
+    color: var(--red-ui-list-item-color);
+    background: var(--red-ui-list-item-background);
+    border-left: 3px solid var(--red-ui-list-item-background);
+    border-right: 3px solid var(--red-ui-list-item-background);
 
     &.projects-list-entry-current {
         &:not(.selectable) {
-            color: $form-text-color;
-            background: $list-item-background-selected;
-            border-left-color:$list-item-border-selected;
-            border-right-color:$list-item-border-selected;
+            color: var(--red-ui-form-text-color);
+            background: var(--red-ui-list-item-background-selected);
+            border-left-color:var(--red-ui-list-item-border-selected);
+            border-right-color:var(--red-ui-list-item-border-selected);
         }
         i {
-            color: $secondary-text-color;
+            color: var(--red-ui-secondary-text-color);
         }
     }
     &.selectable {
         cursor: pointer;
         &:hover:not(.selected) {
-            color: $form-text-color;
-            background: $list-item-background-hover;
-            border-left-color:$list-item-background-hover;
-            border-right-color:$list-item-background-hover;
+            color: var(--red-ui-form-text-color);
+            background: var(--red-ui-list-item-background-hover);
+            border-left-color:var(--red-ui-list-item-background-hover);
+            border-right-color:var(--red-ui-list-item-background-hover);
         }
     }
     .red-ui-projects-dialog-project-list-entry-icon {
         i {
-            color: $tertiary-text-color;
+            color: var(--red-ui-tertiary-text-color);
             font-size: 2em;
 
         }
     }
     &.selected {
-        color: $form-text-color;
-        background: $list-item-background-selected;
-        border-left-color:$list-item-border-selected;
-        border-right-color:$list-item-border-selected;
+        color: var(--red-ui-form-text-color);
+        background: var(--red-ui-list-item-background-selected);
+        border-left-color:var(--red-ui-list-item-border-selected);
+        border-right-color:var(--red-ui-list-item-border-selected);
     }
     span {
         display: inline-block;
@@ -249,7 +249,7 @@
         float: right;
         margin-right: 20px;
         font-size: 0.9em;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         padding-top: 4px;
     }
     .red-ui-projects-dialog-project-list-entry-tools {
@@ -257,7 +257,7 @@
         top: 16px;
         right: 30px;
         display: none;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
     &:hover {
         .red-ui-projects-dialog-project-list-entry-tools {
@@ -274,7 +274,7 @@
     width: 1000px;
     overflow: hidden;
     padding: 5px 20px;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     transition: left 0.4s;
     white-space: nowrap;
     > span {
@@ -289,7 +289,7 @@
     position: relative;
 }
 .red-ui-projects-dialog-screen-create-type.red-ui-button.toggle.selected:not(.disabled):not(:disabled) {
-    color: $secondary-text-color-active !important;
+    color: var(--red-ui-secondary-text-color-active) !important;
 }
 .red-ui-projects-dialog-screen-input-status {
     text-align: right;
@@ -298,7 +298,7 @@
     right: 8px;
     width: 70px;
     height: 30px;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
 }
 
 .red-ui-sidebar-vc {
@@ -338,17 +338,17 @@
     }
     .red-ui-palette-module-unused {
         & > * {
-            color: $secondary-text-color;
+            color: var(--red-ui-secondary-text-color);
         }
     }
     .red-ui-palette-module-unknown {
-        border: 1px dashed $secondary-border-color;
-        background: $secondary-background-inactive;
+        border: 1px dashed var(--red-ui-secondary-border-color);
+        background: var(--red-ui-secondary-background-inactive);
     }
     .red-ui-palette-module-not-installed {
-        border: 1px dashed $text-color-warning;
+        border: 1px dashed var(--red-ui-text-color-warning);
         i.fa-warning {
-            color: $text-color-warning;
+            color: var(--red-ui-text-color-warning);
         }
     }
 }
@@ -365,11 +365,11 @@
 }
 .red-ui-sidebar-vc {
     .red-ui-editableList-container {
-        background: $tertiary-background;
+        background: var(--red-ui-tertiary-background);
         padding: 0;
         li {
             padding:0;
-            background: $secondary-background;
+            background: var(--red-ui-secondary-background);
         }
     }
     .red-ui-editableList-border {
@@ -384,7 +384,7 @@
     box-sizing: border-box;
     transition: height 0.2s ease-in-out;
     &:first-child {
-        // border-bottom: 1px solid $primary-border-color;
+        // border-bottom: 1px solid var(--red-ui-primary-border-color);
     }
 }
 .red-ui-sidebar-vc-merging {
@@ -399,7 +399,7 @@
     right:0;
     height:0;
     transition: height 0.2s ease-in-out;
-    background: $tertiary-background;
+    background: var(--red-ui-tertiary-background);
     box-sizing: border-box;
     overflow: hidden;
     &.red-ui-sidebar-vc-slide-box-top {
@@ -408,20 +408,20 @@
         left: auto;
         width: 100%;
         max-width: 280px;
-        border-left: 1px solid $primary-border-color;
-        border-right: 1px solid $primary-border-color;
-        border-bottom: 1px solid $primary-border-color;
-        box-shadow: 1px 1px 4px $shadow;
+        border-left: 1px solid var(--red-ui-primary-border-color);
+        border-right: 1px solid var(--red-ui-primary-border-color);
+        border-bottom: 1px solid var(--red-ui-primary-border-color);
+        box-shadow: 1px 1px 4px var(--red-ui-shadow);
 
-        color: $primary-text-color;
-        background: $tertiary-background;
+        color: var(--red-ui-primary-text-color);
+        background: var(--red-ui-tertiary-background);
         padding: 10px;
         box-sizing: border-box;
 
     }
     &.red-ui-sidebar-vc-slide-box-bottom {
         bottom: 0px;
-        border-top: 1px solid $secondary-border-color;
+        border-top: 1px solid var(--red-ui-secondary-border-color);
     }
 
     textarea {
@@ -437,15 +437,15 @@
 .red-ui-projects-branch-list {
     position: relative;
     .red-ui-searchBox-container {
-        border-top: 1px solid $secondary-border-color;
-        border-left: 1px solid $secondary-border-color;
-        border-right: 1px solid $secondary-border-color;
+        border-top: 1px solid var(--red-ui-secondary-border-color);
+        border-left: 1px solid var(--red-ui-secondary-border-color);
+        border-right: 1px solid var(--red-ui-secondary-border-color);
         border-top-left-radius: 2px;
         border-top-right-radius: 2px;
         overflow: hidden;
     }
     .red-ui-editableList {
-        border: 1px solid $secondary-border-color;
+        border: 1px solid var(--red-ui-secondary-border-color);
         border-bottom-left-radius: 2px;
         border-bottom-right-radius: 2px;
         & > .red-ui-editableList-border {
@@ -456,7 +456,7 @@
             padding: 0;
             li {
                 padding: 0;
-                background: $secondary-background;
+                background: var(--red-ui-secondary-background);
             }
         }
     }
@@ -483,23 +483,23 @@
 .red-ui-sidebar-vc-branch-list-entry {
     padding: 5px 8px;
     margin: 0 1px;
-    color: $list-item-color;
-    background: $list-item-background;
-    border-left: 2px solid $list-item-background;
-    border-right: 2px solid $list-item-background;
+    color: var(--red-ui-list-item-color);
+    background: var(--red-ui-list-item-background);
+    border-left: 2px solid var(--red-ui-list-item-background);
+    border-right: 2px solid var(--red-ui-list-item-background);
     cursor: pointer;
     &.selected {
-        border-left-color:$list-item-border-selected;
-        border-right-color:$list-item-border-selected;
+        border-left-color:var(--red-ui-list-item-border-selected);
+        border-right-color:var(--red-ui-list-item-border-selected);
     }
     i { width: 16px; text-align: center}
     &.input-error {
         cursor: default;
     }
     &:not(.input-error):hover {
-        background: $list-item-background-hover;
-        border-left-color:$list-item-border-selected;
-        border-right-color:$list-item-border-selected;
+        background: var(--red-ui-list-item-background-hover);
+        border-left-color:var(--red-ui-list-item-border-selected);
+        border-right-color:var(--red-ui-list-item-border-selected);
     }
     span {
         margin-left: 5px;
@@ -507,7 +507,7 @@
     span.current {
         float: right;
         font-size: 0.8em;
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
     }
 }
 
@@ -542,7 +542,7 @@
     }
     &.red-ui-help-info-node {
         text-align: center;
-        background: $list-item-background;
+        background: var(--red-ui-list-item-background);
         white-space: normal;
         height: auto;
     }
@@ -556,63 +556,63 @@
     overflow: hidden;
     cursor: pointer;
     &:hover {
-        background: $secondary-background-hover;
+        background: var(--red-ui-secondary-background-hover);
     }
 }
 .red-ui-sidebar-vc-commit-more {
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     text-align: center;
     padding: 10px;
     font-style: italic;
 }
 .red-ui-sidebar-vc-commit-sha {
     float: right;
-    font-family: $monospace-font;
-    color: $vcCommitShaColor;
+    font-family: var(--red-ui-monospace-font);
+    color: var(--red-ui-vcCommitShaColor);
     display: inline-block;
     font-size: 0.85em;
     margin-left: 5px;
 }
 .red-ui-sidebar-vc-commit-subject {
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
 }
 .red-ui-sidebar-vc-commit-refs {
     min-height: 22px;
 }
 .red-ui-sidebar-vc-commit-ref {
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
     font-size: 0.7em;
-    border: 1px solid $tertiary-border-color;
+    border: 1px solid var(--red-ui-tertiary-border-color);
     border-radius: 10px;
     padding: 2px 5px;
     margin-right: 5px;
 }
 .red-ui-sidebar-vc-commit-date {
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     font-size: 0.85em;
 }
 .red-ui-sidebar-vc-commit-user {
     float: right;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     font-size: 0.85em;
 }
 .red-ui-sidebar-vc-commit-head {
 }
 .red-ui-sidebar-vc-change-header {
-    color: $primary-text-color;
-    background: $tertiary-background;
+    color: var(--red-ui-primary-text-color);
+    background: var(--red-ui-tertiary-background);
     padding: 4px 10px;
     height: 30px;
     box-sizing: border-box;
-    border-top: 1px solid $secondary-border-color;
-    border-bottom: 1px solid $secondary-border-color;
+    border-top: 1px solid var(--red-ui-secondary-border-color);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     i {
         transition: all 0.2s ease-in-out;
     }
 }
 .red-ui-sidebar-vc-repo-toolbar {
-    color: $primary-text-color;
-    background: $tertiary-background;
+    color: var(--red-ui-primary-text-color);
+    background: var(--red-ui-tertiary-background);
     padding: 10px;
     box-sizing: border-box;
 }
@@ -637,7 +637,7 @@
 .red-ui-projects-file-listing-container > .red-ui-editableList > .red-ui-editableList-border {
     border-radius: 0;
     border: none;
-    border-top: 1px solid $secondary-border-color;
+    border-top: 1px solid var(--red-ui-secondary-border-color);
 
 }
 .red-ui-editableList-container .red-ui-projects-dialog-file-list {
@@ -654,39 +654,39 @@
 }
 .red-ui-projects-dialog-file-list-entry {
     padding: 3px 0;
-    border-left: 2px solid $list-item-background;
-    border-right: 2px solid $list-item-background;
-    background: $list-item-background;
+    border-left: 2px solid var(--red-ui-list-item-background);
+    border-right: 2px solid var(--red-ui-list-item-background);
+    background: var(--red-ui-list-item-background);
 
     &.projects-list-entry-current {
         &:not(.selectable) {
-            background: $list-item-background-selected;
+            background: var(--red-ui-list-item-background-selected);
         }
         i {
-            color: $secondary-text-color-selected;
+            color: var(--red-ui-secondary-text-color-selected);
         }
     }
     &.selectable {
         cursor: pointer;
         &:hover {
-            background: $list-item-background-hover;
-            border-left-color:$list-item-border-selected;
-            border-right-color:$list-item-border-selected;
+            background: var(--red-ui-list-item-background-hover);
+            border-left-color:var(--red-ui-list-item-border-selected);
+            border-right-color:var(--red-ui-list-item-border-selected);
         }
     }
     &.unselectable {
-        color: $secondary-text-color-disabled;
+        color: var(--red-ui-secondary-text-color-disabled);
     }
 
     i {
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
         width: 16px;
         text-align: center;
     }
     &.selected {
-        background: $list-item-background-selected;
-        border-left-color:$list-item-border-selected;
-        border-right-color:$list-item-border-selected;
+        background: var(--red-ui-list-item-background-selected);
+        border-left-color:var(--red-ui-list-item-border-selected);
+        border-right-color:var(--red-ui-list-item-border-selected);
     }
     span {
         display: inline-block;
@@ -696,7 +696,7 @@
          margin: 0 10px 0 0px;
 
          .fa-angle-right {
-             color: $primary-text-color;
+             color: var(--red-ui-primary-text-color);
              transition: all 0.2s ease-in-out;
 
          }
@@ -711,7 +711,9 @@
         transform: rotate(90deg);
     }
 }
-.red-ui-projects-dialog-file-list-entry-file-type-git { color: $tertiary-text-color }
+.red-ui-projects-dialog-file-list-entry-file-type-git {
+    color: var(--red-ui-tertiary-text-color);
+}
 
 .red-ui-projects-dialog-remote-list {
     .red-ui-editableList-container {
@@ -747,7 +749,7 @@ div.red-ui-projects-dialog-ssh-public-key {
         padding: 10px 5px;
         cursor: pointer;
         &:hover {
-            background: $list-item-background-hover;
+            background: var(--red-ui-list-item-background-hover);
         }
     }
 }
@@ -756,7 +758,7 @@ div.red-ui-projects-dialog-ssh-public-key {
     position: relative;
     .red-ui-editableList-container {
         padding: 1px;
-        background: $tertiary-background;
+        background: var(--red-ui-tertiary-background);
         li:last-child {
             border-bottom: none;
         }
@@ -775,7 +777,7 @@ div.red-ui-projects-dialog-ssh-public-key {
         text-align: center;
         min-width: 30px;
         vertical-align: top;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
     .entry-name {
         min-width: 250px;
@@ -784,7 +786,7 @@ div.red-ui-projects-dialog-ssh-public-key {
         font-weight: bold;
     }
     .entry-detail {
-        color: $tertiary-text-color;
+        color: var(--red-ui-tertiary-text-color);
         font-size: 0.9em;
     }
 
@@ -802,9 +804,9 @@ div.red-ui-projects-dialog-ssh-public-key {
     position: relative;
     margin-top: 10px;
     margin-bottom: 20px;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     border-radius: 4px;
-    border: 1px solid $secondary-border-color;
+    border: 1px solid var(--red-ui-secondary-border-color);
     .red-ui-projects-edit-form-sublabel {
         margin-top: -8px !important;
         margin-right: 50px;
@@ -819,7 +821,7 @@ div.red-ui-projects-dialog-ssh-public-key {
 
     .red-ui-projects-dialog-list-dialog-header {
         font-weight: bold;
-        background: $primary-background;
+        background: var(--red-ui-primary-background);
         margin-top: 0 !important;
         padding: 5px 10px;
         margin-bottom: 10px;
@@ -830,5 +832,5 @@ div.red-ui-projects-dialog-ssh-public-key {
     padding: 8px 20px 20px;
 }
 .red-ui-settings-section-description {
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/radialMenu.scss b/packages/node_modules/@node-red/editor-client/src/sass/radialMenu.scss
index deeabc4fc..3348e945a 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/radialMenu.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/radialMenu.scss
@@ -15,8 +15,8 @@
 **/
 
 .red-ui-editor-radial-menu {
-    font-size: $primary-font-size;
-    font-family: $primary-font;
+    font-size: var(--red-ui-primary-font-size);
+    font-family: var(--red-ui-primary-font);
     position: absolute;
     top: 0;
     left:0;
@@ -29,8 +29,8 @@
         border-radius: 80px;
         width: 160px;
         height: 160px;
-        background: $shadow;
-        border: 1px solid $primary-border-color;
+        background: var(--red-ui-shadow);
+        border: 1px solid var(--red-ui-primary-border-color);
     }
 }
 
@@ -39,20 +39,20 @@
     border-radius: 20px;
     width: 50px;
     height: 50px;
-    background: $secondary-background;
-    border: 2px solid $primary-border-color;
+    background: var(--red-ui-secondary-background);
+    border: 2px solid var(--red-ui-primary-border-color);
     text-align: center;
     line-height:50px;
 
     &.selected {
-        background: $workspace-button-background-hover;
+        background: var(--red-ui-workspace-button-background-hover);
     }
 }
 
 .red-ui-editor-radial-menu-opt-disabled {
-    border-color: $tertiary-border-color;
-    color: $tertiary-border-color;
+    border-color: var(--red-ui-tertiary-border-color);
+    color: var(--red-ui-tertiary-border-color);
 }
 .red-ui-editor-radial-menu-opt-active {
-    background: $secondary-background-hover;
+    background: var(--red-ui-secondary-background-hover);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/search.scss b/packages/node_modules/@node-red/editor-client/src/sass/search.scss
index 91d857fb5..f5502715b 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/search.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/search.scss
@@ -22,9 +22,9 @@
     left: 50%;
     margin-left: -250px;
     top: 0px;
-    border: 1px solid $primary-border-color;
-    box-shadow: 0 0 10px $shadow;
-    background: $secondary-background;
+    border: 1px solid var(--red-ui-primary-border-color);
+    box-shadow: 0 0 10px var(--red-ui-shadow);
+    background: var(--red-ui-secondary-background);
 
     .red-ui-searchBox-container {
         display: inline-block;
@@ -47,17 +47,17 @@
     .red-ui-search-container {
         border-top-left-radius: 5px;
         border-top-right-radius: 5px;
-        border: 1px dashed $primary-border-color;
+        border: 1px dashed var(--red-ui-primary-border-color);
         border-bottom: none;
         padding: 0;
         width: 100%;
     }
     .red-ui-search-results-container {
         display: none;
-        height: 150px;
+        height: 195px;
         .red-ui-editableList-container {
-            border: 1px dashed $primary-border-color;
-            border-top: 1px solid $secondary-border-color;
+            border: 1px dashed var(--red-ui-primary-border-color);
+            border-top: 1px solid var(--red-ui-secondary-border-color);
         }
     }
     .red-ui-search-result {
@@ -73,7 +73,7 @@
         }
     }
     .red-ui-search-result-separator {
-        border-bottom: 3px solid $secondary-border-color;
+        border-bottom: 3px solid var(--red-ui-secondary-border-color);
     }
     .red-ui-search-result-node {
         position: relative;
@@ -84,12 +84,12 @@
     .red-ui-search-result-node-port {
         position: absolute;
         border-radius: 2px;
-        border: 1px solid $node-border;;
+        border: 1px solid var(--red-ui-node-border);
         width: 6px;
         height: 7px;
         top:4px;
         left:-4px;
-        background: $node-port-background;
+        background: var(--red-ui-node-port-background);
         box-sizing: border-box;
     }
     .red-ui-search-result-node-output{
@@ -107,26 +107,26 @@
         margin-left:8px;
     }
     .red-ui-search-result-node-label {
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
 }
 
 .red-ui-search-container {
     padding: 3px;
-    background: $form-input-background;
-    border-bottom: 1px solid $secondary-border-color;
+    background: var(--red-ui-form-input-background);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
 }
 .red-ui-search-results-container {
     position:relative;
     height: 300px;
     padding: 5px;
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
     .red-ui-search-results-list {
 
     }
     .red-ui-editableList-container {
         padding: 0;
-        background: $primary-background;
+        background: var(--red-ui-primary-background);
         li {
             padding: 0;
         }
@@ -137,21 +137,21 @@
     display: flex;
     align-items: start;
     cursor: pointer;
-    color: $list-item-color;
-    background: $list-item-background;
-    border-left: 3px solid $list-item-background;
-    border-right: 3px solid $list-item-background;
+    color: var(--red-ui-list-item-color);
+    background: var(--red-ui-list-item-background);
+    border-left: 3px solid var(--red-ui-list-item-background);
+    border-right: 3px solid var(--red-ui-list-item-background);
     li.selected & {
-        background: $list-item-background-selected;
-        border-left-color: $list-item-border-selected;
-        border-right-color: $list-item-border-selected;
+        background: var(--red-ui-list-item-background-selected);
+        border-left-color: var(--red-ui-list-item-border-selected);
+        border-right-color: var(--red-ui-list-item-border-selected);
     }
     &:hover {
         text-decoration: none;
-        color: $form-text-color;
-        background: $list-item-background-hover;
-        border-left-color:$list-item-background-hover;
-        border-right-color:$list-item-background-hover;
+        color: var(--red-ui-form-text-color);
+        background: var(--red-ui-list-item-background-hover);
+        border-left-color:var(--red-ui-list-item-background-hover);
+        border-right-color:var(--red-ui-list-item-background-hover);
     }
     &:after {
         content: "";
@@ -165,7 +165,7 @@
     float:left;
     height: 25px;
     border-radius: 3px;
-    border: 1px solid $node-border;
+    border: 1px solid var(--red-ui-node-border);
     background-position: 5% 50%;
     background-repeat: no-repeat;
     background-size: contain;
@@ -182,28 +182,28 @@
     flex-grow: 1;
 }
 .red-ui-search-result-node-label {
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
 }
 .red-ui-search-result-node-type {
     font-style: italic;
     font-size: 0.9em;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
 .red-ui-search-result-node-flow {
     float:right;
     font-size: 0.8em;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
 .red-ui-search-result-node-id {
     display:none;
     font-size: 0.8em;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
 .red-ui-search-empty {
     padding: 10px;
     text-align: center;
     font-style: italic;
-    color: $form-placeholder-color;
+    color: var(--red-ui-form-placeholder-color);
 }
 .red-ui-search-history {
     button {
@@ -229,12 +229,12 @@
 }
 
 .red-ui-search-result-action {
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
 }
 .red-ui-search-result-action-key {
     position: absolute;
     top: 9px;
     right: 0;
     margin-right: 10px;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss b/packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss
index 18b186bad..21a57d29d 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss
@@ -20,7 +20,7 @@
     right: 0px;
     bottom: 0px;
     width: 315px;
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
     box-sizing: border-box;
     z-index: 10;
     @include component-border;
@@ -32,7 +32,7 @@
 
 #red-ui-sidebar-content {
     position: absolute;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     top: 35px;
     right: 0;
     bottom: 25px;
@@ -47,7 +47,7 @@
     bottom:10px;
     width: 7px;
     // z-index: 11;
-    background-color: $primary-background;
+    background-color: var(--red-ui-primary-background);
     cursor: col-resize;
 
     &:before {
@@ -63,7 +63,7 @@
         mask-position: 50% 50%;
         -webkit-mask-repeat: no-repeat;
         mask-repeat: no-repeat;
-        background-color: $grip-color;
+        background-color: var(--red-ui-grip-color);
     }
 }
 
@@ -82,11 +82,11 @@
 
 .sidebar-header, /* Deprecated -> red-ui-sidebar-header */
 .red-ui-sidebar-header {
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
     text-align: right;
     padding: 8px 10px;
-    background: $primary-background;
-    border-bottom: 1px solid $secondary-border-color;
+    background: var(--red-ui-primary-background);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     white-space: nowrap;
 }
 
@@ -138,9 +138,9 @@ button.red-ui-sidebar-header-button-toggle {
     top: calc(50% - 26px);
 
     padding:15px 8px;
-    border:1px solid $primary-border-color;
-    background:$primary-background;
-    color: $secondary-text-color;
+    border:1px solid var(--red-ui-primary-border-color);
+    background:var(--red-ui-primary-background);
+    color: var(--red-ui-secondary-text-color);
     text-align: center;
     cursor: pointer;
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/style-custom-theme.scss b/packages/node_modules/@node-red/editor-client/src/sass/style-custom-theme.scss
new file mode 100644
index 000000000..1202d9fb7
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/sass/style-custom-theme.scss
@@ -0,0 +1,18 @@
+/**
+* Copyright JS Foundation and other contributors, http://js.foundation
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+**/
+
+@import "colors";
+@import "variables";
\ No newline at end of file
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss b/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss
index 5c8d0ba94..c1f151ca6 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss
@@ -16,7 +16,7 @@
 
 .red-ui-sidebar-node-config {
     position: relative;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     height: 100%;
     overflow-y:auto;
     @include disable-selection;
@@ -37,14 +37,14 @@ ul.red-ui-sidebar-node-config-list {
     }
     .red-ui-palette-node {
         overflow: hidden;
-
+        cursor: default;
         &.selected {
             border-color: transparent;
-            box-shadow: 0 0 0 2px $node-selected-color;
+            box-shadow: 0 0 0 2px var(--red-ui-node-selected-color);
         }
         &.highlighted {
             border-color: transparent;
-            outline: dashed $node-selected-color 4px;
+            outline: dashed var(--red-ui-node-selected-color) 4px;
         }
     }
     .red-ui-palette-label {
@@ -54,11 +54,14 @@ ul.red-ui-sidebar-node-config-list {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
+        &:not(:last-child) {
+            width: calc(100% - 38px);
+        }
     }
     .red-ui-palette-icon-container {
         font-size: 12px;
         line-height: 30px;
-        background-color: $node-icon-background-color;
+        background-color: var(--red-ui-node-icon-background-color);
         border-top-right-radius: 4px;
         border-bottom-right-radius: 4px;
         a {
@@ -67,10 +70,11 @@ ul.red-ui-sidebar-node-config-list {
             bottom: 0;
             left: 0;
             right: 0;
-            color: $node-port-label-color;
+            color: var(--red-ui-node-port-label-color);
+            cursor: pointer;
             &:hover {
                 text-decoration: none;
-                background: $node-port-background-hover;
+                background: var(--red-ui-node-port-background-hover);
             }
         }
     }
@@ -78,12 +82,12 @@ ul.red-ui-sidebar-node-config-list {
 .red-ui-palette-node-config {
     width: 160px;
     height: 30px;
-    background: $node-config-background;
-    color: $primary-text-color;
+    background: var(--red-ui-node-config-background);
+    color: var(--red-ui-primary-text-color);
     cursor: pointer;
 }
 ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     text-align: right;
     padding-right: 3px;
     &:not(:first-child) {
@@ -91,21 +95,21 @@ ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
     }
 }
 .red-ui-palette-node-config-none {
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
     text-align:right;
     padding-right: 3px;
 }
 .red-ui-palette-node-config-unused,.red-ui-palette-node-config-disabled {
-    border-color: $primary-border-color;
-    background: $secondary-background-inactive;
+    border-color: var(--red-ui-primary-border-color);
+    background: var(--red-ui-node-config-background);
     border-style: dashed;
-    color: $tertiary-text-color;
+    color: var(--red-ui-node-config-icon-container-disabled);
 }
 .red-ui-palette-node-config-disabled {
     opacity: 0.6;
     font-style: italic;
     i {
-        color: $secondary-text-color;
+        color: var(--red-ui-node-port-label-color);
         margin-right: 5px;
     }
 }
@@ -116,8 +120,8 @@ ul.red-ui-sidebar-node-config-list li.red-ui-palette-node-config-type {
     height: 38px;
     line-height: 38px;
     padding: 0 8px;
-    background: $palette-header-background;
+    background: var(--red-ui-palette-header-background);
     font-size: 0.8em;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     font-weight: normal;
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss b/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss
index b98d452c1..fc4c78afb 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss
@@ -63,12 +63,12 @@
 .red-ui-sidebar-context-updated {
     text-align: right;
     font-size: 11px;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
     padding: 1px 3px;
 }
 .red-ui-sidebar-context-property-storename {
     display: block;
     font-size: 0.8em;
     font-style: italic;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tab-help.scss b/packages/node_modules/@node-red/editor-client/src/sass/tab-help.scss
index fe4f9fb84..f82b97116 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tab-help.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tab-help.scss
@@ -2,7 +2,7 @@
     // height: calc(100% - 39px);
 }
 .red-ui-help-search {
-    border-bottom: 1px solid $secondary-border-color;
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
 }
 
 .red-ui-sidebar-help-toc {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tab-info.scss b/packages/node_modules/@node-red/editor-client/src/sass/tab-info.scss
index 9c63f2119..57dc7d6e3 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tab-info.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tab-info.scss
@@ -32,7 +32,7 @@
         display: inline-block;
         margin-left: 5px;
     }
-    border-bottom: 1px solid $secondary-border-color;
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
 }
 table.red-ui-info-table {
     font-size: 14px;
@@ -40,8 +40,8 @@ table.red-ui-info-table {
     width: 100%;
 }
 table.red-ui-info-table tr:not(.blank) {
-    border-top: 1px solid $secondary-border-color;
-    border-bottom: 1px solid $secondary-border-color;
+    border-top: 1px solid var(--red-ui-secondary-border-color);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
 }
 .red-ui-help-property-expand  {
     font-size: 0.8em;
@@ -57,7 +57,7 @@ table.red-ui-info-table tr.blank {
     th {
         text-align: left;
         font-weight: 500;
-        color: $primary-text-color;
+        color: var(--red-ui-primary-text-color);
         padding: 6px 3px 3px;
     }
     >* {
@@ -69,9 +69,9 @@ table.red-ui-info-table tr.blank {
 
     a {
         display: block;
-        color: $primary-text-color;
+        color: var(--red-ui-primary-text-color);
         &:hover,&:focus {
-            color: $primary-text-color;
+            color: var(--red-ui-primary-text-color);
             text-decoration: none;
         }
         &:not(.expanded) {
@@ -103,36 +103,36 @@ table.red-ui-info-table tr.blank {
 }
 .red-ui-help-info-none {
     font-style: italic;
-    color: $tertiary-text-color;
+    color: var(--red-ui-tertiary-text-color);
 }
 table.red-ui-info-table tr:not(.blank) td:first-child{
-    color: $header-text-color;
+    color: var(--red-ui-header-text-color);
     vertical-align: top;
     width: 90px;
     padding: 3px 3px 3px 6px;
-    background:$tertiary-background;
-    border-right: 1px solid $secondary-border-color;
+    background:var(--red-ui-tertiary-background);
+    border-right: 1px solid var(--red-ui-secondary-border-color);
 }
 table.red-ui-info-table tr:not(.blank) td:last-child{
     padding: 3px 3px 3px 6px;
-    color: $primary-text-color;
+    color: var(--red-ui-primary-text-color);
     overflow-y: hidden;
 }
 div.red-ui-info-table {
     margin: 5px;
 }
 .red-ui-help {
-    font-size: $primary-font-size;
+    font-size: var(--red-ui-primary-font-size);
     line-height: 1.5em;
 
     a {
-        color: $text-color-link;
+        color: var(--red-ui-text-color-link);
         text-decoration: none;
     }
 
     a:hover,
     a:focus {
-        color: $text-color-link;
+        color: var(--red-ui-text-color-link);
         text-decoration: underline;
     }
 
@@ -143,7 +143,7 @@ div.red-ui-info-table {
         line-height: 1.3em;
         margin: 8px auto;
         &.red-ui-help-title {
-            border-bottom: 1px solid $tertiary-border-color;
+            border-bottom: 1px solid var(--red-ui-tertiary-border-color);
         }
     }
     h2 {
@@ -168,24 +168,24 @@ div.red-ui-info-table {
     & > span > p:first-child {
     }
     dl.message-properties {
-        border: 1px solid $secondary-border-color;
+        border: 1px solid var(--red-ui-secondary-border-color);
         border-radius: 2px;
 
         margin: 5px auto 10px;
         &>dt {
             padding: 0px 3px 2px 3px;
-            font-family: $monospace-font;
+            font-family: var(--red-ui-monospace-font);
             font-weight: normal;
             margin: 5px 3px 1px;
-            color: $text-color-code;
+            color: var(--red-ui-text-color-code);
             white-space: nowrap;
             &.optional {
                 font-style: italic;
 
             }
             .property-type {
-                font-family: $primary-font;
-                color: $primary-text-color;
+                font-family: var(--red-ui-primary-font);
+                color: var(--red-ui-primary-text-color);
                 font-style: italic;
                 font-size: 11px;
                 float: right;
@@ -204,7 +204,7 @@ div.red-ui-info-table {
     ol.node-ports {
         margin: 0;
         li {
-            border: 1px solid $secondary-border-color;
+            border: 1px solid var(--red-ui-secondary-border-color);
             border-radius: 2px;
             list-style-position: inside;
             padding: 3px;
@@ -224,7 +224,7 @@ div.red-ui-info-table {
             transition: transform 0.2s ease-in-out;
             margin-right: 4px;
         }
-        color: $header-text-color;
+        color: var(--red-ui-header-text-color);
         &:hover, &:focus {
             text-decoration: none;
         }
@@ -242,7 +242,7 @@ div.red-ui-info-table {
         overflow       : hidden;
     }
     table thead tr {
-        background-color: var(--red-ui-primary-background); //$primary-text-color;
+        background-color: var(--red-ui-primary-background); //var(--red-ui-primary-text-color);
         border-bottom: 1px solid var(--red-ui-secondary-border-color);
         color: var(--red-ui-header-text-color);
         text-align: left;
@@ -252,7 +252,7 @@ div.red-ui-info-table {
         padding: 6px 8px;
     }
     table tbody tr:nth-of-type(even) {
-        background-color: var(--red-ui-tertiary-background); //$primary-background;
+        background-color: var(--red-ui-tertiary-background); //var(--red-ui-primary-background);
     }
 }
 .red-ui-sidebar-info-stack {
@@ -273,10 +273,10 @@ div.red-ui-info-table {
     height: 0;
     transition: height 0.2s, padding 0.2s;
     box-sizing: border-box;
-    border-top: 1px solid $secondary-border-color;
-    background-color: $secondary-background;
+    border-top: 1px solid var(--red-ui-secondary-border-color);
+    background-color: var(--red-ui-secondary-background);
     padding: 0;
-    box-shadow: 0 5px 20px 0px $shadow;
+    box-shadow: 0 5px 20px 0px var(--red-ui-shadow);
     overflow-y: auto;
 }
 .red-ui-sidebar-info.show-tips {
@@ -305,7 +305,7 @@ div.red-ui-info-table {
     font-size: 16px;
     text-align: center;
     line-height: 1.9em;
-    color : $tertiary-text-color;
+    color : var(--red-ui-tertiary-text-color);
     @include disable-selection;
     cursor: default;
 }
@@ -314,14 +314,14 @@ div.red-ui-info-table {
     top: 4px;
     right: 6px;
     a {
-        color: $secondary-text-color;
-        border-color: $secondary-border-color !important;
+        color: var(--red-ui-secondary-text-color);
+        border-color: var(--red-ui-secondary-border-color) !important;
         margin-left: 4px;
     }
 }
 
 .node-info-property-config-node {
-    border: 1px solid $secondary-border-color;
+    border: 1px solid var(--red-ui-secondary-border-color);
     border-radius: 4px;
     padding: 2px 4px 2px;
 }
@@ -346,7 +346,7 @@ div.red-ui-info-table {
     }
 
     .red-ui-info-outline-project {
-        border-bottom: 1px solid $secondary-border-color;
+        border-bottom: 1px solid var(--red-ui-secondary-border-color);
     }
 }
 .red-ui-info-outline,
@@ -380,13 +380,13 @@ div.red-ui-info-table {
                 background: none;
             }
             .red-ui-palette-icon-fa {
-                color: $secondary-text-color;
+                color: var(--red-ui-secondary-text-color);
                 font-size: 18px;
             }
         }
         &.red-ui-info-outline-item-empty {
             font-style: italic;
-            color: $form-placeholder-color;
+            color: var(--red-ui-form-placeholder-color);
         }
     }
 
@@ -414,7 +414,7 @@ div.red-ui-info-table {
         white-space: nowrap;
     }
     .red-ui-search-result-node-label {
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
 }
 
@@ -439,16 +439,16 @@ div.red-ui-info-table {
     right: 1px;
     padding: 1px 2px 0 1px;
     text-align: right;
-    background: $list-item-background;
+    background: var(--red-ui-list-item-background);
 
     .red-ui-treeList-label:hover & {
-        background: $list-item-background-hover;
+        background: var(--red-ui-list-item-background-hover);
     }
     .red-ui-treeList-label.focus & {
-        background: $list-item-background-hover;
+        background: var(--red-ui-list-item-background-hover);
     }
     .red-ui-treeList-label.selected & {
-        background: $list-item-background-selected;
+        background: var(--red-ui-list-item-background-selected);
     }
 
 
@@ -510,7 +510,7 @@ div.red-ui-info-table {
     }
     .red-ui-info-outline-item-label {
         font-style: italic;
-        color: $secondary-text-color-disabled;
+        color: var(--red-ui-secondary-text-color-disabled);
     }
     .red-ui-icons-flow {
         opacity: 0.4;
@@ -538,7 +538,7 @@ div.red-ui-info-table {
     -webkit-mask-size: contain;
     mask-repeat: no-repeat;
     -webkit-mask-repeat: no-repeat;
-    background-color: $icons-flow-color;
+    background-color: var(--red-ui-icons-flow-color);
     // filter: brightness(2.5);
 }
 
@@ -549,8 +549,8 @@ div.red-ui-info-table {
     text-align: left;
     // padding-left: 9px;
     // box-sizing: border-box;
-    // background: $palette-header-background;
-    // border-bottom: 1px solid $secondary-border-color;
+    // background: var(--red-ui-palette-header-background);
+    // border-bottom: 1px solid var(--red-ui-secondary-border-color);
 
     .red-ui-searchBox-container {
         position: absolute;
@@ -558,7 +558,7 @@ div.red-ui-info-table {
         right: 8px;
         width: calc(100% - 130px);
         max-width: 250px;
-        background: $palette-header-background;
+        background: var(--red-ui-palette-header-background);
     }
 
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss b/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss
index a5d3003ae..595423888 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tabs.scss
@@ -16,7 +16,7 @@
 
 .red-ui-tabs {
     position: relative;
-    background: $tab-background;
+    background: var(--red-ui-tab-background);
     overflow: hidden;
     height: 35px;
     box-sizing: border-box;
@@ -39,18 +39,18 @@
         display: block;
         height: 35px;
         box-sizing:border-box;
-        border-bottom: 1px solid $primary-border-color;
+        border-bottom: 1px solid var(--red-ui-primary-border-color);
         white-space: nowrap;
         @include disable-selection;
 
         li {
             box-sizing: border-box;
             display: inline-block;
-            border-left: 1px solid  $primary-border-color;
-            border-top: 1px solid  $primary-border-color;
-            border-right: 1px solid $primary-border-color;
-            border-bottom: 1px solid $primary-border-color;
-            background: $tab-background-inactive;
+            border-left: 1px solid  var(--red-ui-primary-border-color);
+            border-top: 1px solid  var(--red-ui-primary-border-color);
+            border-right: 1px solid var(--red-ui-primary-border-color);
+            border-bottom: 1px solid var(--red-ui-primary-border-color);
+            background: var(--red-ui-tab-background-inactive);
             margin: 3px 3px 0 3px;
             height: 32px;
             line-height: 29px;
@@ -73,7 +73,7 @@
                 padding-left: 12px;
                 width: 100%;
                 height: 100%;
-                color: $tab-text-color-inactive;
+                color: var(--red-ui-tab-text-color-inactive);
             }
             a:hover {
                 text-decoration: none;
@@ -83,27 +83,27 @@
             }
 
             &:not(.active) a:hover+a.red-ui-tab-close {
-                background: $tab-background-hover;
+                background: var(--red-ui-tab-background-hover);
             }
             &.highlighted {
-                box-shadow: 0px 0px 4px 2px $node-selected-color;
-                border: dashed 1px $node-selected-color;
+                box-shadow: 0px 0px 4px 2px var(--red-ui-node-selected-color);
+                border: dashed 1px var(--red-ui-node-selected-color);
             }
             &.active {
-                background: $tab-background-active;
+                background: var(--red-ui-tab-background-active);
                 font-weight: bold;
-                border-bottom: 1px solid $tab-background-active;
+                border-bottom: 1px solid var(--red-ui-tab-background-active);
                 z-index: 2;
 
                 a {
-                    color: $tab-text-color-active;
+                    color: var(--red-ui-tab-text-color-active);
                 }
                 a.red-ui-tab-close {
-                    color: $workspace-button-color;
-                    background: $tab-background-active;
+                    color: var(--red-ui-workspace-button-color);
+                    background: var(--red-ui-tab-background-active);
                     &:hover {
-                        background: $workspace-button-background-hover !important;
-                        color: $workspace-button-color-hover;
+                        background: var(--red-ui-workspace-button-background-hover) !important;
+                        color: var(--red-ui-workspace-button-color-hover);
                     }
                 }
                 img.red-ui-tab-icon {
@@ -111,24 +111,24 @@
                 }
 
                 .red-ui-tabs-fade {
-                    background-image: linear-gradient(to right, change-color($tab-background-active, $alpha: 0.001), $tab-background-active);
+                    background-image: linear-gradient(to right, var(--red-ui-tab-background-active-alpha), var(--red-ui-tab-background-active));
                 }
 
             }
             &.selected {
                 &:not(.active) {
-                    background: $tab-background-selected;
+                    background: var(--red-ui-tab-background-selected);
                     .red-ui-tabs-fade {
-                        background-image: linear-gradient(to right, change-color($tab-background-selected, $alpha: 0.001), $tab-background-selected);
+                        background-image: linear-gradient(to right, var(--red-ui-tab-background-selected-alpha), var(--red-ui-tab-background-selected));
                     }
                     .red-ui-tabs-badge-selected {
-                        background: $tab-background-selected;
+                        background: var(--red-ui-tab-background-selected);
                     }
                 }
                 font-weight: bold;
                 .red-ui-tabs-badge-selected {
                     display: inline;
-                    background: $tab-background;
+                    background: var(--red-ui-tab-background);
                 }
                 .red-ui-tabs-badge-changed {
                     display: none;
@@ -136,10 +136,10 @@
 
             }
             &:not(.active) a:hover {
-                color: $workspace-button-color-hover;
-                background: $tab-background-hover;
+                color: var(--red-ui-workspace-button-color-hover);
+                background: var(--red-ui-tab-background-hover);
                 &+.red-ui-tabs-fade {
-                    background-image: linear-gradient(to right, change-color($tab-background-hover, $alpha: 0.001), $tab-background-hover);
+                    background-image: linear-gradient(to right, var(--red-ui-tab-background-hover-alpha), var(--red-ui-tab-background-hover));
                 }
             }
         }
@@ -182,9 +182,9 @@
     &.red-ui-tabs-vertical {
         box-sizing: border-box;
         height: 100%;
-        border-right: 1px solid $primary-border-color;
+        border-right: 1px solid var(--red-ui-primary-border-color);
         margin: 0;
-        background: $tertiary-background;
+        background: var(--red-ui-tertiary-background);
         overflow: visible;
 
         .red-ui-tabs-scroll-container {
@@ -203,13 +203,13 @@
                 display: block;
                 margin: 0;
                 border: none;
-                border-right: 1px solid $primary-border-color;
+                border-right: 1px solid var(--red-ui-primary-border-color);
                 height: auto;
                 &:not(:first-child) {
-                    border-top: 1px solid $secondary-border-color;
+                    border-top: 1px solid var(--red-ui-secondary-border-color);
                 }
                 &:last-child {
-                    border-bottom: 1px solid $secondary-border-color;
+                    border-bottom: 1px solid var(--red-ui-secondary-border-color);
                 }
 
                 a.red-ui-tab-label {
@@ -217,7 +217,7 @@
                 }
 
                 &.active {
-                    border-right: 1px solid $tab-background-active;
+                    border-right: 1px solid var(--red-ui-tab-background-active);
                 }
             }
         }
@@ -238,8 +238,8 @@
     top: 0;
     right: 0;
     height: 35px;
-    background: $tab-background;
-    border-bottom: 1px solid $primary-border-color;
+    background: var(--red-ui-tab-background);
+    border-bottom: 1px solid var(--red-ui-primary-border-color);
     z-index: 2;
 
     a {
@@ -261,8 +261,8 @@
     top: 0;
     right: 0;
     height: 35px;
-    background: $tab-background;
-    border-bottom: 1px solid $primary-border-color;
+    background: var(--red-ui-tab-background);
+    border-bottom: 1px solid var(--red-ui-primary-border-color);
     z-index: 2;
     a {
         @include workspace-button-toggle;
@@ -272,7 +272,7 @@
         margin: 4px 3px 3px;
         z-index: 2;
         &.red-ui-tab-link-button-menu {
-            border-color: $tab-background;
+            border-color: var(--red-ui-tab-background);
         }
         &:not(.single):not(.selected) {
             margin-top: 4px;
@@ -286,27 +286,27 @@
         height: 35px;
         width: 21px;
         display: block;
-        color: $workspace-button-color;
+        color: var(--red-ui-workspace-button-color);
         font-size: 22px;
         text-align: center;
         margin:0;
         border-left: none;
         border-right: none;
         border-top: none;
-        border-bottom: 1px solid $primary-border-color;
+        border-bottom: 1px solid var(--red-ui-primary-border-color);
         line-height: 34px;
     }
 }
 .red-ui-tab-scroll-left {
     left:0;
     a {
-        border-right: 1px solid $primary-border-color;
+        border-right: 1px solid var(--red-ui-primary-border-color);
     }
 }
 .red-ui-tab-scroll-right {
     right: 0px;
     a {
-        border-left: 1px solid $primary-border-color;
+        border-left: 1px solid var(--red-ui-primary-border-color);
     }
 
 }
@@ -341,7 +341,7 @@
     top: 0;
     right: 0;
     width: 15px;
-    background-image: linear-gradient(to right, change-color($tab-background-inactive, $alpha: 0.001), $tab-background-inactive);
+    background-image: linear-gradient(to right, var(--red-ui-tab-background-inactive-alpha), var(--red-ui-tab-background-inactive));
     pointer-events: none;
 }
 
@@ -365,7 +365,7 @@ i.red-ui-tab-icon {
         mask-position: center;
         -webkit-mask-repeat: no-repeat;
         mask-repeat: no-repeat;
-        background-color: $tab-icon-color;
+        background-color: var(--red-ui-tab-icon-color);
     }
 }
 .red-ui-tabs-badges {
@@ -379,7 +379,7 @@ i.red-ui-tab-icon {
     line-height: 28px;
     text-align: center;
     padding:0px;
-    color: $tab-badge-color;
+    color: var(--red-ui-tab-badge-color);
 }
 
 .red-ui-tabs-badges i {
@@ -415,7 +415,7 @@ i.red-ui-tab-icon {
 }
 .red-ui-tab-close {
     display: none;
-    background: $tab-background-inactive;
+    background: var(--red-ui-tab-background-inactive);
     opacity: 0.8;
     position: absolute;
     right: 0px;
@@ -425,10 +425,10 @@ i.red-ui-tab-icon {
     line-height: 28px;
     text-align: center;
     padding: 0px;
-    color: $workspace-button-color;
+    color: var(--red-ui-workspace-button-color);
     &:hover {
-        background: $workspace-button-background-hover !important;
-        color: $workspace-button-color-hover;
+        background: var(--red-ui-workspace-button-background-hover) !important;
+        color: var(--red-ui-workspace-button-color-hover);
         opacity: 1;
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tourGuide.scss b/packages/node_modules/@node-red/editor-client/src/sass/tourGuide.scss
index f8d175d44..a22c07f7f 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tourGuide.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tourGuide.scss
@@ -97,7 +97,7 @@
         color: var(--red-ui-primary-text-color) !important;
     }
     &:not(.primary):not(.disabled):not(.ui-button-disabled):hover {
-        border-color: $popover-button-border-color-hover;
+        border-color: var(--red-ui-popover-button-border-color-hover);
     }
 }
 
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/checkboxSet.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/checkboxSet.scss
index a606bba8c..47929378b 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/checkboxSet.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/checkboxSet.scss
@@ -16,7 +16,7 @@
 .red-ui-checkboxSet {
     width: 15px;
     display: inline-block;
-    color: $secondary-text-color;
+    color: var(--red-ui-secondary-text-color);
     cursor: pointer;
     input {
         display:none !important;
@@ -24,6 +24,6 @@
 
     &.disabled {
         pointer-events: none;
-        color: $secondary-text-color-disabled;
+        color: var(--red-ui-secondary-text-color-disabled);
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/editableList.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/editableList.scss
index a5873f684..00b79b54a 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/editableList.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/editableList.scss
@@ -14,10 +14,10 @@
  * limitations under the License.
  **/
 .red-ui-editableList-border {
-    border: 1px solid $form-input-border-color;
+    border: 1px solid var(--red-ui-form-input-border-color);
     border-radius: 4px;
     .red-ui-editableList-header {
-        border-bottom: 1px solid $form-input-border-color;
+        border-bottom: 1px solid var(--red-ui-form-input-border-color);
         padding: 2px 16px 2px 4px;
         font-size: 0.9em;
     }
@@ -32,22 +32,22 @@
         margin: 0;
     }
     .red-ui-editabelList-item-placeholder {
-        border: 2px dashed $secondary-border-color !important;
+        border: 2px dashed var(--red-ui-secondary-border-color) !important;
     }
     li {
         box-sizing: border-box;
         position: relative;
-        background: $secondary-background;
+        background: var(--red-ui-secondary-background);
         margin:0;
         padding:8px 0px;
-        border-bottom: 1px solid $secondary-border-color;
+        border-bottom: 1px solid var(--red-ui-secondary-border-color);
         min-height: 20px;
         .red-ui-editableList-item-handle {
             position: absolute;
             top: 50%;
             left: 2px;
             margin-top: -7px;
-            color: $tertiary-text-color;
+            color: var(--red-ui-tertiary-text-color);
             cursor: move;
         }
         .red-ui-editableList-item-remove {
@@ -57,7 +57,7 @@
             margin-top: -9px;
         }
         &.ui-sortable-helper {
-            border-top: 1px solid $secondary-border-color;
+            border-top: 1px solid var(--red-ui-secondary-border-color);
         }
         //.red-ui-editableList-item-content { outline: 1px solid red}
 
@@ -68,7 +68,7 @@
             margin-right: 28px;
         }
         &.red-ui-editableList-item-deleting {
-            background: $secondary-background-inactive;
+            background: var(--red-ui-secondary-background-inactive);
         }
     }
 
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/nodeList.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/nodeList.scss
index 01a7a4802..44745e87c 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/nodeList.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/nodeList.scss
@@ -21,9 +21,9 @@
             margin: 0;
             white-space: nowrap;
             border: none;
-            background: $secondary-background;
+            background: var(--red-ui-secondary-background);
             &:hover {
-                background: $secondary-background-hover;
+                background: var(--red-ui-secondary-background-hover);
             }
 
             i.fa-angle-right {
@@ -44,12 +44,12 @@
                 }
             }
             .red-ui-editableList-item-content.disabled {
-                color: $secondary-text-color-disabled;
+                color: var(--red-ui-secondary-text-color-disabled);
             }
             &.red-ui-editableList-section-header {
-                background: $primary-background;
+                background: var(--red-ui-primary-background);
                 .red-ui-editableList-item-content.disabled {
-                    color: $secondary-text-color-disabled;
+                    color: var(--red-ui-secondary-text-color-disabled);
                 }
             }
 
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/searchBox.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/searchBox.scss
index b925e5212..8788ed6a7 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/searchBox.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/searchBox.scss
@@ -21,7 +21,7 @@
         position: absolute;
         top: 9px;
         font-size: 10px;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
     }
     i.fa-search {
         pointer-events: none;
@@ -41,8 +41,8 @@
         margin: 0;
     }
     a.red-ui-searchBox-opts:hover {
-        color: $workspace-button-color-hover;
-        background: $workspace-button-background-hover;
+        color: var(--red-ui-workspace-button-color-hover);
+        background: var(--red-ui-workspace-button-background-hover);
     }
     input.red-ui-searchBox-input {
         border-radius: 0;
@@ -76,8 +76,8 @@
         position: absolute;
         right: 18px;
         top: 4px;
-        background: $primary-background;
-        color: $secondary-text-color;
+        background: var(--red-ui-primary-background);
+        color: var(--red-ui-secondary-text-color);
         padding: 1px 8px;
         font-size: 9px;
         border-radius: 4px;
@@ -97,12 +97,12 @@
 .red-ui-searchBox-compact {
 
     input:focus.red-ui-searchBox-input {
-        outline: 1px solid $form-input-focus-color;
+        outline: 1px solid var(--red-ui-form-input-focus-color);
     }
 
 
     input.red-ui-searchBox-input,input:focus.red-ui-searchBox-input {
-        border: 1px solid $secondary-border-color;
+        border: 1px solid var(--red-ui-secondary-border-color);
         border-radius: 3px;
         font-size: 12px;
         height: 26px;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss
index a32bfad70..82d697b33 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss
@@ -15,9 +15,9 @@
  **/
 
 .red-ui-stack {
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     .red-ui-palette-category {
-        background: $secondary-background;
+        background: var(--red-ui-secondary-background);
 
         &:last-child {
             border-bottom: none;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/treeList.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/treeList.scss
index 5f1d27037..f076a533e 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/treeList.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/treeList.scss
@@ -24,9 +24,9 @@
     width: 100%;
     height: 100%;
     position: relative;
-    background: $tertiary-background;
+    background: var(--red-ui-tertiary-background);
 
-    border: 1px solid $form-input-border-color;
+    border: 1px solid var(--red-ui-form-input-border-color);
     border-radius: 4px;
 
     box-sizing: border-box;
@@ -71,7 +71,7 @@
     padding: 6px 0;
     display: flex;
     align-items: center;
-    color: $list-item-color;
+    color: var(--red-ui-list-item-color);
     text-decoration: none;
     cursor: pointer;
     vertical-align: middle;
@@ -79,26 +79,26 @@
     position: relative;
 
     &:hover, &:hover .red-ui-treeList-sublabel-text {
-        background: $list-item-background-hover;
-        color: $list-item-color;
+        background: var(--red-ui-list-item-background-hover);
+        color: var(--red-ui-list-item-color);
         text-decoration: none;
     }
     &:focus, &:focus .red-ui-treeList-sublabel-text {
-        background: $list-item-background-hover;
+        background: var(--red-ui-list-item-background-hover);
         outline: none;
-        color: $list-item-color;
+        color: var(--red-ui-list-item-color);
         text-decoration: none;
     }
     &.focus, &.focus .red-ui-treeList-sublabel-text {
-        background: $list-item-background-hover;
-        outline: 1px solid $form-input-focus-color !important;
+        background: var(--red-ui-list-item-background-hover);
+        outline: 1px solid var(--red-ui-form-input-focus-color) !important;
         outline-offset: -1px;
-        color: $list-item-color;
+        color: var(--red-ui-list-item-color);
     }
     &.selected, &.selected .red-ui-treeList-sublabel-text {
-        background: $list-item-background-selected;
+        background: var(--red-ui-list-item-background-selected);
         outline: none;
-        color: $list-item-color;
+        color: var(--red-ui-list-item-color);
     }
 
     input.red-ui-treeList-checkbox,
@@ -121,9 +121,9 @@
     padding: 0 10px 0 5px;
     line-height: 32px;
     font-size: 0.9em;
-    color: $list-item-secondary-color;
+    color: var(--red-ui-list-item-secondary-color);
     position: absolute;
-    background: $list-item-background;
+    background: var(--red-ui-list-item-background);
 }
 
 
@@ -143,5 +143,5 @@
     mask-position: 50% 50%;
     -webkit-mask-repeat: no-repeat;
     mask-repeat: no-repeat;
-    background-color: $spinner-color;
+    background-color: var(--red-ui-spinner-color);
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss
index da53e1e2d..1a421fac5 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss
@@ -15,7 +15,7 @@
  **/
 
 .red-ui-typedInput-container {
-    border: 1px solid $form-input-border-color;
+    border: 1px solid var(--red-ui-form-input-border-color);
     border-radius: 5px;
     height: 34px;
     line-height: 14px;
@@ -28,7 +28,7 @@
     position: relative;
     &[disabled] {
         input, button {
-            background: $secondary-background-inactive;
+            background: var(--red-ui-secondary-background-inactive);
             pointer-events: none;
             cursor: not-allowed;
         }
@@ -50,7 +50,7 @@
     }
 
     &.red-ui-typedInput-focus:not(.input-error) {
-        border-color: $form-input-focus-color !important;
+        border-color: var(--red-ui-form-input-focus-color) !important;
     }
     .red-ui-typedInput-value-label {
         flex-grow: 1;
@@ -61,42 +61,42 @@
         overflow: hidden;
         text-overflow: ellipsis;
         .red-ui-typedInput-value-label-inactive {
-            background: $secondary-background-disabled;
-            color: $secondary-text-color-disabled;
+            background: var(--red-ui-secondary-background-disabled);
+            color: var(--red-ui-secondary-text-color-disabled);
         }
     }
 }
 .red-ui-typedInput-options {
     @include component-shadow;
-    font-family: $primary-font;
-    font-size: $primary-font-size;
+    font-family: var(--red-ui-primary-font);
+    font-size: var(--red-ui-primary-font-size);
 
     position: absolute;
     max-height: 350px;
     overflow-y: auto;
-    border: 1px solid $primary-border-color;
+    border: 1px solid var(--red-ui-primary-border-color);
     box-sizing: border-box;
-    background: $secondary-background;
+    background: var(--red-ui-secondary-background);
     white-space: nowrap;
     z-index: 2000;
     a {
         padding: 6px 18px 6px 6px;
         display: flex;
         align-items: center;
-        border-bottom: 1px solid $secondary-border-color;
-        color: $form-text-color;
+        border-bottom: 1px solid var(--red-ui-secondary-border-color);
+        color: var(--red-ui-form-text-color);
         &:hover {
             text-decoration: none;
-            background: $workspace-button-background-hover;
+            background: var(--red-ui-workspace-button-background-hover);
         }
         &:focus {
             text-decoration: none;
-            background: $workspace-button-background-active;
+            background: var(--red-ui-workspace-button-background-active);
             outline: none;
         }
         &:active {
             text-decoration: none;
-            background: $workspace-button-background-active;
+            background: var(--red-ui-workspace-button-background-active);
         }
         input[type="checkbox"] {
             margin: 0 6px 0 0;
@@ -111,7 +111,7 @@
             mask-position: center;
             -webkit-mask-repeat: no-repeat;
             mask-repeat: no-repeat;
-            background-color: $primary-text-color;
+            background-color: var(--red-ui-primary-text-color);
             height: 14px;
             width: 12px;
         }
@@ -128,11 +128,11 @@ button.red-ui-typedInput-option-trigger
     border-top-left-radius: 4px;
     border-bottom-left-radius: 4px;
     padding: 0 1px 0 5px;
-    background: $form-button-background;
+    background: var(--red-ui-form-button-background);
     height: 32px;
     line-height: 30px;
     vertical-align: middle;
-    color: $form-text-color;
+    color: var(--red-ui-form-text-color);
     white-space: nowrap;
     i.red-ui-typedInput-icon {
         margin-left: 1px;
@@ -142,7 +142,7 @@ button.red-ui-typedInput-option-trigger
     &.disabled {
         cursor: default;
         > i.red-ui-typedInput-icon {
-            color: $secondary-text-color-disabled;
+            color: var(--red-ui-secondary-text-color-disabled);
         }
     }
     .red-ui-typedInput-type-label,.red-ui-typedInput-option-label {
@@ -153,19 +153,29 @@ button.red-ui-typedInput-option-trigger
         img {
             max-width: none;
         }
+        .red-ui-typedInput-icon:not(.fa) {
+            display: inline-block;
+            -webkit-mask-size: cover;
+            mask-size: cover;
+            -webkit-mask-position: center;
+            mask-position: center;
+            -webkit-mask-repeat: no-repeat;
+            mask-repeat: no-repeat;
+            background-color: var(--red-ui-primary-text-color);
+        }
     }
 
     &:not(.disabled):hover {
         text-decoration: none;
-        background: $workspace-button-background-hover;
+        background: var(--red-ui-workspace-button-background-hover);
     }
     &:focus {
         text-decoration: none;
         outline: none;
-        box-shadow: inset 0 0 0 1px $form-input-focus-color;
+        box-shadow: inset 0 0 0 1px var(--red-ui-form-input-focus-color);
     }
     &:not(.disabled):active {
-        background: $workspace-button-background-active;
+        background: var(--red-ui-workspace-button-background-active);
         text-decoration: none;
     }
     &.red-ui-typedInput-full-width {
@@ -198,8 +208,8 @@ button.red-ui-typedInput-option-trigger {
     line-height: 32px;
     display: inline-flex;
     .red-ui-typedInput-option-label {
-        background:$form-button-background;
-        color: $form-text-color;
+        background:var(--red-ui-form-button-background);
+        color: var(--red-ui-form-text-color);
         flex-grow: 1;
         padding: 0 0 0 8px;
         display:inline-block;
@@ -221,6 +231,6 @@ button.red-ui-typedInput-option-trigger {
         box-shadow: none;
     }
     &:focus .red-ui-typedInput-option-caret {
-        box-shadow: inset 0 0 0 1px $form-input-focus-color;
+        box-shadow: inset 0 0 0 1px var(--red-ui-form-input-focus-color);
     }
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/userSettings.scss b/packages/node_modules/@node-red/editor-client/src/sass/userSettings.scss
index 5cf0570c2..36ab67e3f 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/userSettings.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/userSettings.scss
@@ -20,7 +20,7 @@
     left: 0;
     bottom: 0;
     width: 120px;
-    background: $tertiary-background;
+    background: var(--red-ui-tertiary-background);
 }
 .red-ui-settings-tabs-content {
     position: absolute;
@@ -30,7 +30,7 @@
     bottom: 0;
     padding: 0;
     h3:not(:first-child) {
-        border-top: 1px solid $secondary-border-color;
+        border-top: 1px solid var(--red-ui-secondary-border-color);
         margin-top: 15px;
         margin-bottom: 10px;
         padding-top: 20px;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/variables.scss b/packages/node_modules/@node-red/editor-client/src/sass/variables.scss
index aadc2231e..50e1c9310 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/variables.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/variables.scss
@@ -1,4 +1,5 @@
 :root {
+
     --red-ui-primary-font: #{$primary-font};
     --red-ui-primary-font-size: #{$primary-font-size};
     --red-ui-monospace-font: #{$monospace-font};
@@ -40,7 +41,6 @@
     --red-ui-text-color-link: #{$text-color-link};
 
 
-
     --red-ui-primary-border-color: #{$primary-border-color};
     --red-ui-secondary-border-color: #{$secondary-border-color};
     --red-ui-tertiary-border-color: #{$tertiary-border-color};
@@ -50,20 +50,38 @@
     --red-ui-border-color-success: #{$border-color-success};
 
     --red-ui-form-background: #{$form-background};
-
     --red-ui-form-placeholder-color: #{$form-placeholder-color};
     --red-ui-form-text-color: #{$form-text-color};
     --red-ui-form-text-color-disabled: #{$form-text-color-disabled};
+    --red-ui-form-input-focus-color: #{$form-input-focus-color};
     --red-ui-form-input-border-color: #{$form-input-border-color};
-    --red-ui-form-input-border-color-focus: #{$form-input-focus-color};
-    --red-ui-form-input-border-color-selected: #{$form-input-border-selected-color};
-    --red-ui-form-input-border-color-error: #{$form-input-border-error-color};
+    --red-ui-form-input-border-selected-color: #{$form-input-border-selected-color};
+    --red-ui-form-input-border-error-color: #{$form-input-border-error-color};
     --red-ui-form-input-background: #{$form-input-background};
     --red-ui-form-input-background-disabled: #{$form-input-background-disabled};
     --red-ui-form-button-background: #{$form-button-background};
 
     --red-ui-form-tips-background: #{$form-tips-background};
 
+
+    --red-ui-text-editor-color: #{$text-editor-color};
+    --red-ui-text-editor-background: #{$text-editor-background};
+    --red-ui-text-editor-color-disabled: #{$text-editor-color-disabled};
+    --red-ui-text-editor-background-disabled: #{$text-editor-background-disabled};
+    --red-ui-text-editor-gutter-background: #{$text-editor-gutter-background};
+    --red-ui-text-editor-gutter-color: #{$text-editor-gutter-color};
+    --red-ui-text-editor-gutter-active-line-background: #{$text-editor-gutter-active-line-background};
+    --red-ui-text-editor-active-line-background: #{$text-editor-active-line-background};
+    --red-ui-text-editor-selection-background: #{$text-editor-selection-background};
+
+    --red-ui-event-log-background: #{$event-log-background};
+    --red-ui-event-log-color: #{$event-log-color};
+    --red-ui-event-log-active-line-background: #{$event-log-active-line-background};
+    --red-ui-event-log-selection-background: #{$event-log-selection-background};
+
+
+
+
     --red-ui-list-item-color: #{$list-item-color};
     --red-ui-list-item-secondary-color: #{$list-item-secondary-color};
     --red-ui-list-item-background: #{$list-item-background};
@@ -72,8 +90,121 @@
     --red-ui-list-item-background-selected: #{$list-item-background-selected};
     --red-ui-list-item-border-selected: #{$list-item-border-selected};
 
+    --red-ui-tab-text-color-active: #{$tab-text-color-active};
+    --red-ui-tab-text-color-inactive: #{$tab-text-color-inactive};
+    --red-ui-tab-text-color-disabled-active: #{$tab-text-color-disabled-active};
+    --red-ui-tab-text-color-disabled-inactive: #{$tab-text-color-disabled-inactive};
+
+    --red-ui-tab-badge-color: #{$tab-badge-color};
+    --red-ui-tab-background: #{$tab-background};
+    --red-ui-tab-background-active: #{$tab-background-active};
+    --red-ui-tab-background-active-alpha: #{$tab-background-active-alpha};
+    --red-ui-tab-background-selected: #{$tab-background-selected};
+    --red-ui-tab-background-selected-alpha: #{$tab-background-selected-alpha};
+    --red-ui-tab-background-inactive: #{$tab-background-inactive};
+    --red-ui-tab-background-inactive-alpha: #{$tab-background-inactive-alpha};
+    --red-ui-tab-background-hover: #{$tab-background-hover};
+    --red-ui-tab-background-hover-alpha: #{$tab-background-hover-alpha};
+
+    --red-ui-palette-header-background: #{$palette-header-background};
+    --red-ui-palette-header-color: #{$palette-header-color};
+    --red-ui-palette-content-background: #{$palette-content-background};
+
+
+    --red-ui-workspace-button-background: #{$workspace-button-background};
+    --red-ui-workspace-button-background-hover: #{$workspace-button-background-hover};
+    --red-ui-workspace-button-background-active: #{$workspace-button-background-active};
+
+    --red-ui-workspace-button-color: #{$workspace-button-color};
+    --red-ui-workspace-button-color-disabled: #{$workspace-button-color-disabled};
+    --red-ui-workspace-button-color-focus: #{$workspace-button-color-focus};
+    --red-ui-workspace-button-color-hover: #{$workspace-button-color-hover};
+    --red-ui-workspace-button-color-active: #{$workspace-button-color-active};
+    --red-ui-workspace-button-color-selected: #{$workspace-button-color-selected};
+
+    --red-ui-workspace-button-color-primary: #{$workspace-button-color-primary};
+    --red-ui-workspace-button-background-primary: #{$workspace-button-background-primary};
+    --red-ui-workspace-button-background-primary-hover: #{$workspace-button-background-primary-hover};
+
+    --red-ui-workspace-button-color-focus-outline: #{$workspace-button-color-focus-outline};
+
     --red-ui-shade-color: #{$shade-color};
 
+    --red-ui-popover-background: #{$popover-background};
+    --red-ui-popover-border: #{$popover-border};
+    --red-ui-popover-color: #{$popover-color};
+    --red-ui-popover-button-border-color: #{$popover-button-border-color};
+    --red-ui-popover-button-border-color-hover: #{$popover-button-border-color-hover};
+
+
+
+    --red-ui-diff-text-header-color: #{$diff-text-header-color};
+    --red-ui-diff-text-header-background: #{$diff-text-header-background};
+    --red-ui-diff-state-color: #{$diff-state-color};
+    --red-ui-diff-state-prefix-color: #{$diff-state-prefix-color};
+    --red-ui-diff-state-added: #{$diff-state-added};
+    --red-ui-diff-state-deleted: #{$diff-state-deleted};
+    --red-ui-diff-state-changed: #{$diff-state-changed};
+    --red-ui-diff-state-changed-background: #{$diff-state-changed-background};
+    --red-ui-diff-state-unchanged: #{$diff-state-unchanged};
+    --red-ui-diff-state-unchanged-background: #{$diff-state-unchanged-background};
+
+    --red-ui-diff-state-conflicted: #{$diff-state-conflicted};
+    --red-ui-diff-state-moved: #{$diff-state-moved};
+    --red-ui-diff-state-conflict: #{$diff-state-conflict};
+    --red-ui-diff-state-conflict-background: #{$diff-state-conflict-background};
+
+    --red-ui-diff-state-added-background: #{$diff-state-added-background};
+    --red-ui-diff-state-added-border: #{$diff-state-added-border};
+    --red-ui-diff-state-added-header-background: #{$diff-state-added-header-background};
+    --red-ui-diff-state-added-header-border: #{$diff-state-added-header-border};
+
+    --red-ui-diff-state-deleted-background: #{$diff-state-deleted-background};
+    --red-ui-diff-state-deleted-border: #{$diff-state-deleted-border};
+    --red-ui-diff-state-deleted-header-background: #{$diff-state-deleted-header-background};
+    --red-ui-diff-state-deleted-header-border: #{$diff-state-deleted-header-border};
+
+    --red-ui-diff-merge-header-color: #{$diff-merge-header-color};
+    --red-ui-diff-merge-header-background: #{$diff-merge-header-background};
+    --red-ui-diff-merge-header-border-color: #{$diff-merge-header-border-color};
+
+    --red-ui-menuBackground: #{$menuBackground};
+    --red-ui-menuDivider: #{$menuDivider};
+    --red-ui-menuColor: #{$menuColor};
+    --red-ui-menuActiveColor: #{$menuActiveColor};
+    --red-ui-menuActiveBackground: #{$menuActiveBackground};
+    --red-ui-menuDisabledColor: #{$menuDisabledColor};
+    --red-ui-menuHoverColor: #{$menuHoverColor};
+    --red-ui-menuHoverBackground: #{$menuHoverBackground};
+    --red-ui-menuCaret: #{$menuCaret};
+
+    --red-ui-view-navigator-background: #{$view-navigator-background};
+
+    --red-ui-view-lasso-stroke: #{$view-lasso-stroke};
+    --red-ui-view-lasso-fill: #{$view-lasso-fill};
+
+    --red-ui-view-background: #{$view-background};
+    --red-ui-view-grid-color: #{$view-grid-color};
+
+    --red-ui-node-label-color: #{$node-label-color};
+    --red-ui-node-port-label-color: #{$node-port-label-color};
+    --red-ui-node-border: #{$node-border};
+    --red-ui-node-border-unknown: #{$node-border-unknown};
+    --red-ui-node-border-placeholder: #{$node-border-placeholder};
+    --red-ui-node-background-placeholder: #{$node-background-placeholder};
+
+    --red-ui-node-port-background: #{$node-port-background};
+    --red-ui-node-port-background-hover: #{$node-port-background-hover};
+    --red-ui-node-icon-color: #{$node-icon-color};
+    --red-ui-node-icon-background-color: #{$node-icon-background-color};
+    --red-ui-node-icon-background-color-fill: #{$node-icon-background-color-fill};
+    --red-ui-node-icon-background-color-opacity: #{$node-icon-background-color-opacity};
+    --red-ui-node-icon-border-color: #{$node-icon-border-color};
+    --red-ui-node-icon-border-color-opacity: #{$node-icon-border-color-opacity};
+
+    --red-ui-node-config-background: #{$node-config-background};
+    --red-ui-node-config-icon-container-disabled: #{$node-config-icon-container-disabled};
+
     --red-ui-node-link-port-background: #{$node-link-port-background};
 
     --red-ui-node-status-error-border: #{$node-status-error-border};
@@ -81,18 +212,87 @@
     --red-ui-node-status-changed-border: #{$node-status-changed-border};
     --red-ui-node-status-changed-background: #{$node-status-changed-background};
 
-    --red-ui-node-border: #{$node-border};
-    --red-ui-node-port-background:#{$node-port-background};
+    @each $current-color in red green yellow blue grey gray {
+        --red-ui-node-status-colors-#{"" + $current-color}: #{map-get($node-status-colors, $current-color)};
+    }
+
 
-    --red-ui-node-label-color: #{$node-label-color};
     --red-ui-node-selected-color: #{$node-selected-color};
     --red-ui-port-selected-color: #{$port-selected-color};
 
-    --red-ui-popover-background: #{$popover-background};
-    --red-ui-popover-border: #{$popover-border};
-    --red-ui-popover-color: #{$popover-color};
+    --red-ui-link-color: #{$link-color};
+    --red-ui-link-link-color: #{$link-link-color};
+    --red-ui-link-disabled-color: #{$link-disabled-color};
+    --red-ui-link-link-active-color: #{$link-link-active-color};
+    --red-ui-link-unknown-color: #{$link-unknown-color};
+
+    --red-ui-clipboard-textarea-background: #{$clipboard-textarea-background};
+
+
+    --red-ui-deploy-button-color: #{$deploy-button-color};
+    --red-ui-deploy-button-color-active: #{$deploy-button-color-active};
+    --red-ui-deploy-button-color-disabled: #{$deploy-button-color-disabled};
+    --red-ui-deploy-button-background: #{$deploy-button-background};
+    --red-ui-deploy-button-background-hover: #{$deploy-button-background-hover};
+    --red-ui-deploy-button-background-active: #{$deploy-button-background-active};
+    --red-ui-deploy-button-background-disabled: #{$deploy-button-background-disabled};
+    --red-ui-deploy-button-background-disabled-hover: #{$deploy-button-background-disabled-hover};
+
+
+    --red-ui-header-background: #{$header-background};
+    --red-ui-header-button-background-active: #{$header-button-background-active};
+    --red-ui-header-menu-color: #{$header-menu-color};
+    --red-ui-header-menu-color-disabled: #{$header-menu-color-disabled};
+    --red-ui-header-menu-heading-color: #{$header-menu-heading-color};
+    --red-ui-header-menu-sublabel-color: #{$header-menu-sublabel-color};
+    --red-ui-header-menu-background: #{$header-menu-background};
+    --red-ui-header-menu-item-hover: #{$header-menu-item-hover};
+    --red-ui-header-menu-item-border-active: #{$header-menu-item-border-active};
+    --red-ui-headerMenuItemDivider: #{$headerMenuItemDivider};
+    --red-ui-headerMenuCaret: #{$headerMenuCaret};
+
+    --red-ui-vcCommitShaColor: #{$vcCommitShaColor};
+
+    --red-ui-dnd-background: #{$dnd-background};
+    --red-ui-dnd-color: #{$dnd-color};
+
+    --red-ui-notification-border-default: #{$notification-border-default};
+    --red-ui-notification-border-success: #{$notification-border-success};
+    --red-ui-notification-border-warning: #{$notification-border-warning};
+    --red-ui-notification-border-error: #{$notification-border-error};
+
+    --red-ui-debug-message-background: #{$debug-message-background};
+    --red-ui-debug-message-background-hover: #{$debug-message-background-hover};
+
+    --red-ui-debug-message-text-color: #{$debug-message-text-color};
+    --red-ui-debug-message-text-color-meta: #{$debug-message-text-color-meta};
+    --red-ui-debug-message-text-color-object-key: #{$debug-message-text-color-object-key};
+    --red-ui-debug-message-text-color-msg-type-other: #{$debug-message-text-color-msg-type-other};
+    --red-ui-debug-message-text-color-msg-type-string: #{$debug-message-text-color-msg-type-string};
+    --red-ui-debug-message-text-color-msg-type-null: #{$debug-message-text-color-msg-type-null};
+    --red-ui-debug-message-text-color-msg-type-meta: #{$debug-message-text-color-msg-type-meta};
+    --red-ui-debug-message-text-color-msg-type-number: #{$debug-message-text-color-msg-type-number};
+
+    --red-ui-debug-message-border: #{$debug-message-border};
+    --red-ui-debug-message-border-hover: #{$debug-message-border-hover};
+    --red-ui-debug-message-border-warning: #{$debug-message-border-warning};
+    --red-ui-debug-message-border-error: #{$debug-message-border-error};
+
+    --red-ui-group-default-fill: #{$group-default-fill};
+    --red-ui-group-default-fill-opacity: #{$group-default-fill-opacity};
+    --red-ui-group-default-stroke: #{$group-default-stroke};
+    --red-ui-group-default-stroke-opacity: #{$group-default-stroke-opacity};
+    --red-ui-group-default-label-color: #{$group-default-label-color};
 
     --red-ui-tourGuide-border: #{$tourGuide-border};
     --red-ui-tourGuide-heading-color: #{$tourGuide-heading-color};
 
+    --red-ui-grip-color: #{$grip-color};
+
+    --red-ui-icons-flow-color: #{$icons-flow-color};
+
+    --red-ui-spinner-color: #{$spinner-color};
+
+    --red-ui-tab-icon-color: #{$tab-icon-color};
+
 }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss b/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss
index d594337de..24e156b1e 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss
@@ -47,12 +47,12 @@
 }
 
 .red-ui-workspace-chart-background {
-    fill: $view-background;
+    fill: var(--red-ui-view-background);
 }
 .red-ui-workspace-chart-grid line {
     fill: none;
     shape-rendering: crispEdges;
-    stroke: $view-grid-color;
+    stroke: var(--red-ui-view-grid-color);
     stroke-width: 1px;
 }
 .red-ui-workspace-select-mode {
@@ -94,11 +94,11 @@
 
         a {
             font-style: italic;
-            color: $tab-text-color-disabled-inactive !important;
+            color: var(--red-ui-tab-text-color-disabled-inactive) !important;
         }
         &.active a {
             font-weight: normal;
-            color: $tab-text-color-disabled-active !important;
+            color: var(--red-ui-tab-text-color-disabled-active) !important;
         }
         .red-ui-workspace-disabled-icon {
             display: inline;
@@ -112,17 +112,17 @@
     bottom: 0;
     right:0;
     z-index: 101;
-    border-left: 1px solid $primary-border-color;
-    border-top: 1px solid $primary-border-color;
-    background: $view-navigator-background;
-    box-shadow: -1px 0 3px $shadow;
+    border-left: 1px solid var(--red-ui-primary-border-color);
+    border-top: 1px solid var(--red-ui-primary-border-color);
+    background: var(--red-ui-view-navigator-background);
+    box-shadow: -1px 0 3px var(--red-ui-shadow);
 }
 .red-ui-navigator-border {
     stroke-dasharray: 5,5;
     pointer-events: none;
-    stroke: $secondary-border-color;
+    stroke: var(--red-ui-secondary-border-color);
     stroke-width: 1;
-    fill: $view-background;
+    fill: var(--red-ui-view-background);
 }
 
 .red-ui-component-footer {
@@ -182,7 +182,7 @@ button.red-ui-footer-button-toggle {
 
 #red-ui-loading-progress {
     position: absolute;
-    background: $primary-background;
+    background: var(--red-ui-primary-background);
     top: 0;
     bottom: 0;
     right: 0;
@@ -196,7 +196,7 @@ button.red-ui-footer-button-toggle {
         width: 300px;
         height:80px;
         text-align: center;
-        color: $secondary-text-color;
+        color: var(--red-ui-secondary-text-color);
 
     }
 }
@@ -204,13 +204,13 @@ button.red-ui-footer-button-toggle {
     box-sizing: border-box;
     width: 300px;
     height: 30px;
-    border: 2px solid $primary-border-color;
+    border: 2px solid var(--red-ui-primary-border-color);
     border-radius: 4px;
 
     > span {
         display: block;
         height: 100%;
-        background: $secondary-border-color;
+        background: var(--red-ui-secondary-border-color);
         transition: width 0.2s;
         width: 10%;
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/workspaceToolbar.scss b/packages/node_modules/@node-red/editor-client/src/sass/workspaceToolbar.scss
index 2a734eb43..d0b0370ab 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/workspaceToolbar.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/workspaceToolbar.scss
@@ -17,7 +17,7 @@
 
 #red-ui-workspace-toolbar {
     display: none;
-    color: $workspace-button-color;
+    color: var(--red-ui-workspace-button-color);
     font-size: 12px;
     line-height: 18px;
     position: absolute;
@@ -27,8 +27,8 @@
     padding: 7px;
     height: 40px;
     box-sizing: border-box;
-    background: $secondary-background;
-    border-bottom: 1px solid $secondary-border-color;
+    background: var(--red-ui-secondary-background);
+    border-bottom: 1px solid var(--red-ui-secondary-border-color);
     white-space: nowrap;
     transition: right 0.2s ease;
     overflow: hidden;
@@ -61,23 +61,23 @@
             }
         }
         .button.active {
-            background: $workspace-button-background-active;
+            background: var(--red-ui-workspace-button-background-active);
             cursor: default;
         }
     }
 
     .spinner-value {
         width: 25px;
-        color: $workspace-button-color;
+        color: var(--red-ui-workspace-button-color);
         padding: 0 5px;
         display: inline-block;
         text-align: center;
-        border-top: 1px solid $secondary-border-color;
-        border-bottom: 1px solid $secondary-border-color;
+        border-top: 1px solid var(--red-ui-secondary-border-color);
+        border-bottom: 1px solid var(--red-ui-secondary-border-color);
         margin: 0;
         height: 24px;
         font-size: 12px;
-        background: $form-input-background;
+        background: var(--red-ui-form-input-background);
         line-height: 22px;
         box-sizing: border-box;
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/2.1/welcome.js b/packages/node_modules/@node-red/editor-client/src/tours/2.1/welcome.js
new file mode 100644
index 000000000..8a4565bab
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/tours/2.1/welcome.js
@@ -0,0 +1,229 @@
+export default {
+    version: "2.1.0",
+    steps: [
+        {
+            titleIcon: "fa fa-map-o",
+            title: {
+                "en-US": "Welcome to Node-RED 2.1!",
+                "ja": "Node-RED 2.1へようこそ!"
+        },
+            description: {
+                "en-US": "Let's take a moment to discover the new features in this release.",
+                "ja": "本リリースの新機能を見つけてみましょう。"
+            }
+        },
+        {
+            title: {
+                "en-US": "A new Tour Guide",
+                "ja": "新しいツアーガイド"
+            },
+            description: {
+                "en-US": "<p>First, as you've already found, we now have this tour of new features. We'll only show the tour the first time you open the editor for each new version of Node-RED.</p>" +
+                         "<p>You can choose not to see this tour in the future by disabling it under the View tab of User Settings.</p>",
+                "ja": "<p>最初に、既に見つけている様に、新機能の本ツアーがあります。本ツアーは、新バージョンのNode-REDフローエディタを初めて開いた時のみ表示されます。</p>" +
+                      "<p>ユーザ設定の表示タブの中で、この機能を無効化することで、本ツアーを表示しないようにすることもできます。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "New Edit menu",
+                "ja": "新しい編集メニュー"
+            },
+            prepare() {
+                $("#red-ui-header-button-sidemenu").trigger("click");
+                $("#menu-item-edit-menu").parent().addClass("open");
+            },
+            complete() {
+                $("#menu-item-edit-menu").parent().removeClass("open");
+            },
+            element: "#menu-item-edit-menu-submenu",
+            interactive: false,
+            direction: "left",
+            description: {
+                "en-US": "<p>The main menu has been updated with a new 'Edit' section. This includes all of the familar options, like cut/paste and undo/redo.</p>" +
+                         "<p>The menu now displays keyboard shortcuts for the options.</p>",
+                "ja": "<p>メインメニューに「編集」セクションが追加されました。本セクションには、切り取り/貼り付けや、変更操作を戻す/やり直しの様な使い慣れたオプションが含まれています。</p>" +
+                      "<p>本メニューには、オプションのためのキーボードショートカットも表示されるようになりました。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "Arranging nodes",
+                "ja": "ノードの配置"
+            },
+            prepare() {
+                $("#red-ui-header-button-sidemenu").trigger("click");
+                $("#menu-item-arrange-menu").parent().addClass("open");
+            },
+            complete() {
+                $("#menu-item-arrange-menu").parent().removeClass("open");
+            },
+            element: "#menu-item-arrange-menu-submenu",
+            interactive: false,
+            direction: "left",
+            description: {
+                "en-US": "<p>The new 'Arrange' section of the menu provides new options to help arrange your nodes. You can align them to a common edge, spread them out evenly or change their order.</p>",
+                "ja": "<p>メニューの新しい「配置」セクションには、ノードの配置を助ける新しいオプションが提供されています。ノードの端を揃えたり、均等に配置したり、表示順序を変更したりできます。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "Hiding tabs",
+                "ja": "タブの非表示"
+            },
+            element: "#red-ui-workspace-tabs > li.active",
+            description: {
+                "en-US": '<p>Tabs can now be hidden by clicking their <i class="fa fa-eye-slash"></i> icon.</p><p>The Info Sidebar will still list all of your tabs, and tell you which ones are currently hidden.',
+                "ja": '<p><i class="fa fa-eye-slash"></i> アイコンをクリックすることで、タブを非表示にできます。</p><p>情報サイドバーには、全てのタブが一覧表示されており、現在非表示になっているタブを確認できます。'
+            },
+            interactive: false,
+            prepare() {
+                $("#red-ui-workspace-tabs > li.active .red-ui-tab-close").css("display","block");
+            },
+            complete() {
+                $("#red-ui-workspace-tabs > li.active .red-ui-tab-close").css("display","");
+            }
+        },
+        {
+            title: {
+                "en-US": "Tab menu",
+                "ja": "タブメニュー"
+            },
+            element: "#red-ui-workspace-tabs-menu",
+            description: {
+                "en-US": "<p>The new tab menu also provides lots of new options for your tabs.</p>",
+                "ja": "<p>新しいタブメニューには、タブに関する沢山の新しいオプションが提供されています。</p>"
+            },
+            interactive: false,
+            direction: "left",
+            prepare() {
+                $("#red-ui-workspace > .red-ui-tabs > .red-ui-tabs-menu a").trigger("click");
+            },
+            complete() {
+                $(document).trigger("click");
+            }
+        },
+        {
+            title: {
+                "en-US": "Flow and Group level environment variables",
+                "ja": "フローとグループの環境変数"
+            },
+            element: "#red-ui-workspace-tabs > li.active",
+            interactive: false,
+            description: {
+                "en-US": "<p>Flows and Groups can now have their own environment variables that can be referenced by nodes inside them.</p>",
+                "ja": "<p>フローとグループには、内部のノードから参照できる環境変数を設定できるようになりました。</p>"
+            }
+        },
+        {
+            prepare(done) {
+                RED.editor.editFlow(RED.nodes.workspace(RED.workspaces.active()),"editor-tab-envProperties");
+                setTimeout(done,700);
+            },
+            element: "#red-ui-tab-editor-tab-envProperties-link-button",
+            description: {
+                "en-US": "<p>Their edit dialogs have a new Environment Variables section.</p>",
+                "ja": "<p>編集ダイアログに環境変数セクションが追加されました。</p>"
+            }
+        },
+        {
+            element: ".node-input-env-container-row",
+            direction: "left",
+            description: {
+                "en-US": '<p>The environment variables are listed in this table and new ones can be added by clicking the <i class="fa fa-plus"></i> button.</p>',
+                "ja": '<p>この表に環境変数が一覧表示されており、<i class="fa fa-plus"></i>ボタンをクリックすることで新しい変数を追加できます。</p>'
+            },
+            complete(done) {
+                $("#node-dialog-cancel").trigger("click");
+                setTimeout(done,500);
+            }
+        },
+        {
+            title: {
+                "en-US": "Link Call node added",
+                "ja": "Link Callノードを追加"
+            },
+            prepare(done) {
+                this.paletteWasClosed = $("#red-ui-main-container").hasClass("red-ui-palette-closed");
+                RED.actions.invoke("core:toggle-palette",true)
+                $('[data-palette-type="link call"]')[0].scrollIntoView({block:"center"})
+                setTimeout(done,100);
+            },
+            element: '[data-palette-type="link call"]',
+            direction: "right",
+            description: {
+                "en-US": "<p>The <code>Link Call</code> node lets you call another flow that begins with a <code>Link In</code> node and get the result back when the message reaches a <code>Link Out</code> node.</p>",
+                "ja": "<p><code>Link Call</code>ノードを用いることで、<code>Link In</code>ノードから始まるフローを呼び出し、<code>Link Out</code>ノードに到達した時に、結果を取得できます。</p>"
+            }
+        },
+        {
+            title: {
+              "en-US": "MQTT nodes support dynamic connections",
+              "ja": "MQTTノードが動的接続をサポート"
+            },
+            prepare(done) {
+                $('[data-palette-type="mqtt out"]')[0].scrollIntoView({block:"center"})
+                setTimeout(done,100);
+            },
+            element: '[data-palette-type="mqtt out"]',
+            direction: "right",
+            description: {
+              "en-US": '<p>The <code>MQTT</code> nodes now support creating their connections and subscriptions dynamically.</p>',
+              "ja": '<p><code>MQTT</code>ノードは、動的な接続や購読ができるようになりました。</p>'
+            },
+        },
+        {
+            title: {
+                "en-US": "File nodes renamed",
+                "ja": "ファイルノードの名前変更"
+            },
+            prepare(done) {
+                $('[data-palette-type="file"]')[0].scrollIntoView({block:"center"});
+                setTimeout(done,100);
+            },
+            complete() {
+                if (this.paletteWasClosed) {
+                    RED.actions.invoke("core:toggle-palette",false)
+                }
+            },
+            element: '[data-palette-type="file"]',
+            direction: "right",
+            description: {
+                "en-US": "<p>The file nodes have been renamed to make it clearer which node does what.</p>",
+                "ja": "<p>fileノードの名前が変更され、どのノードが何を行うかが明確になりました。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "Deep copy option on Change node",
+                "ja": "Changeノードのディープコピーオプション"
+            },
+            prepare(done) {
+                var def = RED.nodes.getType('change');
+                RED.editor.edit({id:"test",type:"change",rules:[{t:"set",p:"payload",pt:"msg", tot:"msg",to:"anotherProperty"}],_def:def, _:def._});
+                setTimeout(done,700);
+            },
+            complete(done) {
+                $("#node-dialog-cancel").trigger("click");
+                setTimeout(done,500);
+            },
+            element: function() {
+                return $(".node-input-rule-property-deepCopy").next();
+            },
+            description: {
+                "en-US": "<p>The Set rule has a new option to create a deep copy of the value. This ensures a complete copy is made, rather than using a reference.</p>",
+                "ja": "<p>値を代入に、値のディープコピーを作成するオプションが追加されました。これによって参照ではなく、完全なコピーが作成されます。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "And that's not all...",
+                "ja": "これが全てではありません..."
+            },
+            description: {
+                "en-US": "<p>There are many more smaller changes, including:</p><ul><li>Auto-complete suggestions in the <code>msg</code> TypedInput.</li><li>Support for <code>msg.resetTimeout</code> in the <code>Join</code> node.</li><li>Pushing messages to the front of the queue in the <code>Delay</code> node's rate limiting mode.</li><li>An optional second output on the <code>Delay</code> node for rate limited messages.</li></ul>",
+                "ja": "<p>以下の様な小さな変更が沢山あります:</p><ul><li><code>msg</code> TypedInputの自動補完提案</li><li><code>Join</code>ノードで<code>msg.resetTimeout</code>のサポート</li><li><code>Delay</code>ノードの流量制御モードにおいて先頭メッセージをキューに追加</li><li><code>Delay</code>ノードで流量制限されたメッセージ向けの任意の2つ目の出力</li></ul>"
+            }
+        }
+    ]
+}
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/delete-repair.gif b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/delete-repair.gif
new file mode 100644
index 000000000..c668dfdee
Binary files /dev/null and b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/delete-repair.gif differ
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/detach-repair.gif b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/detach-repair.gif
new file mode 100644
index 000000000..14fe1a423
Binary files /dev/null and b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/detach-repair.gif differ
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/slice.gif b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/slice.gif
new file mode 100644
index 000000000..ebd691ba8
Binary files /dev/null and b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/slice.gif differ
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/subflow-labels.png b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/subflow-labels.png
new file mode 100644
index 000000000..80023be78
Binary files /dev/null and b/packages/node_modules/@node-red/editor-client/src/tours/2.2/images/subflow-labels.png differ
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/2.2/welcome.js b/packages/node_modules/@node-red/editor-client/src/tours/2.2/welcome.js
new file mode 100644
index 000000000..f46ef3fbb
--- /dev/null
+++ b/packages/node_modules/@node-red/editor-client/src/tours/2.2/welcome.js
@@ -0,0 +1,156 @@
+export default {
+    version: "2.2.0",
+    steps: [
+        {
+            titleIcon: "fa fa-map-o",
+            title: {
+                "en-US": "Welcome to Node-RED 2.2!",
+                "ja": "Node-RED 2.2へようこそ!"
+            },
+            description: {
+                "en-US": "Let's take a moment to discover the new features in this release.",
+                "ja": "本リリースの新機能を見つけてみましょう。"
+            }
+        },
+        {
+            title: {
+                "en-US": "Search history",
+                "ja": "検索履歴"
+            },
+            description: {
+                "en-US": "<p>The Search dialog now keeps a history of your searches, making it easier to go back to a previous search.</p>",
+                "ja": "<p>検索ダイアログが検索履歴を保持するようになりました。これによって、過去の検索に戻りやすくなりました。</p>"
+            },
+            element: "#red-ui-search .red-ui-searchBox-form",
+            prepare(done) {
+                RED.search.show();
+                setTimeout(done,400);
+            },
+            complete() {
+                RED.search.hide();
+            },
+        },
+        {
+            title: {
+                "en-US": "Remembering Zoom & Position",
+                "ja": "拡大/縮小のレベルや位置を記憶"
+            },
+            description: {
+                "en-US": "<p>The editor has new options to restore the zoom level and scroll position when reloading the editor.</p>",
+                "ja": "<p>エディタを再読み込みした時に、拡大/縮小のレベルやスクロール位置を復元するための新しいオプションを利用できます。</p>"
+            },
+            element: function() { return $("#user-settings-view-store-position").parent()},
+            prepare(done) {
+                RED.actions.invoke("core:show-user-settings")
+                setTimeout(done,400);
+            },
+            complete(done) {
+                $("#node-dialog-ok").trigger("click");
+                setTimeout(done,400);
+            },
+        },
+        {
+            title: {
+                "en-US": "New wiring actions",
+                "ja": "新しいワイヤー操作"
+            },
+            // image: "images/",
+            description: {
+                "en-US": `<p>A pair of new actions have been added to help with wiring nodes together:</p>
+                          <ul>
+                          <li><b><code>Wire Series Of Nodes</code></b> - adds a wire (if necessary) between each pair of nodes in the order they were selected.</li>
+                          <li><b><code>Wire Node To Multiple</code></b> - wires the first node selected to all of the other selected nodes.</li>
+                          </ul>
+                          <p>Actions can be accessed from the Action List in the main menu.</p>`,
+                "ja": `<p>ノード接続を支援する2つの新しい操作が追加されました:</p>
+                       <ul>
+                       <li><b><code>Wire Series Of Nodes</code></b> - ノードを選択した順序で、各ノードのペアの間にワイヤーを(必要に応じて)追加します。</li>
+                       <li><b><code>Wire Node To Multiple</code></b> - 最初に選択したノードから、他の選択した全てのノードに対して、ワイヤーを追加します。</li>
+                       </ul>
+                       <p>メインメニュー内の動作一覧から、これらの操作を利用できます。</p>`
+            },
+        },
+        {
+            title: {
+                "en-US": "Deleting nodes and reconnecting wires",
+                "ja": "ノードの削除とワイヤーの再接続"
+            },
+            image: "2.2/images/delete-repair.gif",
+            description: {
+                "en-US": `<p>It is now possible to delete a selection of nodes and automatically repair the wiring behind them.</p>
+                          <p>This is really useful if you want to remove a node from the middle of the flow.</p>
+                          <p>Hold the Ctrl (or Cmd) key when you press Delete and the nodes will be gone and the wires repaired.</p>
+                          `,
+                "ja": `<p>選択したノードを削除した後、その背後にあるワイヤーを自動的に修復できるようになりました。</p>
+                       <p>これは、フローの中からノードを削除する時に、とても便利に使えます。</p>
+                       <p>Ctrl (またはCmd)キーを押しながらDeleteキーを押すと、ノードがなくなり、ワイヤーが修復されます。</p>
+                       `
+            }
+        },
+        {
+            title: {
+                "en-US": "Detaching nodes from a flow",
+                "ja": "フローからノードの切り離し"
+            },
+            image: "2.2/images/detach-repair.gif",
+            description: {
+                "en-US": `<p>If you want to remove a node from a flow without deleting it,
+                          you can use the <b><code>Detach Selected Nodes</code></b> action.</p>
+                          <p>The nodes will be removed from their flow, the wiring repaired behind them, and then attached to the mouse
+                          so you can drop them wherever you want in the workspace.</p>
+                          <p>There isn't a default keyboard shortcut assigned for this new action, but
+                          you can add your own via the Keyboard pane of the main Settings dialog.</p>`,
+                "ja": `<p>ノードを削除することなく、フローからノードを除きたい場合は、<b><code>Detach Selected Nodes</code></b>操作を利用できます。</p>
+                       <p>フローからノードが除かれた後、背後のワイヤーが修復され、ノードはマウスポインタにつながります。そのため、ワークスペースの好きな所にノードを配置できます。</p>
+                       <p>この新しい操作に対して、デフォルトのキーボードショートカットは登録されていませんが、メイン設定ダイアログのキーボード設定から追加できます。</p>`
+            }
+        },
+        {
+            title: {
+                "en-US": "More wiring tricks",
+                "ja": "その他のワイヤー操作"
+            },
+            image: "2.2/images/slice.gif",
+            description: {
+                "en-US": `<p>A couple more wiring tricks to share.</p>
+                          <p>You can now select multiple wires by holding the Ctrl (or Cmd) key
+                          when clicking on a wire. This makes it easier to delete multiple wires in one go.</p>
+                          <p>If you hold the Ctrl (or Cmd) key, then click and drag with the right-hand mouse button,
+                          you can slice through wires to remove them.</p>`,
+                "ja": `<p>その他のいくつかのワイヤー操作</p>
+                       <p>Ctrl (またはCmd)キーを押しながらワイヤーをクリックすることで、複数のワイヤーを選択できるようになりました。これによって、複数のワイヤーを一度に削除することが簡単になりました。</p>
+                       <p>Ctrl (またはCmd)キーを押しながら、マウスの右ボタンを用いてドラッグすると、ワイヤーを切って削除できます。</p>`
+            }
+        },
+        {
+            title: {
+                "en-US": "Subflow Output Labels",
+                "ja": "サブフローの出力ラベル"
+            },
+            image: "2.2/images/subflow-labels.png",
+            description: {
+                "en-US": "<p>If a subflow has labels set for its outputs, they now get shown on the ports within the subflow template view.</p>",
+                "ja": "<p>サブフローの出力にラベルが設定されている場合、サブフローテンプレート画面内のポートにラベルが表示されるようになりました。</p>"
+            },
+        },
+        {
+            title: {
+                "en-US": "Node Updates",
+                "ja": "ノードの更新"
+            },
+            // image: "images/",
+            description: {
+                "en-US": `<ul>
+                            <li>The JSON node will now handle parsing Buffer payloads</li>
+                            <li>The TCP Client nodes support TLS connections</li>
+                            <li>The WebSocket node allows you to specify a sub-protocol when connecting</li>
+                          </ul>`,
+                "ja": `<ul>
+                         <li>JSONノードが、バッファ形式のペイロードを解析できるようになりました。</li>
+                         <li>TCPクライアントノードが、TLS接続をサポートしました。</li>
+                         <li>WebSocketノードで、接続時にサブプロトコルを指定できるようになりました。</li>
+                       </ul>`
+            }
+        }
+    ]
+}
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/images/context-menu.png b/packages/node_modules/@node-red/editor-client/src/tours/images/context-menu.png
new file mode 100644
index 000000000..1acaab48b
Binary files /dev/null and b/packages/node_modules/@node-red/editor-client/src/tours/images/context-menu.png differ
diff --git a/packages/node_modules/@node-red/editor-client/src/tours/welcome.js b/packages/node_modules/@node-red/editor-client/src/tours/welcome.js
index e3f332da1..7d095ba8c 100644
--- a/packages/node_modules/@node-red/editor-client/src/tours/welcome.js
+++ b/packages/node_modules/@node-red/editor-client/src/tours/welcome.js
@@ -1,48 +1,66 @@
 export default {
-    version: "3.0.0-beta.1",
+    version: "3.0.0",
     steps: [
         {
             titleIcon: "fa fa-map-o",
             title: {
-                "en-US": "Welcome to Node-RED 3.0 Beta 1!",
-                "ja": "Node-RED 3.0 Beta 1へようこそ!"
+                "en-US": "Welcome to Node-RED 3.0!",
+                "ja": "Node-RED 3.0へようこそ!"
             },
             description: {
-                "en-US": "<p>This is the first Beta release of Node-RED 3.0. It contains just about everything we have planned for the final release.</p><p>Let's take a moment to discover the new features in this release.</p>",
-                "ja": "本リリースの新機能を見つけてみましょう。"
+                "en-US": "<p>Let's take a moment to discover the new features in this release.</p>",
+                "ja": "<p>本リリースの新機能を見つけてみましょう。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "Context Menu",
+                "ja": "コンテキストメニュー"
+            },
+            image: 'images/context-menu.png',
+            description: {
+                "en-US": `<p>The editor now has its own context menu when you
+                          right-click in the workspace.</p>
+                          <p>This makes many of the built-in actions much easier
+                          to access.</p>`,
+                "ja": `<p>ワークスペースで右クリックすると、エディタに独自のコンテキストメニューが表示されるようになりました。</p>
+                       <p>これによって多くの組み込み動作を、より簡単に利用できます。</p>`
             }
         },
         {
             title: {
                 "en-US": "Wire Junctions",
-                // "ja": ""
+                "ja": "分岐点をワイヤーに追加"
             },
             image: 'images/junction-slice.gif',
             description: {
-                "en-US": `<p>To make it easier to route wires around your flows, it is now possible to
-                             add junction nodes that give you more control.</p>
-                          <p>Junctions can be added to wires by holding the Shift key, then click and drag with
-                          the right-hand mouse button across the wires.</p>`,
-                // "ja": ""
+                "en-US": `<p>To make it easier to route wires around your flows,
+                             it is now possible to add junction nodes that give
+                             you more control.</p>
+                          <p>Junctions can be added to wires by holding both the Alt key and the Shift key
+                          then click and drag the mouse across the wires.</p>`,
+                "ja": `<p>フローのワイヤーの経路をより制御しやすくするために、分岐点ノードを追加できるようになりました。</p>
+                       <p>Altキーとシフトキーを押しながらマウスをクリックし、ワイヤーを横切るようにドラッグすることで、分岐点を追加できます。</p>`
             },
         },
         {
             title: {
                 "en-US": "Wire Junctions",
-                // "ja": ""
+                "ja": "分岐点をワイヤーに追加"
             },
             image: 'images/junction-quick-add.png',
             description: {
                 "en-US": `<p>Junctions can also be added using the quick-add dialog.</p>
                           <p>The dialog is opened by holding the Ctrl (or Cmd) key when
                              clicking in the workspace.</p>`,
-                // "ja": ""
+                "ja": `<p>クイック追加ダイアログを用いて、分岐点を追加することもできます。</p>
+                       <p>本ダイアログを開くには、Ctrl(またはCmd)キーを押しながら、ワークスペース上でクリックします。</p>`
             },
         },
         {
             title: {
                 "en-US": "Debug Path Tooltip",
-                // "ja": ""
+                "ja": "デバッグパスのツールチップ"
             },
             image: 'images/debug-path-tooltip.png',
             description: {
@@ -53,20 +71,22 @@ export default {
                              the message.</p>
                           <p>Clicking on any item in the list will reveal it in
                              the workspace.</p>`,
-                // "ja": ""
+                "ja": `<p>デバックサイドバー内のノード名の上にマウスカーソルを乗せると、新たにツールチップが表示され、ノードの場所が分かるようになっています。</p>
+                       <p>これは、サブフローを用いる時に役立つ機能であり、メッセージがどのノードから出力されたかを正確に特定することが遥かに簡単になります。</p>
+                       <p>本リスト内の要素をクリックすると、ワークスペース内にその要素が表示されます。</p>`
             },
         },
         {
             title: {
                 "en-US": "Continuous Search",
-                // "ja": ""
+                "ja": "連続した検索"
             },
             image: 'images/continuous-search.png',
             description: {
                 "en-US": `<p>When searching for things in the editor, a new toolbar in
                              the workspace provides options to quickly jump between
                              the search results.</p>`,
-                // "ja": ""
+                "ja": `<p>ワークスペース内の新しいツールバーにあるオプションによって、エディタ内を検索する際に、検索結果の間を素早く移動できます。</p>`
             },
         },
         {
@@ -81,13 +101,17 @@ export default {
                           <li><b><code>Split Wire With Link Nodes</code></b></li>
                           </ul>
                           <p>Actions can be accessed from the Action List in the main menu.</p>`,
-                // "ja": ``
+                "ja": `<p>ワイヤーを、接続されたLinkノードのペアに置き換える動作が新たに追加されました:</p>
+                       <ul>
+                       <li><b><code>ワイヤーをlinkノードで分割</code></b></li>
+                       </ul>
+                       <p>本アクションは、メインメニュー内の動作一覧から呼び出せます。</p>`,
             },
         },
         {
             title: {
                 "en-US": "Default node names",
-                // "ja": ""
+                "ja": "標準ノードの名前"
             },
             // image: "images/",
             description: {
@@ -100,7 +124,12 @@ export default {
                              <li><b><code>Generate Node Names</code></b></li>
                              </ul><p>Actions can be accessed from the Action List in the main menu.</p>
                             `,
-                // "ja": ``
+                "ja": `<p>一部のノードは、ワークスペース上に新インスタンスとして追加した際に、一意の名前を付けるよう変更されました。この変更は、<code>Debug</code>、<code>Function</code>、<code>Link</code>ノードに適用されています。</p>
+                       <p>選択したノードに対して、標準の名前を生成する動作も新たに追加されました:</p>
+                          <ul>
+                          <li><b><code>ノード名を生成</code></b></li>
+                          </ul><p>本アクションは、メインメニュー内の動作一覧から呼び出せます。</p>
+                         `
             }
         },
         {
@@ -115,7 +144,11 @@ export default {
                             <li>The Link Call node can use a message property to dynamically target the link it should call</li>
                             <li>The HTTP Request node can be preconfigured with HTTP headers</li>
                           </ul>`,
-                // "ja": ``
+                "ja": `<ul>
+                         <li>Debugノードは、受信したメッセージの数をカウントするよう設定できるようになりました。</li>
+                         <li>Link Callノードは、メッセージのプロパティによって、呼び出し対象のlinkを動的に指定できるようになりました。</li>
+                         <li>HTTP Requestノードは、HTTPヘッダを事前設定できるようになりました。</li>
+                       </ul>`
             }
         }
     ]
diff --git a/packages/node_modules/@node-red/nodes/99-sample.html.demo b/packages/node_modules/@node-red/nodes/99-sample.html.demo
index 467815f7c..38bbc988e 100644
--- a/packages/node_modules/@node-red/nodes/99-sample.html.demo
+++ b/packages/node_modules/@node-red/nodes/99-sample.html.demo
@@ -69,7 +69,7 @@
         outputs:1,              // set the number of outputs - 0 to n
         color: "#ddd",          // set icon color
         // set the icon (held in icons dir below where you save the node)
-        icon: "myicon.png",     // saved in  icons/myicon.png
+        icon: "myicon.svg",     // saved in  icons/myicon.svg
         label: function() {     // sets the default label contents
             return this.name||this.topic||"sample";
         },
diff --git a/packages/node_modules/@node-red/nodes/core/common/20-inject.html b/packages/node_modules/@node-red/nodes/core/common/20-inject.html
index de3990a93..0fafa9df0 100644
--- a/packages/node_modules/@node-red/nodes/core/common/20-inject.html
+++ b/packages/node_modules/@node-red/nodes/core/common/20-inject.html
@@ -118,7 +118,7 @@
     .inject-time-row {
         padding-left: 110px;
     }
-    .inject-time-row select {
+    .inject-time-row:not(#inject-time-row-interval) select {
         margin: 3px 0;
     }
     .inject-time-days label {
diff --git a/packages/node_modules/@node-red/nodes/core/common/20-inject.js b/packages/node_modules/@node-red/nodes/core/common/20-inject.js
index 92b8122df..734bce765 100644
--- a/packages/node_modules/@node-red/nodes/core/common/20-inject.js
+++ b/packages/node_modules/@node-red/nodes/core/common/20-inject.js
@@ -109,9 +109,10 @@ module.exports = function(RED) {
                 if (!property) return;
 
                 if (valueType === "jsonata") {
-                    if (p.exp) {
+                    if (p.v) {
                         try {
-                            var val = RED.util.evaluateJSONataExpression(p.exp, msg);
+                            var exp = RED.util.prepareJSONataExpression(p.v, node);
+                            var val = RED.util.evaluateJSONataExpression(exp, msg);
                             RED.util.setMessageProperty(msg, property, val, true);
                         }
                         catch  (err) {
diff --git a/packages/node_modules/@node-red/nodes/core/common/21-debug.html b/packages/node_modules/@node-red/nodes/core/common/21-debug.html
index 51e47e2f2..88d51b283 100644
--- a/packages/node_modules/@node-red/nodes/core/common/21-debug.html
+++ b/packages/node_modules/@node-red/nodes/core/common/21-debug.html
@@ -245,44 +245,37 @@
                     // complete parentage of the node that generated this message.
                     //    flow-id/subflow-A-instance/subflow-B-instance
 
-                    // If it has one id, that is a top level flow
+                    // If it has one id, that is a top level flow or config node/global
                     // each subsequent id is the instance id of a subflow node
                     //
                     pathParts = o.path.split("/");
                     if (pathParts.length === 1) {
-                        // The source node is on a flow - so can use its id to find
+                        // The source node is on a flow or is a global/config - so can use its id to find
                         sourceNode = RED.nodes.node(o.id);
                     } else if (pathParts.length > 1) {
                         // Highlight the subflow instance node.
                         sourceNode = RED.nodes.node(pathParts[1]);
                     }
+                    const getNodeLabel = (n) => n.name || (typeof n.label === "function" && n.label())  || (typeof n.label === "string" && n.label) || (n.type + ":" + n.id);
                     pathHierarchy = pathParts.map((id,index) => {
                         if (index === 0) {
-                            return {
-                                id: id,
-                                label: RED.nodes.workspace(id).label
-                            }
+                            if (id === "global") {
+                                return { id: sourceNode.id, label: getNodeLabel(sourceNode) }
+                            } 
+                            return { id: id, label: RED.nodes.workspace(id).label } //flow id + name
                         } else {
-                            var instanceNode = RED.nodes.node(id)
-                            return {
-                                id: id,
-                                label: (instanceNode.name || RED.nodes.subflow(instanceNode.type.substring(8)).name)
-                            }
+                            const instanceNode = RED.nodes.node(id)
+                            const pathLabel = (instanceNode.name || RED.nodes.subflow(instanceNode.type.substring(8)).name)
+                            return { id: id, label: pathLabel }
                         }
                     })
-                    if (pathParts.length === 1) {
-                        pathHierarchy.push({
-                            id: o.id,
-                            label: sourceNode.name || sourceNode.type+":"+sourceNode.id
-                        })
+                    if (pathParts.length === 1 && pathParts[0] !== "global") {
+                        pathHierarchy.push({ id: o.id, label: getNodeLabel(sourceNode) })
                     }
                     if (o._alias) {
                         let aliasNode = RED.nodes.node(o._alias)
                         if (aliasNode) {
-                            pathHierarchy.push({
-                                id: o._alias,
-                                label: aliasNode.name || aliasNode.type+":"+aliasNode.id
-                            })
+                            pathHierarchy.push({ id: o._alias, label: getNodeLabel(aliasNode) })
                         }
                     }
                 } else {
@@ -499,7 +492,7 @@
                 types:['msg', fullType, "jsonata"],
                 typeField: $("#node-input-targetType")
             });
-			if (this.targetType === "jsonata") {
+            if (this.targetType === "jsonata") {
                 var property = this.complete || "";
                 $("#node-input-typed-complete").typedInput('type','jsonata');
                 $("#node-input-typed-complete").typedInput('value',property);
@@ -558,7 +551,7 @@
         onadd: function() {
             if (this.name === '_DEFAULT_') {
                 this.name = ''
-                RED.actions.invoke("core:generate-node-names", this)
+                RED.actions.invoke("core:generate-node-names", this, {generateHistory: false})
             }
         }
     });
diff --git a/packages/node_modules/@node-red/nodes/core/common/60-link.html b/packages/node_modules/@node-red/nodes/core/common/60-link.html
index f592bcd3d..4b8c9a3d6 100644
--- a/packages/node_modules/@node-red/nodes/core/common/60-link.html
+++ b/packages/node_modules/@node-red/nodes/core/common/60-link.html
@@ -221,7 +221,7 @@
     function onAdd() {
         if (this.name === '_DEFAULT_') {
             this.name = ''
-            RED.actions.invoke("core:generate-node-names", this)
+            RED.actions.invoke("core:generate-node-names", this, {generateHistory: false})
         }
         for (var i=0;i<this.links.length;i++) {
             var n = RED.nodes.node(this.links[i]);
diff --git a/packages/node_modules/@node-red/nodes/core/common/60-link.js b/packages/node_modules/@node-red/nodes/core/common/60-link.js
index 24572f8b1..90b7966e0 100644
--- a/packages/node_modules/@node-red/nodes/core/common/60-link.js
+++ b/packages/node_modules/@node-red/nodes/core/common/60-link.js
@@ -29,23 +29,23 @@ module.exports = function(RED) {
     "use strict";
     const crypto = require("crypto");
     const targetCache = (function () {
-        const registry = { id: {}, name: {} };
-        function getIndex(/** @type {[LinkTarget]}*/ targets, id) {
+        let registry = { id: {}, name: {} }
+        function getIndex (/** @type {[LinkTarget]} */ targets, id) {
             for (let index = 0; index < (targets || []).length; index++) {
-                const element = targets[index];
+                const element = targets[index]
                 if (element.id === id) {
-                    return index;
+                    return index
                 }
             }
-            return -1;
+            return -1
         }
         /**
          * Generate a target object from a node
-         * @param {LinkInNode} node 
+         * @param {LinkInNode} node
          * @returns {LinkTarget} a link target object
          */
-        function generateTarget(node) {
-            const isSubFlow = node._flow.TYPE === "subflow";
+        function generateTarget (node) {
+            const isSubFlow = node._flow.TYPE === 'subflow'
             return {
                 id: node.id,
                 name: node.name || node.id,
@@ -58,75 +58,72 @@ module.exports = function(RED) {
             /**
              * Get a list of targets registerd to this name
              * @param {string} name Name of the target
-             * @param {boolean} [excludeSubflows] set `true` to exclude 
+             * @param {boolean} [excludeSubflows] set `true` to exclude
              * @returns {[LinkTarget]} Targets registerd to this name.
              */
-            getTargets(name, excludeSubflows) {
-                const targets = registry.name[name] || [];
+            getTargets (name, excludeSubflows) {
+                const targets = registry.name[name] || []
                 if (excludeSubflows) {
-                    return targets.filter(e => e.isSubFlow != true);
+                    return targets.filter(e => e.isSubFlow !== true)
                 }
-                return targets;
+                return targets
             },
             /**
              * Get a single target by registered name.
              * To restrict to a single flow, include the `flowId`
              * If there is no targets OR more than one target, null is returned
              * @param {string} name Name of the node
-             * @param {string} [flowId] 
+             * @param {string} [flowId]
              * @returns {LinkTarget} target
              */
-            getTarget(name, flowId) {
-                /** @type {[LinkTarget]}*/
-                let possibleTargets = this.getTargets(name);
-                /** @type {LinkTarget}*/ 
-                let target;
+            getTarget (name, flowId) {
+                /** @type {[LinkTarget]} */
+                let possibleTargets = this.getTargets(name)
+                /** @type {LinkTarget} */
+                let target
                 if (possibleTargets.length && flowId) {
-                    possibleTargets = possibleTargets.filter(e => e.flowId == flowId);
+                    possibleTargets = possibleTargets.filter(e => e.flowId === flowId)
                 }
                 if (possibleTargets.length === 1) {
-                    target = possibleTargets[0];
+                    target = possibleTargets[0]
                 }
-                return target;
+                return target
             },
             /**
              * Get a target by node ID
              * @param {string} nodeId ID of the node
              * @returns {LinkTarget} target
              */
-            getTargetById(nodeId) {
-                return registry.id[nodeId];
+            getTargetById (nodeId) {
+                return registry.id[nodeId]
             },
-            register(/** @type {LinkInNode} */ node) {
-                const target = generateTarget(node);
-                const tByName = this.getTarget(target.name, target.flowId);
+            register (/** @type {LinkInNode} */ node) {
+                const target = generateTarget(node)
+                const tByName = this.getTarget(target.name, target.flowId)
                 if (!tByName || tByName.id !== target.id) {
-                    registry.name[target.name] = registry.name[target.name] || [];
+                    registry.name[target.name] = registry.name[target.name] || []
                     registry.name[target.name].push(target)
                 }
-                registry.id[target.id] = target;
-                return target;
+                registry.id[target.id] = target
+                return target
             },
-            remove(node) {
-                const target = generateTarget(node);
-                const tn = this.getTarget(target.name, target.flowId);
-                if (tn) {
-                    const targs = this.getTargets(tn.name);
-                    const idx = getIndex(targs, tn.id);
-                    if (idx > -1) {
-                        targs.splice(idx, 1);
-                    }
-                    if (targs.length === 0) {
-                        delete registry.name[tn.name];
-                    }
+            remove (node) {
+                const target = generateTarget(node)
+                const targs = this.getTargets(target.name)
+                const idx = getIndex(targs, target.id)
+                if (idx > -1) {
+                    targs.splice(idx, 1)
                 }
-                delete registry.id[target.id];
+                if (targs.length === 0) {
+                    delete registry.name[target.name]
+                }
+                delete registry.id[target.id]
             },
-            clear() {
-                registry = { id: {}, name: {} };
+            clear () {
+                registry = { id: {}, name: {} }
             }
         }
-    })();
+    })()
 
     function LinkInNode(n) {
         RED.nodes.createNode(this,n);
diff --git a/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js b/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js
index 85a55c4a5..70dc33605 100644
--- a/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js
+++ b/packages/node_modules/@node-red/nodes/core/common/lib/debug/debug-utils.js
@@ -459,30 +459,38 @@ RED.debug = (function() {
     function showMessageMenu(button,dbgMessage,sourceId) {
         activeMenuMessage = dbgMessage;
         if (!menuOptionMenu) {
-            menuOptionMenu = RED.menu.init({id:"red-ui-debug-msg-option-menu",
-                options: [
-                    {id:"red-ui-debug-msg-menu-item-collapse",label:RED._("node-red:debug.messageMenu.collapseAll"),onselect:function(){
-                        activeMenuMessage.collapse();
-                    }},
+            var opts = [
+                {id:"red-ui-debug-msg-menu-item-collapse",label:RED._("node-red:debug.messageMenu.collapseAll"),onselect:function(){
+                    activeMenuMessage.collapse();
+                }},
+            ];
+            if (activeMenuMessage.clearPinned) {
+                opts.push(
                     {id:"red-ui-debug-msg-menu-item-clear-pins",label:RED._("node-red:debug.messageMenu.clearPinned"),onselect:function(){
                         activeMenuMessage.clearPinned();
                     }},
-                    null,
-                    {id:"red-ui-debug-msg-menu-item-filter", label:RED._("node-red:debug.messageMenu.filterNode"),onselect:function(){
-                        var candidateNodes = RED.nodes.filterNodes({type:'debug'});
-                        candidateNodes.forEach(function(n) {
-                            filteredNodes[n.id] = true;
-                        });
-                        delete filteredNodes[sourceId];
-                        $("#red-ui-sidebar-debug-filterSelected").trigger("click");
-                        RED.settings.set('debug.filteredNodes',Object.keys(filteredNodes))
-                        refreshMessageList();
-                    }},
-                    {id:"red-ui-debug-msg-menu-item-clear-filter",label:RED._("node-red:debug.messageMenu.clearFilter"),onselect:function(){
-                        $("#red-ui-sidebar-debug-filterAll").trigger("click");
-                        refreshMessageList();
-                    }}
-                ]
+                );
+            }
+            opts.push(
+                null,
+                {id:"red-ui-debug-msg-menu-item-filter", label:RED._("node-red:debug.messageMenu.filterNode"),onselect:function(){
+                    var candidateNodes = RED.nodes.filterNodes({type:'debug'});
+                    candidateNodes.forEach(function(n) {
+                        filteredNodes[n.id] = true;
+                    });
+                    delete filteredNodes[sourceId];
+                    $("#red-ui-sidebar-debug-filterSelected").trigger("click");
+                    RED.settings.set('debug.filteredNodes',Object.keys(filteredNodes))
+                    refreshMessageList();
+                }},
+                {id:"red-ui-debug-msg-menu-item-clear-filter",label:RED._("node-red:debug.messageMenu.clearFilter"),onselect:function(){
+                    $("#red-ui-sidebar-debug-filterAll").trigger("click");
+                    refreshMessageList();
+                }}
+            );
+
+            menuOptionMenu = RED.menu.init({id:"red-ui-debug-msg-option-menu",
+                options: opts
             });
             menuOptionMenu.css({
                 position: "absolute"
@@ -582,7 +590,7 @@ RED.debug = (function() {
         $('<span class="red-ui-debug-msg-date">'+ getTimestamp()+'</span>').appendTo(metaRow);
         if (sourceNode) {
 
-            var nodeLink = $('<a>',{href:"#",class:"red-ui-debug-msg-name"}).text("node: "+(o.name||sourceNode.name||sourceNode.id))
+            var nodeLink = $('<a>',{href:"#",class:"red-ui-debug-msg-name"}).text(RED._("node-red:debug.node")+": "+(o.name||sourceNode.name||sourceNode.id))
             .appendTo(metaRow)
             .on("click", function(evt) {
                 evt.preventDefault();
diff --git a/packages/node_modules/@node-red/nodes/core/function/10-function.html b/packages/node_modules/@node-red/nodes/core/function/10-function.html
index 6309ae9ad..48e46da13 100644
--- a/packages/node_modules/@node-red/nodes/core/function/10-function.html
+++ b/packages/node_modules/@node-red/nodes/core/function/10-function.html
@@ -460,7 +460,7 @@
                 }
             });
 
-            var buildEditor = function(id, stateId, focus, value, defaultValue, extraLibs) {
+            var buildEditor = function(id, stateId, focus, value, defaultValue, extraLibs, offset) {
                 var editor = RED.editor.createEditor({
                     id: id,
                     mode: 'ace/mode/nrjavascript',
@@ -484,14 +484,14 @@
                     extraLibs: extraLibs
                 });
                 if (defaultValue && value === "") {
-                    editor.moveCursorTo(defaultValue.split("\n").length - 1, 0);
+                    editor.moveCursorTo(defaultValue.split("\n").length +offset, 0);
                 }
                 editor.__stateId = stateId;
                 return editor;
             }
-            this.initEditor = buildEditor('node-input-init-editor', this.id + "/" + "initEditor", false, $("#node-input-initialize").val(), RED._("node-red:function.text.initialize"))
-            this.editor = buildEditor('node-input-func-editor', this.id + "/" + "editor", true, $("#node-input-func").val(), undefined, that.libs || [])
-            this.finalizeEditor = buildEditor('node-input-finalize-editor', this.id + "/" + "finalizeEditor", false, $("#node-input-finalize").val(), RED._("node-red:function.text.finalize"))
+            this.initEditor = buildEditor('node-input-init-editor', this.id + "/" + "initEditor", false, $("#node-input-initialize").val(), RED._("node-red:function.text.initialize"), undefined, 0);
+            this.editor = buildEditor('node-input-func-editor', this.id + "/" + "editor", true, $("#node-input-func").val(), undefined, that.libs || [], undefined, -1);
+            this.finalizeEditor = buildEditor('node-input-finalize-editor', this.id + "/" + "finalizeEditor", false, $("#node-input-finalize").val(), RED._("node-red:function.text.finalize"), undefined, 0);
 
             RED.library.create({
                 url:"functions", // where to get the data from
@@ -639,7 +639,7 @@
         onadd: function() {
             if (this.name === '_DEFAULT_') {
                 this.name = ''
-                RED.actions.invoke("core:generate-node-names", this)
+                RED.actions.invoke("core:generate-node-names", this, {generateHistory: false})
             }
         }
     });
diff --git a/packages/node_modules/@node-red/nodes/core/function/10-switch.html b/packages/node_modules/@node-red/nodes/core/function/10-switch.html
index 3ac3c67ed..ebe22d65c 100644
--- a/packages/node_modules/@node-red/nodes/core/function/10-switch.html
+++ b/packages/node_modules/@node-red/nodes/core/function/10-switch.html
@@ -146,13 +146,13 @@
 
     function createTypeValueField(row, defaultType){
         return $('<input/>',{class:"node-input-rule-type-value",type:"text",style:"width: 100%;"}).appendTo(row).typedInput({default:defaultType || 'string',types:[
-            {value:"string",label:RED._("common.type.string"),hasValue:false,icon:"red/images/typedInput/az.png"},
-            {value:"number",label:RED._("common.type.number"),hasValue:false,icon:"red/images/typedInput/09.png"},
-            {value:"boolean",label:RED._("common.type.boolean"),hasValue:false,icon:"red/images/typedInput/bool.png"},
-            {value:"array",label:RED._("common.type.array"),hasValue:false,icon:"red/images/typedInput/json.png"},
-            {value:"buffer",label:RED._("common.type.buffer"),hasValue:false,icon:"red/images/typedInput/bin.png"},
-            {value:"object",label:RED._("common.type.object"),hasValue:false,icon:"red/images/typedInput/json.png"},
-            {value:"json",label:RED._("common.type.jsonString"),hasValue:false,icon:"red/images/typedInput/json.png"},
+            {value:"string",label:RED._("common.type.string"),hasValue:false,icon:"red/images/typedInput/az.svg"},
+            {value:"number",label:RED._("common.type.number"),hasValue:false,icon:"red/images/typedInput/09.svg"},
+            {value:"boolean",label:RED._("common.type.boolean"),hasValue:false,icon:"red/images/typedInput/bool.svg"},
+            {value:"array",label:RED._("common.type.array"),hasValue:false,icon:"red/images/typedInput/json.svg"},
+            {value:"buffer",label:RED._("common.type.buffer"),hasValue:false,icon:"red/images/typedInput/bin.svg"},
+            {value:"object",label:RED._("common.type.object"),hasValue:false,icon:"red/images/typedInput/json.svg"},
+            {value:"json",label:RED._("common.type.jsonString"),hasValue:false,icon:"red/images/typedInput/json.svg"},
             {value:"undefined",label:RED._("common.type.undefined"),hasValue:false},
             {value:"null",label:RED._("common.type.null"),hasValue:false}
         ]});
@@ -247,14 +247,16 @@
                     var row2 = $('<div/>',{style:"display: flex; padding-top: 5px; padding-left: 175px;"}).appendTo(inputRows);
                     var row3 = $('<div/>',{style:"display: flex; padding-top: 5px; align-items: center"}).appendTo(inputRows);
 
+                    var row4 = $('<div/>',{style:"visibility: hidden; height: 0px;"}).appendTo(inputRows);
+                    var textSpan = $("<span/>").appendTo(row4);
                     var selectField = $('<select/>',{style:"width:120px; text-align: center;"}).appendTo(row);
-                    var group0 = $('<optgroup/>', { label: "value rules" }).appendTo(selectField);
+                    var group0 = $('<optgroup/>', { label: RED._("node-red:switch.label.value-rules") }).appendTo(selectField);
                     for (var d in operators) {
                         if(operators[d].kind === 'V') {
                             group0.append($("<option></option>").val(operators[d].v).text(/^switch/.test(operators[d].t)?node._(operators[d].t):operators[d].t));
                         }
                     }
-                    var group1 = $('<optgroup/>', { label: "sequence rules" }).appendTo(selectField);
+                    var group1 = $('<optgroup/>', { label: RED._("node-red:switch.label.sequence-rules") }).appendTo(selectField);
                     for (var d in operators) {
                         if(operators[d].kind === 'S') {
                             group1.append($("<option></option>").val(operators[d].v).text(/^switch/.test(operators[d].t)?node._(operators[d].t):operators[d].t));
@@ -340,9 +342,12 @@
                             row3.hide();
                         }
                         var selectedLabel = selectField.find("option:selected").text();
-                        if (selectedLabel.length <= 5) {
+
+                        textSpan.text(selectedLabel);
+                        var width = textSpan.width();
+                        if (width <= 30) {
                             selectField.outerWidth(60);
-                        } else if (selectedLabel.length < 12) {
+                        } else if (width <= 85) {
                             selectField.outerWidth(120);
                         } else {
                             selectField.width("auto")
diff --git a/packages/node_modules/@node-red/nodes/core/function/15-change.js b/packages/node_modules/@node-red/nodes/core/function/15-change.js
index d177caec8..94f47fcbf 100644
--- a/packages/node_modules/@node-red/nodes/core/function/15-change.js
+++ b/packages/node_modules/@node-red/nodes/core/function/15-change.js
@@ -168,9 +168,9 @@ module.exports = function(RED) {
                         return getFromValueType(RED.util.getMessageProperty(msg,rule.from),done);
                     } else if (rule.fromt === 'flow' || rule.fromt === 'global') {
                         var contextKey = RED.util.parseContextStore(rule.from);
-                        if (/\[msg\./.test(context.key)) {
+                        if (/\[msg\./.test(contextKey.key)) {
                             // The key has a nest msg. reference to evaluate first
-                            context.key = RED.util.normalisePropertyExpression(contextKey.key,msg,true);
+                            contextKey.key = RED.util.normalisePropertyExpression(contextKey.key,msg,true);
                         }
                         node.context()[rule.fromt].get(contextKey.key, contextKey.store, (err,fromValue) => {
                             if (err) {
diff --git a/packages/node_modules/@node-red/nodes/core/function/80-template.js b/packages/node_modules/@node-red/nodes/core/function/80-template.js
index d4c27cfd0..69954aba2 100644
--- a/packages/node_modules/@node-red/nodes/core/function/80-template.js
+++ b/packages/node_modules/@node-red/nodes/core/function/80-template.js
@@ -44,6 +44,14 @@ module.exports = function(RED) {
         return undefined;
     }
 
+    function parseEnv(key) {
+        var match = /^env\.(.+)/.exec(key);
+        if (match) {
+            return match[1];
+        }
+        return undefined;
+    }
+
     /**
      * Custom Mustache Context capable to collect message property and node
      * flow and global context
@@ -74,6 +82,11 @@ module.exports = function(RED) {
                 return value;
             }
 
+            // try env
+            if (parseEnv(name)) {
+                return this.cachedContextTokens[name];
+            }
+
             // try flow/global context:
             var context = parseContext(name);
             if (context) {
@@ -156,6 +169,17 @@ module.exports = function(RED) {
                     var tokens = extractTokens(mustache.parse(template));
                     var resolvedTokens = {};
                     tokens.forEach(function(name) {
+                        var env_name = parseEnv(name);
+                        if (env_name) {
+                            var promise = new Promise((resolve, reject) => {
+                                var val = RED.util.evaluateNodeProperty(env_name, 'env', node)
+                                resolvedTokens[name] = val;
+                                resolve();
+                            });
+                            promises.push(promise);
+                            return;
+                        }
+
                         var context = parseContext(name);
                         if (context) {
                             var type = context.type;
diff --git a/packages/node_modules/@node-red/nodes/core/function/89-delay.js b/packages/node_modules/@node-red/nodes/core/function/89-delay.js
index 5205a5b18..6524aa040 100644
--- a/packages/node_modules/@node-red/nodes/core/function/89-delay.js
+++ b/packages/node_modules/@node-red/nodes/core/function/89-delay.js
@@ -275,18 +275,22 @@ module.exports = function(RED) {
                     if (msg.hasOwnProperty("flush")) {
                         var len = node.buffer.length;
                         if (typeof(msg.flush) == 'number') { len = Math.min(Math.floor(msg.flush),len); }
-                        while (len > 0) {
-                            const msgInfo = node.buffer.shift();
-                            if (Object.keys(msgInfo.msg).length > 1) {
-                                node.send(msgInfo.msg);
-                                msgInfo.done();
-                            }
-                            len = len - 1;
-                        }
-                        if (node.buffer.length === 0) {
+                        if (len === 0) {
                             clearInterval(node.intervalID);
                             node.intervalID = -1;
                         }
+                        else {
+                            while (len > 0) {
+                                const msgInfo = node.buffer.shift();
+                                if (Object.keys(msgInfo.msg).length > 1) {
+                                    node.send(msgInfo.msg);
+                                    msgInfo.done();
+                                }
+                                len = len - 1;
+                            }
+                            clearInterval(node.intervalID);
+                            node.intervalID = setInterval(sendMsgFromBuffer, node.rate);
+                        }
                         node.status({fill:"blue",shape:"dot",text:node.buffer.length});
                         done();
                     }
diff --git a/packages/node_modules/@node-red/nodes/core/network/10-mqtt.js b/packages/node_modules/@node-red/nodes/core/network/10-mqtt.js
index f8689ef9a..9e6195b5d 100644
--- a/packages/node_modules/@node-red/nodes/core/network/10-mqtt.js
+++ b/packages/node_modules/@node-red/nodes/core/network/10-mqtt.js
@@ -453,6 +453,7 @@ module.exports = function(RED) {
         node.options = {};
         node.queue = [];
         node.subscriptions = {};
+        node.clientListeners = []
         /** @type {mqtt.MqttClient}*/ this.client;
         node.setOptions = function(opts, init) {
             if(!opts || typeof opts !== "object") {
@@ -591,7 +592,7 @@ module.exports = function(RED) {
                     // Only for ws or wss, check if proxy env var for additional configuration
                     if (node.brokerurl.indexOf("wss://") > -1 || node.brokerurl.indexOf("ws://") > -1) {
                         // check if proxy is set in env
-                        let prox, noprox;
+                        let prox, noprox, noproxy;
                         if (process.env.http_proxy) { prox = process.env.http_proxy; }
                         if (process.env.HTTP_PROXY) { prox = process.env.HTTP_PROXY; }
                         if (process.env.no_proxy) { noprox = process.env.no_proxy.split(","); }
@@ -718,11 +719,16 @@ module.exports = function(RED) {
                 setStatusConnecting(node, true);
                 try {
                     node.serverProperties = {};
+                    if(node.client) {
+                        //belt and braces to avoid left over clients
+                        node.client.end(true);
+                        node._clientRemoveListeners();
+                    }
                     node.client = mqtt.connect(node.brokerurl, node.options);
                     node.client.setMaxListeners(0);
-                    let callbackDone = false; //prevent re-connects causing node.client.on('connect' firing callback multiple times
+                    let callbackDone = false; //prevent re-connects causing node._clientOn('connect' firing callback multiple times
                     // Register successful connect or reconnect handler
-                    node.client.on('connect', function (connack) {
+                    node._clientOn('connect', function (connack) {
                         node.closing = false;
                         node.connecting = false;
                         node.connected = true;
@@ -754,7 +760,7 @@ module.exports = function(RED) {
                         }
                         setStatusConnected(node, true);
                         // Remove any existing listeners before resubscribing to avoid duplicates in the event of a re-connection
-                        node.client.removeAllListeners('message');
+                        node._clientRemoveListeners('message');
 
                         // Re-subscribe to stored topics
                         for (var s in node.subscriptions) {
@@ -766,7 +772,7 @@ module.exports = function(RED) {
                                     if (node.subscriptions[s].hasOwnProperty(r)) {
                                         qos = Math.max(qos,node.subscriptions[s][r].qos);
                                         _options = node.subscriptions[s][r].options;
-                                        node.client.on('message',node.subscriptions[s][r].handler);
+                                        node._clientOn('message',node.subscriptions[s][r].handler);
                                     }
                                 }
                                 _options.qos = _options.qos || qos;
@@ -779,11 +785,11 @@ module.exports = function(RED) {
                             node.publish(node.birthMessage);
                         }
                     });
-                    node.client.on("reconnect", function() {
+                    node._clientOn("reconnect", function() {
                         setStatusConnecting(node, true);
                     });
                     //Broker Disconnect - V5 event
-                    node.client.on("disconnect", function(packet) {
+                    node._clientOn("disconnect", function(packet) {
                         //Emitted after receiving disconnect packet from broker. MQTT 5.0 feature.
                         const rc = (packet && packet.properties && packet.reasonCode) || packet.reasonCode;
                         const rs = packet && packet.properties && packet.properties.reasonString || "";
@@ -797,7 +803,7 @@ module.exports = function(RED) {
                         setStatusDisconnected(node, true);
                     });
                     // Register disconnect handlers
-                    node.client.on('close', function () {
+                    node._clientOn('close', function () {
                         if (node.connected) {
                             node.connected = false;
                             node.log(RED._("mqtt.state.disconnected",{broker:(node.clientid?node.clientid+"@":"")+node.brokerurl}));
@@ -809,7 +815,7 @@ module.exports = function(RED) {
 
                     // Register connect error handler
                     // The client's own reconnect logic will take care of errors
-                    node.client.on('error', function (error) {
+                    node._clientOn('error', function (error) {
                     });
                 }catch(err) {
                     console.log(err);
@@ -822,7 +828,7 @@ module.exports = function(RED) {
                 if(node.connected || node.connecting) {
                     setStatusDisconnected(node, true);
                 }
-                if(node.client) { node.client.removeAllListeners(); }
+                if(node.client) { node._clientRemoveListeners(); }
                 node.connecting = false;
                 node.connected = false;
                 callback && typeof callback == "function" && callback();
@@ -836,8 +842,12 @@ module.exports = function(RED) {
                     if(!client) { 
                         resolve();
                      } else {
-                         const t = setTimeout(reject, ms);
-                         client.end(() => {
+                        const t = setTimeout(() => {
+                            //clean end() has exceeded WAIT_END, lets force end!
+                            client && client.end(true);
+                            reject();
+                        }, ms);
+                        client.end(() => {
                              clearTimeout(t);
                              resolve()
                          });
@@ -894,7 +904,7 @@ module.exports = function(RED) {
             };
             node.subscriptions[topic][ref] = sub;
             if (node.connected) {
-                node.client.on('message',sub.handler);
+                node._clientOn('message',sub.handler);
                 node.client.subscribe(topic, options);
             }
         };
@@ -905,7 +915,7 @@ module.exports = function(RED) {
             if (sub) {
                 if (sub[ref]) {
                     if(node.client) {
-                        node.client.removeListener('message',sub[ref].handler);
+                        node._clientRemoveListeners('message',sub[ref].handler);
                     }
                     delete sub[ref];
                 }
@@ -995,13 +1005,40 @@ module.exports = function(RED) {
 
         node.on('close', function(done) {
             node.disconnect(function() {
-                if(node.client) {
-                    node.client.removeAllListeners();
-                }
                 done();
             });
         });
 
+        /**
+         * Add event handlers to the MQTT.js client and track them so that
+         * we do not remove any handlers that the MQTT client uses internally.  
+         * Use {@link node._clientRemoveListeners `node._clientRemoveListeners`} to remove handlers
+         * @param {string} event The name of the event
+         * @param {function} handler The handler for this event
+         */
+         node._clientOn = function(event, handler) {
+            node.clientListeners.push({event, handler})
+            node.client.on(event, handler)
+        } 
+
+        /**
+         * Remove event handlers from the MQTT.js client & only the events 
+         * that we attached in {@link node._clientOn `node._clientOn`}.  
+         * * If `event` is omitted, then all events matching `handler` are removed
+         * * If `handler` is omitted, then all events named `event` are removed
+         * * If both parameters are omitted, then all events are removed
+         * @param {string} [event] The name of the event (optional)
+         * @param {function} [handler] The handler for this event (optional)
+         */
+         node._clientRemoveListeners = function(event, handler) {
+            node.clientListeners = node.clientListeners.filter((l) => {
+                if (event && event !== l.event) { return true; }
+                if (handler && handler !== l.handler) { return true; }
+                node.client.removeListener(l.event, l.handler)
+                return false; //found and removed, filter out this one
+            })
+        }
+
     }
 
     RED.nodes.registerType("mqtt-broker",MQTTBrokerNode,{
diff --git a/packages/node_modules/@node-red/nodes/core/network/21-httpin.html b/packages/node_modules/@node-red/nodes/core/network/21-httpin.html
index 917361845..ce2f81e12 100644
--- a/packages/node_modules/@node-red/nodes/core/network/21-httpin.html
+++ b/packages/node_modules/@node-red/nodes/core/network/21-httpin.html
@@ -129,7 +129,7 @@
     var headerTypes = [
         {value:"content-type",label:"Content-Type",hasValue: false},
         {value:"location",label:"Location",hasValue: false},
-        {value:"other",label:RED._("node-red:httpin.label.other"),icon:"red/images/typedInput/az.png"}
+        {value:"other",label:RED._("node-red:httpin.label.other"),icon:"red/images/typedInput/az.svg"}
        ]
     var contentTypes = [
         {value:"application/json",label:"application/json",hasValue: false},
@@ -139,7 +139,7 @@
         {value:"text/plain",label:"text/plain",hasValue: false},
         {value:"image/gif",label:"image/gif",hasValue: false},
         {value:"image/png",label:"image/png",hasValue: false},
-        {value:"other",label:RED._("node-red:httpin.label.other"),icon:"red/images/typedInput/az.png"}
+        {value:"other",label:RED._("node-red:httpin.label.other"),icon:"red/images/typedInput/az.svg"}
     ];
 
     RED.nodes.registerType('http response',{
@@ -180,7 +180,7 @@
                     var propertyValue = $('<input/>',{class:"node-input-header-value",type:"text",style:"width: 100%"})
                         .appendTo(propertyValueCell)
                         .typedInput({types:
-                            header.h === 'content-type'?contentTypes:[{value:"other",label:"other",icon:"red/images/typedInput/az.png"}]
+                            header.h === 'content-type'?contentTypes:[{value:"other",label:"other",icon:"red/images/typedInput/az.svg"}]
                         });
 
                     var matchedType = headerTypes.filter(function(ht) {
@@ -223,7 +223,7 @@
                         if (type === 'content-type') {
                             propertyValue.typedInput('types',contentTypes);
                         } else {
-                            propertyValue.typedInput('types',[{value:"other",label:"other",icon:"red/images/typedInput/az.png"}]);
+                            propertyValue.typedInput('types',[{value:"other",label:"other",icon:"red/images/typedInput/az.svg"}]);
                         }
                     });
                 },
diff --git a/packages/node_modules/@node-red/nodes/core/network/21-httprequest.html b/packages/node_modules/@node-red/nodes/core/network/21-httprequest.html
index 3e18f4fe7..8b1320496 100644
--- a/packages/node_modules/@node-red/nodes/core/network/21-httprequest.html
+++ b/packages/node_modules/@node-red/nodes/core/network/21-httprequest.html
@@ -127,12 +127,14 @@
         { value: "Cache-Control", label: "Cache-Control", hasValue: false },
         { value: "User-Agent", label: "User-Agent", hasValue: false },
         { value: "Location", label: "Location", hasValue: false },
-        { value: "other", label: "other", hasValue: true, icon: "red/images/typedInput/az.png" },
+        { value: "other", label: RED._("node-red:httpin.label.other"),
+          hasValue: true, icon: "red/images/typedInput/az.svg" },
         { value: "msg", label: "msg.", hasValue: true },
     ]
     const headerOptions = {};
     const defaultOptions = [
-        { value: "other", label: "other", hasValue: true, icon: "red/images/typedInput/az.png" },
+        { value: "other", label: RED._("node-red:httpin.label.other"),
+          hasValue: true, icon: "red/images/typedInput/az.svg" },
         { value: "msg", label: "msg.", hasValue: true },
     ];
     headerOptions["accept"] = [
diff --git a/packages/node_modules/@node-red/nodes/core/network/22-websocket.js b/packages/node_modules/@node-red/nodes/core/network/22-websocket.js
index 5a46f04ff..d2a862a46 100644
--- a/packages/node_modules/@node-red/nodes/core/network/22-websocket.js
+++ b/packages/node_modules/@node-red/nodes/core/network/22-websocket.js
@@ -215,6 +215,7 @@ module.exports = function(RED) {
                 delete listenerNodes[node.fullPath];
                 node.server.close();
                 node._inputNodes = [];
+                done();
             }
             else {
                 node.closing = true;
diff --git a/packages/node_modules/@node-red/nodes/core/network/31-tcpin.js b/packages/node_modules/@node-red/nodes/core/network/31-tcpin.js
index 531b3ac2d..d2de33522 100644
--- a/packages/node_modules/@node-red/nodes/core/network/31-tcpin.js
+++ b/packages/node_modules/@node-red/nodes/core/network/31-tcpin.js
@@ -435,7 +435,7 @@ module.exports = function(RED) {
             });
         }
         else {
-            var connectedSockets = [];
+            const connectedSockets = new Set();
             node.status({text:RED._("tcpin.status.connections",{count:0})});
             let srv = net;
             let connOpts;
@@ -456,16 +456,16 @@ module.exports = function(RED) {
                 });
                 socket.on('close',function() {
                     node.log(RED._("tcpin.status.connection-closed",{host:socket.remoteAddress, port:socket.remotePort}));
-                    connectedSockets.splice(connectedSockets.indexOf(socket),1);
-                    node.status({text:RED._("tcpin.status.connections",{count:connectedSockets.length})});
+                    connectedSockets.delete(socket);
+                    node.status({text:RED._("tcpin.status.connections",{count:connectedSockets.size})});
                 });
                 socket.on('error',function() {
                     node.log(RED._("tcpin.errors.socket-error",{host:socket.remoteAddress, port:socket.remotePort}));
-                    connectedSockets.splice(connectedSockets.indexOf(socket),1);
-                    node.status({text:RED._("tcpin.status.connections",{count:connectedSockets.length})});
+                    connectedSockets.delete(socket);
+                    node.status({text:RED._("tcpin.status.connections",{count:connectedSockets.size})});
                 });
-                connectedSockets.push(socket);
-                node.status({text:RED._("tcpin.status.connections",{count:connectedSockets.length})});
+                connectedSockets.add(socket);
+                node.status({text:RED._("tcpin.status.connections",{count:connectedSockets.size})});
             });
 
             node.on("input", function(msg, nodeSend, nodeDone) {
@@ -478,10 +478,10 @@ module.exports = function(RED) {
                     } else {
                         buffer = Buffer.from(""+msg.payload);
                     }
-                    for (var i = 0; i < connectedSockets.length; i += 1) {
-                        if (node.doend === true) { connectedSockets[i].end(buffer); }
-                        else { connectedSockets[i].write(buffer); }
-                    }
+                    connectedSockets.forEach(soc => {
+                        if (node.doend === true) { soc.end(buffer); }
+                        else { soc.write(buffer); }
+                    })
                 }
                 nodeDone();
             });
@@ -498,12 +498,10 @@ module.exports = function(RED) {
                 } else {
                     node.log(RED._("tcpin.status.listening-port",{port:node.port}));
                     node.on('close', function() {
-                        for (var c in connectedSockets) {
-                            if (connectedSockets.hasOwnProperty(c)) {
-                                connectedSockets[c].end();
-                                connectedSockets[c].unref();
-                            }
-                        }
+                        connectedSockets.forEach(soc => {
+                            soc.end();
+                            soc.unref();
+                        })
                         server.close();
                         node.log(RED._("tcpin.status.stopped-listening",{port:node.port}));
                     });
diff --git a/packages/node_modules/@node-red/nodes/core/parsers/70-CSV.js b/packages/node_modules/@node-red/nodes/core/parsers/70-CSV.js
index 184f40bdd..9c55fa2b6 100644
--- a/packages/node_modules/@node-red/nodes/core/parsers/70-CSV.js
+++ b/packages/node_modules/@node-red/nodes/core/parsers/70-CSV.js
@@ -89,6 +89,9 @@ module.exports = function(RED) {
                                     else if (msg.payload[s][t].toString().indexOf(node.sep) !== -1) { // add quotes if any "commas"
                                         msg.payload[s][t] = node.quo + msg.payload[s][t].toString() + node.quo;
                                     }
+                                    else if (msg.payload[s][t].toString().indexOf("\n") !== -1) { // add quotes if any "\n"
+                                        msg.payload[s][t] = node.quo + msg.payload[s][t].toString() + node.quo;
+                                    }
                                 }
                                 ou += msg.payload[s].join(node.sep) + node.ret;
                             }
@@ -112,7 +115,7 @@ module.exports = function(RED) {
                                                     q = q.replace(/"/g, '""');
                                                     ou += node.quo + q + node.quo + node.sep;
                                                 }
-                                                else if (q.indexOf(node.sep) !== -1) { // add quotes if any "commas"
+                                                else if (q.indexOf(node.sep) !== -1 || p.indexOf("\n") !== -1) { // add quotes if any "commas" or "\n"
                                                     ou += node.quo + q + node.quo + node.sep;
                                                 }
                                                 else { ou += q + node.sep; } // otherwise just add
@@ -134,7 +137,7 @@ module.exports = function(RED) {
                                                 p = p.replace(/"/g, '""');
                                                 ou += node.quo + p + node.quo + node.sep;
                                             }
-                                            else if (p.indexOf(node.sep) !== -1) { // add quotes if any "commas"
+                                            else if (p.indexOf(node.sep) !== -1 || p.indexOf("\n") !== -1) { // add quotes if any "commas" or "\n"
                                                 ou += node.quo + p + node.quo + node.sep;
                                             }
                                             else { ou += p + node.sep; } // otherwise just add
diff --git a/packages/node_modules/@node-red/nodes/core/sequence/17-split.html b/packages/node_modules/@node-red/nodes/core/sequence/17-split.html
index 270bd0e80..9862d4492 100644
--- a/packages/node_modules/@node-red/nodes/core/sequence/17-split.html
+++ b/packages/node_modules/@node-red/nodes/core/sequence/17-split.html
@@ -247,7 +247,7 @@
                     var jsonata_or_empty = {
                         value: "jsonata",
                         label: "expression",
-                        icon: "red/images/typedInput/expr.png",
+                        icon: "red/images/typedInput/expr.svg",
                         validate: function(v) {
                             try{
                                 if(v !== "") {
diff --git a/packages/node_modules/@node-red/nodes/core/sequence/17-split.js b/packages/node_modules/@node-red/nodes/core/sequence/17-split.js
index e158f344c..325cf85b5 100644
--- a/packages/node_modules/@node-red/nodes/core/sequence/17-split.js
+++ b/packages/node_modules/@node-red/nodes/core/sequence/17-split.js
@@ -314,11 +314,13 @@ module.exports = function(RED) {
                         if (err) {
                             return done(err);
                         }
-                        msgInfo.send({payload: result});
+                        msgInfo.msg.payload = result;
+                        msgInfo.send(msgInfo.msg);
                         done();
                     });
                 } else {
-                    msgInfo.send({payload: result});
+                    msgInfo.msg.payload = result;
+                    msgInfo.send(msgInfo.msg);
                     done();
                 }
             } else {
diff --git a/packages/node_modules/@node-red/nodes/core/storage/10-file.html b/packages/node_modules/@node-red/nodes/core/storage/10-file.html
index ddddcb687..6b19ebaa8 100755
--- a/packages/node_modules/@node-red/nodes/core/storage/10-file.html
+++ b/packages/node_modules/@node-red/nodes/core/storage/10-file.html
@@ -198,8 +198,8 @@
         category: 'storage',
         defaults: {
             name: {value:""},
-            filename: {value:"filename"},
-            filenameType: {value:"msg"},
+            filename: {value:""},
+            filenameType: {value:"str"},
             appendNewline: {value:true},
             createDir: {value:false},
             overwriteFile: {value:"false"},
@@ -236,8 +236,8 @@
                 label: node._("file.encoding.setbymsg")
             }).text(label).appendTo(encSel);
             $("#node-input-filename").typedInput({
-                default: "msg",
-                types:[{ value: "str", label:"", icon:"red/images/typedInput/az.svg"}, "msg", "jsonata", "env"],
+                default: "str",
+                types: [{label:RED._("node-red:file.label.path"), value:"str", icon:""}, "msg", "jsonata", "env"],
                 typeField: $("#node-input-filenameType")
             });
             if(typeof node.filenameType == 'undefined') {
@@ -297,8 +297,8 @@
         category: 'storage',
         defaults: {
             name: {value:""},
-            filename: {value:"filename"},
-            filenameType: {value:"msg"},
+            filename: {value:""},
+            filenameType: {value:"str"},
             format: {value:"utf8"},
             chunk: {value:false},
             sendError: {value: false},
@@ -341,8 +341,8 @@
                 label: label
             }).text(label).appendTo(encSel);
             $("#node-input-filename").typedInput({
-                default: "msg",
-                types:[{ value: "str", label:"", icon:"red/images/typedInput/az.svg"}, "msg", "jsonata", "env"],
+                default: "str",
+                types: [{label:RED._("node-red:file.label.path"), value:"str", icon:""}, "msg", "jsonata", "env"],
                 typeField: $("#node-input-filenameType")
             });
             if(typeof node.filenameType == 'undefined') {
diff --git a/packages/node_modules/@node-red/nodes/examples/function/delay/06 - Simple Queue with release b/packages/node_modules/@node-red/nodes/examples/function/delay/06 - Simple Queue with release
new file mode 100644
index 000000000..51d7595f2
--- /dev/null
+++ b/packages/node_modules/@node-red/nodes/examples/function/delay/06 - Simple Queue with release	
@@ -0,0 +1,149 @@
+[
+    {
+        "id": "48d660b3a4109400",
+        "type": "inject",
+        "z": "9e5f48c16729e4f0",
+        "name": "inject",
+        "props": [
+            {
+                "p": "payload"
+            }
+        ],
+        "repeat": "",
+        "crontab": "",
+        "once": false,
+        "onceDelay": 0.1,
+        "topic": "",
+        "payload": "",
+        "payloadType": "date",
+        "x": 185,
+        "y": 795,
+        "wires": [
+            [
+                "e0f9e206681f3504"
+            ]
+        ]
+    },
+    {
+        "id": "e0f9e206681f3504",
+        "type": "delay",
+        "z": "9e5f48c16729e4f0",
+        "name": "",
+        "pauseType": "rate",
+        "timeout": "5",
+        "timeoutUnits": "seconds",
+        "rate": "1",
+        "nbRateUnits": "30",
+        "rateUnits": "second",
+        "randomFirst": "1",
+        "randomLast": "5",
+        "randomUnits": "seconds",
+        "drop": false,
+        "allowrate": false,
+        "outputs": 1,
+        "x": 430,
+        "y": 795,
+        "wires": [
+            [
+                "e470f1d794e1bef9",
+                "af7cea1dfb797a75"
+            ]
+        ]
+    },
+    {
+        "id": "943543cf7a1958e4",
+        "type": "change",
+        "z": "9e5f48c16729e4f0",
+        "name": "set flush to 1",
+        "rules": [
+            {
+                "t": "set",
+                "p": "flush",
+                "pt": "msg",
+                "to": "1",
+                "tot": "num"
+            },
+            {
+                "t": "delete",
+                "p": "payload",
+                "pt": "msg"
+            }
+        ],
+        "action": "",
+        "property": "",
+        "from": "",
+        "to": "",
+        "reg": false,
+        "x": 510,
+        "y": 915,
+        "wires": [
+            [
+                "e0f9e206681f3504"
+            ]
+        ]
+    },
+    {
+        "id": "e470f1d794e1bef9",
+        "type": "function",
+        "z": "9e5f48c16729e4f0",
+        "name": "Do something that takes a few seconds",
+        "func": "\n//send on the message between 3 and 6 seconds later\nsetTimeout(\n    function() { \n        node.send(msg) \n    }, \n    Math.random() * 3000 + 3000\n);\nreturn null;",
+        "outputs": 1,
+        "noerr": 0,
+        "initialize": "",
+        "finalize": "",
+        "libs": [],
+        "x": 760,
+        "y": 795,
+        "wires": [
+            [
+                "943543cf7a1958e4",
+                "859258551b8389b7"
+            ]
+        ]
+    },
+    {
+        "id": "af7cea1dfb797a75",
+        "type": "debug",
+        "z": "9e5f48c16729e4f0",
+        "name": "IN",
+        "active": true,
+        "tosidebar": true,
+        "console": false,
+        "tostatus": false,
+        "complete": "payload",
+        "targetType": "msg",
+        "statusVal": "",
+        "statusType": "auto",
+        "x": 710,
+        "y": 735,
+        "wires": []
+    },
+    {
+        "id": "859258551b8389b7",
+        "type": "debug",
+        "z": "9e5f48c16729e4f0",
+        "name": "OUT",
+        "active": true,
+        "tosidebar": true,
+        "console": false,
+        "tostatus": false,
+        "complete": "payload",
+        "targetType": "msg",
+        "statusVal": "",
+        "statusType": "auto",
+        "x": 895,
+        "y": 735,
+        "wires": []
+    },
+    {
+        "id": "ecaaf26326da10ee",
+        "type": "comment",
+        "z": "9e5f48c16729e4f0",
+        "name": "Simple Queue with release",
+        "info": "This example shows how to use a delay node set to rate limit mode as a simple queue to feed a\nprocess that may take some time to complete. Once that process completes the feedback is then\nset to flush out the next message - thus running the \"loop\" as fast as possible with no overlaps.\n\n**Note**: only the `msg.flush` property msut be set - otherwise the other properties that are fed \nback will be added as another new message to the queue.",
+        "x": 235,
+        "y": 915,
+        "wires": []
+    }
+]
\ No newline at end of file
diff --git a/packages/node_modules/@node-red/nodes/locales/en-US/common/60-link.html b/packages/node_modules/@node-red/nodes/locales/en-US/common/60-link.html
index ef83a42f5..152717fc8 100644
--- a/packages/node_modules/@node-red/nodes/locales/en-US/common/60-link.html
+++ b/packages/node_modules/@node-red/nodes/locales/en-US/common/60-link.html
@@ -54,9 +54,10 @@
     <p>If no response is received within the configured timeout, default 30 seconds, the node
        will log an error that can be caught using the <code>catch</code> node.</p>
     <p>When the option <b>Link Type</b> is set to "Dynamic target" <code>msg.target</code> can be used to call a
-       <code>link in</code> by name. The target <code>link in</code> node must be named.
+       <code>link in</code> by name or id. 
     <ul>
-      <li>If there are 2 <code>link in</code> nodes with the same name, an error will be raised</li>
+      <li>If there is a <code>link in</code> nodes with the same id, it will be called</li>
+      <li>If there are two or more <code>link in</code> nodes with the same name, an error will be raised</li>
       <li>A <code>link call</code> cannot call a <code>link in</code> node inside a subflow</li>
     </ul>
     </p>
diff --git a/packages/node_modules/@node-red/nodes/locales/en-US/messages.json b/packages/node_modules/@node-red/nodes/locales/en-US/messages.json
old mode 100755
new mode 100644
index 8773d457e..62d5f351f
--- a/packages/node_modules/@node-red/nodes/locales/en-US/messages.json
+++ b/packages/node_modules/@node-red/nodes/locales/en-US/messages.json
@@ -137,6 +137,7 @@
         "toConsole": "system console",
         "toStatus": "node status (32 characters)",
         "severity": "Level",
+        "node": "node",
         "notification": {
             "activated": "Successfully activated: __label__",
             "deactivated": "Successfully deactivated: __label__"
@@ -193,22 +194,22 @@
             "key": "Private Key",
             "passphrase": "Passphrase",
             "ca": "CA Certificate",
-            "verify-server-cert":"Verify server certificate",
+            "verify-server-cert": "Verify server certificate",
             "servername": "Server Name",
             "alpnprotocol": "ALPN Protocol"
         },
         "placeholder": {
-            "cert":"path to certificate (PEM format)",
-            "key":"path to private key (PEM format)",
-            "ca":"path to CA certificate (PEM format)",
-            "passphrase":"private key passphrase (optional)",
-            "servername":"for use with SNI",
-            "alpnprotocol":"for use with ALPN"
+            "cert": "path to certificate (PEM format)",
+            "key": "path to private key (PEM format)",
+            "ca": "path to CA certificate (PEM format)",
+            "passphrase": "private key passphrase (optional)",
+            "servername": "for use with SNI",
+            "alpnprotocol": "for use with ALPN"
         },
         "error": {
             "missing-file": "No certificate/key file provided",
-	    "invalid-cert": "Certificate not specified",
-	    "invalid-key": "Private key not specified"
+            "invalid-cert": "Certificate not specified",
+            "invalid-key": "Private key not specified"
         }
     },
     "exec": {
@@ -262,10 +263,10 @@
             "moduleLoadError": "Failed to load module __module__: __error__",
             "moduleNameError": "Invalid module variable name: __name__",
             "moduleNameReserved": "Reserved variable name: __name__",
-            "inputListener":"Cannot add listener to 'input' event within Function",
-            "non-message-returned":"Function tried to send a message of type __type__",
-	    "invalid-js": "Error in JavaScript code",
-	    "missing-module": "Module __module__ missing"
+            "inputListener": "Cannot add listener to 'input' event within Function",
+            "non-message-returned": "Function tried to send a message of type __type__",
+            "invalid-js": "Error in JavaScript code",
+            "missing-module": "Module __module__ missing"
         }
     },
     "template": {
@@ -319,35 +320,35 @@
             "limit": "limit",
             "limitTopic": "limit topic",
             "random": "random",
-	    "rate": "rate",
-	    "random-first": "first random value",
-	    "random-last": "last random value",
-            "units" : {
+            "rate": "rate",
+            "random-first": "first random value",
+            "random-last": "last random value",
+            "units": {
                 "second": {
-                    "plural" : "Seconds",
+                    "plural": "Seconds",
                     "singular": "Second"
                 },
                 "minute": {
-                    "plural" : "Minutes",
+                    "plural": "Minutes",
                     "singular": "Minute"
                 },
                 "hour": {
-                    "plural" : "Hours",
+                    "plural": "Hours",
                     "singular": "Hour"
                 },
                 "day": {
-                    "plural" : "Days",
+                    "plural": "Days",
                     "singular": "Day"
                 }
             }
         },
         "errors": {
-            "too-many" : "too many pending messages in delay node",
-	    "invalid-timeout": "Invalid delay value",
-	    "invalid-rate": "Invalid rate value",
-	    "invalid-rate-unit": "Invalid rate unit value",
-	    "invalid-random-first": "Invalid first random value",
-	    "invalid-random-last": "Invalid last random value"
+            "too-many": "too many pending messages in delay node",
+            "invalid-timeout": "Invalid delay value",
+            "invalid-rate": "Invalid rate value",
+            "invalid-rate-unit": "Invalid rate unit value",
+            "invalid-random-first": "Invalid first random value",
+            "invalid-random-last": "Invalid last random value"
         }
     },
     "trigger": {
@@ -382,11 +383,11 @@
             "trigger-block": "trigger & block",
             "trigger-loop": "resend every",
             "reset": "Reset the trigger if:",
-            "resetMessage":"msg.reset is set",
-            "resetPayload":"msg.payload equals",
+            "resetMessage": "msg.reset is set",
+            "resetPayload": "msg.payload equals",
             "resetprompt": "optional",
-	    "duration": "duration",
-	    "topic": "topic"
+            "duration": "duration",
+            "topic": "topic"
         }
     },
     "comment": {
@@ -411,8 +412,8 @@
             "cleansession": "Use clean session",
             "cleanstart": "Use clean start",
             "use-tls": "Use TLS",
-            "tls-config":"TLS Configuration",
-            "verify-server-cert":"Verify server certificate",
+            "tls-config": "TLS Configuration",
+            "verify-server-cert": "Verify server certificate",
             "compatmode": "Use legacy MQTT 3.1 support",
             "userProperties": "User Properties",
             "subscriptionIdentifier": "Subscription ID",
@@ -447,10 +448,10 @@
             "auto-connect": "Connect automatically",
             "auto-mode-depreciated": "This option is depreciated. Please use the new auto-detect mode."
         },
-        "sections-label":{
+        "sections-label": {
             "birth-message": "Message sent on connection (birth message)",
-            "will-message":"Message sent on an unexpected disconnection (will message)",
-            "close-message":"Message sent before disconnecting (close message)"
+            "will-message": "Message sent on an unexpected disconnection (will message)",
+            "close-message": "Message sent before disconnecting (close message)"
         },
         "tabs-label": {
             "connection": "Connection",
@@ -459,7 +460,7 @@
         },
         "placeholder": {
             "clientid": "Leave blank for auto generated",
-            "clientid-nonclean":"Must be set for non-clean sessions",
+            "clientid-nonclean": "Must be set for non-clean sessions",
             "will-topic": "Leave blank to disable will message",
             "birth-topic": "Leave blank to disable birth message",
             "close-topic": "Leave blank to disable close message"
@@ -492,8 +493,7 @@
             "invalid-action-action": "Invalid action specified",
             "invalid-action-alreadyconnected": "Disconnect from broker before connecting",
             "invalid-action-badsubscription": "msg.topic is missing or invalid",
-	    "invalid-client-id": "Missing Client ID"
-
+            "invalid-client-id": "Missing Client ID"
         }
     },
     "httpin": {
@@ -506,7 +506,7 @@
             "status": "Status code",
             "headers": "Headers",
             "other": "other",
-            "paytoqs" : {
+            "paytoqs": {
                 "ignore": "Ignore",
                 "query": "Append to query-string parameters",
                 "body": "Send as request body"
@@ -520,7 +520,7 @@
         "setby": "- set by msg.method -",
         "basicauth": "Use authentication",
         "use-tls": "Enable secure (SSL/TLS) connection",
-        "tls-config":"TLS Configuration",
+        "tls-config": "TLS Configuration",
         "basic": "basic authentication",
         "digest": "digest authentication",
         "bearer": "bearer authentication",
@@ -545,8 +545,8 @@
             "no-response": "No response object",
             "json-error": "JSON parse error",
             "no-url": "No url specified",
-            "deprecated-call":"Deprecated call to __method__",
-            "invalid-transport":"non-http transport requested",
+            "deprecated-call": "Deprecated call to __method__",
+            "invalid-transport": "non-http transport requested",
             "timeout-isnan": "Timeout value is not a valid number, ignoring",
             "timeout-isnegative": "Timeout value is negative, ignoring",
             "invalid-payload": "Invalid payload",
@@ -584,8 +584,8 @@
             "send-error": "An error occurred while sending: ",
             "missing-conf": "Missing server configuration",
             "duplicate-path": "Cannot have two WebSocket listeners on the same path: __path__",
-	    "missing-server": "Missing server configuration",
-	    "missing-client": "Missing client configuration"
+            "missing-server": "Missing server configuration",
+            "missing-client": "Missing client configuration"
         }
     },
     "watch": {
@@ -645,7 +645,6 @@
             "connection-closed": "connection closed from __host__:__port__",
             "connections": "__count__ connection",
             "connections_plural": "__count__ connections"
-
         },
         "errors": {
             "connection-lost": "connection lost to __host__:__port__",
@@ -657,8 +656,8 @@
             "connect-timeout": "connect timeout",
             "connect-fail": "connect failed",
             "bad-string": "failed to convert to string",
-	    "invalid-host": "Invalid host",
-	    "invalid-port": "Invalid port"
+            "invalid-host": "Invalid host",
+            "invalid-port": "Invalid port"
         }
     },
     "udp": {
@@ -673,7 +672,7 @@
             "toport": "to port",
             "address": "Address",
             "decode-base64": "Decode Base64 encoded payload?",
-	    "port": "port"
+            "port": "port"
         },
         "placeholder": {
             "interface": "(optional) local interface or address to bind to",
@@ -721,7 +720,7 @@
             "port-invalid": "udp: port number not valid",
             "alreadyused": "udp: port __port__ already in use",
             "ifnotfound": "udp: interface __iface__ not found",
-	    "invalid-group": "invalid multicast group"
+            "invalid-group": "invalid multicast group"
         }
     },
     "switch": {
@@ -729,7 +728,9 @@
         "label": {
             "property": "Property",
             "rule": "rule",
-            "repair": "recreate message sequences"
+            "repair": "recreate message sequences",
+            "value-rules": "value rules",
+            "sequence-rules": "sequence rules"
         },
         "previous": "previous value",
         "and": "and",
@@ -786,8 +787,8 @@
             "invalid-json": "Invalid 'to' JSON property",
             "invalid-expr": "Invalid JSONata expression: __error__",
             "no-override": "Cannot set property of non-object type: __property__",
-	    "invalid-prop": "Invalid property expression: __property__",
-	    "invalid-json-data": "Invalid JSON data: __error__"
+            "invalid-prop": "Invalid property expression: __property__",
+            "invalid-json-data": "Invalid JSON data: __error__"
         }
     },
     "range": {
@@ -799,10 +800,10 @@
             "from": "from",
             "to": "to",
             "roundresult": "Round result to the nearest integer?",
-	    "minin": "input from",
-	    "maxin": "input to",
-	    "minout": "target from",
-	    "maxout": "target to"
+            "minin": "input from",
+            "maxin": "input to",
+            "minout": "target from",
+            "maxout": "target to"
         },
         "placeholder": {
             "min": "e.g. 0",
@@ -899,8 +900,8 @@
             "property": "Property",
             "actions": {
                 "toggle": "Convert between JSON String & Object",
-                "str":"Always convert to JSON String",
-                "obj":"Always convert to JavaScript Object"
+                "str": "Always convert to JSON String",
+                "obj": "Always convert to JavaScript Object"
             }
         }
     },
@@ -927,6 +928,7 @@
             "write": "write file",
             "read": "read file",
             "filename": "Filename",
+            "path": "path",
             "action": "Action",
             "addnewline": "Add newline (\\n) to each payload?",
             "createdir": "Create directory if it doesn't exist?",
@@ -986,15 +988,15 @@
     },
     "split": {
         "split": "split",
-        "intro":"Split <code>msg.payload</code> based on type:",
-        "object":"<b>Object</b>",
-        "objectSend":"Send a message for each key/value pair",
-        "strBuff":"<b>String</b> / <b>Buffer</b>",
-        "array":"<b>Array</b>",
-        "splitUsing":"Split using",
-        "splitLength":"Fixed length of",
-        "stream":"Handle as a stream of messages",
-        "addname":" Copy key to "
+        "intro": "Split <code>msg.payload</code> based on type:",
+        "object": "<b>Object</b>",
+        "objectSend": "Send a message for each key/value pair",
+        "strBuff": "<b>String</b> / <b>Buffer</b>",
+        "array": "<b>Array</b>",
+        "splitUsing": "Split using",
+        "splitLength": "Fixed length of",
+        "stream": "Handle as a stream of messages",
+        "addname": " Copy key to "
     },
     "join": {
         "join": "join",
@@ -1027,7 +1029,7 @@
         "complete": "After a message with the <code>msg.complete</code> property set",
         "tip": "This mode assumes this node is either paired with a <i>split</i> node or the received messages will have a properly configured <code>msg.parts</code> property.",
         "too-many": "too many pending messages in join node",
-	"message-prop": "message property",
+        "message-prop": "message property",
         "merge": {
             "topics-label": "Merged Topics",
             "topics": "topics",
@@ -1046,51 +1048,51 @@
             "invalid-type": "Cannot join __error__ to buffer"
         }
     },
-    "sort" : {
+    "sort": {
         "sort": "sort",
-        "target" : "Sort",
-        "seq" : "message sequence",
-        "key" : "Key",
-        "elem" : "element value",
-        "order" : "Order",
-        "ascending" : "ascending",
-        "descending" : "descending",
-        "as-number" : "as number",
-        "invalid-exp" : "Invalid JSONata expression in sort node: __message__",
-        "too-many" : "Too many pending messages in sort node",
-        "clear" : "clear pending message in sort node"
+        "target": "Sort",
+        "seq": "message sequence",
+        "key": "Key",
+        "elem": "element value",
+        "order": "Order",
+        "ascending": "ascending",
+        "descending": "descending",
+        "as-number": "as number",
+        "invalid-exp": "Invalid JSONata expression in sort node: __message__",
+        "too-many": "Too many pending messages in sort node",
+        "clear": "clear pending message in sort node"
     },
-    "batch" : {
+    "batch": {
         "batch": "batch",
         "mode": {
-            "label" : "Mode",
-            "num-msgs" : "Group by number of messages",
-            "interval" : "Group by time interval",
-            "concat" : "Concatenate sequences"
+            "label": "Mode",
+            "num-msgs": "Group by number of messages",
+            "interval": "Group by time interval",
+            "concat": "Concatenate sequences"
         },
         "count": {
-            "label" : "Number of messages",
-            "overlap" : "Overlap",
-            "count" : "count",
-            "invalid" : "Invalid count and overlap"
+            "label": "Number of messages",
+            "overlap": "Overlap",
+            "count": "count",
+            "invalid": "Invalid count and overlap"
         },
         "interval": {
-            "label" : "Interval",
-            "seconds" : "seconds",
-            "empty" : "send empty message when no message arrives"
+            "label": "Interval",
+            "seconds": "seconds",
+            "empty": "send empty message when no message arrives"
         },
         "concat": {
             "topics-label": "Topics",
-            "topic" : "topic"
+            "topic": "topic"
         },
-        "too-many" : "too many pending messages in batch node",
-        "unexpected" : "unexpected mode",
-        "no-parts" : "no parts property in message",
-	"error": {
-	    "invalid-count": "Invalid count",
-	    "invalid-overlap": "Invalid overlap",
-	    "invalid-interval": "Invalid interval"
-	}
+        "too-many": "too many pending messages in batch node",
+        "unexpected": "unexpected mode",
+        "no-parts": "no parts property in message",
+        "error": {
+            "invalid-count": "Invalid count",
+            "invalid-overlap": "Invalid overlap",
+            "invalid-interval": "Invalid interval"
+        }
     },
     "rbe": {
         "rbe": "filter",
@@ -1100,11 +1102,11 @@
             "start": "Start value",
             "name": "Name",
             "septopics": "Apply mode separately for each ",
-	    "gap": "value change",
-	    "property": "property",
-	    "topic": "topic"
+            "gap": "value change",
+            "property": "property",
+            "topic": "topic"
         },
-        "placeholder":{
+        "placeholder": {
             "bandgap": "e.g. 10 or 5%",
             "start": "leave blank to use first data received"
         },
diff --git a/packages/node_modules/@node-red/nodes/locales/ja/common/60-link.html b/packages/node_modules/@node-red/nodes/locales/ja/common/60-link.html
index 260e96a2b..db8851641 100644
--- a/packages/node_modules/@node-red/nodes/locales/ja/common/60-link.html
+++ b/packages/node_modules/@node-red/nodes/locales/ja/common/60-link.html
@@ -42,9 +42,10 @@
     <p>本ノードはメッセージを受信すると、メッセージを接続した <code>link in</code> ノードへ渡します。
        その後、応答を待った後にメッセージを送信します。</o>
     <p>もし、設定したタイムアウト(デフォルト30秒)以内に応答がない場合は、<code>catch</code> ノードを用いてエラーをログに記録することもできます。</p>
-    <p><b>リンクの種類</b>で"対象を動的に指定"を選択した場合、<code>link in</code>ノードの名前を<code>msg.target</code>に指定して呼び出すことができます。対象となる<code>link in</code>ノードには、名前を付ける必要があります。
+    <p><b>リンクの種類</b>で"対象を動的に指定"を選択した場合、<code>link in</code>ノードのIDもしくは名前を<code>msg.target</code>に指定して呼び出すことができます。
     <ul>
-      <li>もし、同じ名前を付けた<code>link in</code>ノードが2つある場合、エラーが発生します。</li>
+      <li>同じIDの<code>link in</code>ノードがある場合、それを呼び出します。</li>
+      <li>もし、同じ名前を付けた<code>link in</code>ノードが2つ以上ある場合、エラーが発生します。</li>
       <li><code>link call</code>は、サブフローの中の<code>link in</code>ノードを呼び出すことはできません。</li>
     </ul>
     </p>
diff --git a/packages/node_modules/@node-red/nodes/locales/ja/function/10-function.html b/packages/node_modules/@node-red/nodes/locales/ja/function/10-function.html
index a18e5e8a8..960b755f6 100644
--- a/packages/node_modules/@node-red/nodes/locales/ja/function/10-function.html
+++ b/packages/node_modules/@node-red/nodes/locales/ja/function/10-function.html
@@ -28,7 +28,7 @@
     <p>返却/sendの対象は次のとおりです:</p>
     <ul>
       <li>単一メッセージオブジェクト - 最初の出力に接続されたノードに渡されます</li>
-      <li>メッセージオブジェクトの配列 - 対応する出力に接続されたノードに渡されます</li>          
+      <li>メッセージオブジェクトの配列 - 対応する出力に接続されたノードに渡されます</li>
     </ul>
     <p>注: 初期化処理の実行はノードの初期化中に行われます。そのため、初期化処理タブにsendを記述した場合に後続ノードでメッセージを受け取れないことがあります。</p>
     <p>配列要素が配列の場合には、複数のメッセージを対応する出力に送出します。</p>
diff --git a/packages/node_modules/@node-red/nodes/locales/ja/messages.json b/packages/node_modules/@node-red/nodes/locales/ja/messages.json
index 79d13a01c..6e16daa6f 100644
--- a/packages/node_modules/@node-red/nodes/locales/ja/messages.json
+++ b/packages/node_modules/@node-red/nodes/locales/ja/messages.json
@@ -86,10 +86,10 @@
             "failed": "inject処理が失敗しました。詳細はログを確認してください。",
             "toolong": "時間間隔が大き過ぎます",
             "invalid-expr": "JSONata式が不正: __error__",
-	    "invalid-jsonata": "__prop__: プロパティ式が不正: __error__",
-	    "invalid-prop": "__prop__: プロパティ式が不正: __error__",
-	    "invalid-json": "__prop__: JSONデータが不正: __error__",
-	    "invalid-repeat": "繰り返し数が不正"
+            "invalid-jsonata": "__prop__: プロパティ式が不正: __error__",
+            "invalid-prop": "__prop__: プロパティ式が不正: __error__",
+            "invalid-json": "__prop__: JSONデータが不正: __error__",
+            "invalid-repeat": "繰り返し数が不正"
         }
     },
     "catch": {
@@ -129,6 +129,7 @@
         "msgprop": "メッセージプロパティ",
         "msgobj": "msgオブジェクト全体",
         "autostatus": "デバッグ出力と同じ",
+        "messageCount": "メッセージ数をカウント",
         "to": "出力先",
         "debtab": "デバッグタブ",
         "tabcon": "デバッグタブとコンソール",
@@ -136,6 +137,7 @@
         "toConsole": "システムコンソール",
         "toStatus": "ノードステータス(32 文字)",
         "severity": "Level",
+        "node": "ノード",
         "notification": {
             "activated": "有効化しました: __label__",
             "deactivated": "無効化しました: __label__"
@@ -206,8 +208,8 @@
         },
         "error": {
             "missing-file": "証明書と秘密鍵のファイルが設定されていません",
-	    "invalid-cert": "証明書が指定されていません",
-	    "invalid-key": "秘密鍵が指定されていません"
+            "invalid-cert": "証明書が指定されていません",
+            "invalid-key": "秘密鍵が指定されていません"
         }
     },
     "exec": {
@@ -263,8 +265,8 @@
             "moduleNameReserved": "予約された変数名です: __name__",
             "inputListener": "コード内で'input'イベントのリスナを設定できません",
             "non-message-returned": "Functionノードが __type__ 型のメッセージ送信を試みました",
-	    "invalid-js": "JavaScriptコードのエラー",
-	    "missing-module": "モジュール __module__ が存在しません"
+            "invalid-js": "JavaScriptコードのエラー",
+            "missing-module": "モジュール __module__ が存在しません"
         }
     },
     "template": {
@@ -318,9 +320,9 @@
             "limit": "limit",
             "limitTopic": "limit topic",
             "random": "random",
-	    "rate": "流量",
-	    "random-first": "ランダム最小値",
-	    "random-last": "ランダム最大値",
+            "rate": "流量",
+            "random-first": "ランダム最小値",
+            "random-last": "ランダム最大値",
             "units": {
                 "second": {
                     "plural": "秒",
@@ -342,11 +344,11 @@
         },
         "errors": {
             "too-many": "delayノード内で保持しているメッセージが多すぎます",
-	    "invalid-timeout": "遅延時間が不正",
-	    "invalid-rate": "流量値が不正",
-	    "invalid-rate-unit": "流量単位時間が不正",
-	    "invalid-random-first": "ランダム最小値が不正",
-	    "invalid-random-last": "ランダム最大値が不正"
+            "invalid-timeout": "遅延時間が不正",
+            "invalid-rate": "流量値が不正",
+            "invalid-rate-unit": "流量単位時間が不正",
+            "invalid-random-first": "ランダム最小値が不正",
+            "invalid-random-last": "ランダム最大値が不正"
         }
     },
     "trigger": {
@@ -384,8 +386,8 @@
             "resetMessage": "msg.resetを設定",
             "resetPayload": "msg.payloadが次の値",
             "resetprompt": "任意",
-	    "duration": "時間間隔",
-	    "topic": "トピック"
+            "duration": "時間間隔",
+            "topic": "トピック"
         }
     },
     "comment": {
@@ -443,7 +445,8 @@
             "action": "動作",
             "staticTopic": "1つのトピックを購読",
             "dynamicTopic": "動的な購読",
-            "auto-connect": "自動接続"
+            "auto-connect": "自動接続",
+            "auto-mode-depreciated": "本オプションは非推奨になりました。新しい自動判定モードを使用してください。"
         },
         "sections-label": {
             "birth-message": "接続時の送信メッセージ(Birthメッセージ)",
@@ -490,7 +493,7 @@
             "invalid-action-action": "指定された動作が不正です",
             "invalid-action-alreadyconnected": "接続する前にブローカから切断してください",
             "invalid-action-badsubscription": "msg.topicが存在しないか不正です",
-	    "invalid-client-id": "クライアントIDが未指定"
+            "invalid-client-id": "クライアントIDが未指定"
         }
     },
     "httpin": {
@@ -581,8 +584,8 @@
             "send-error": "送信中にエラーが発生しました: ",
             "missing-conf": "サーバ設定が不足しています",
             "duplicate-path": "同じパスに対して2つのWebSocketリスナは指定できません: __path__",
-	    "missing-server": "サーバが設定されていません",
-	    "missing-client": "クライアントが設定されていません"
+            "missing-server": "サーバが設定されていません",
+            "missing-client": "クライアントが設定されていません"
         }
     },
     "watch": {
@@ -611,7 +614,8 @@
             "ms": "ミリ秒",
             "chars": "文字",
             "close": "終了",
-            "optional": "(任意)"
+            "optional": "(任意)",
+            "reattach": "区切り文字を再追加"
         },
         "type": {
             "listen": "待ち受け",
@@ -652,8 +656,8 @@
             "connect-timeout": "接続がタイムアウトしました",
             "connect-fail": "接続に失敗しました",
             "bad-string": "文字列への変換に失敗しました",
-	    "invalid-host": "ホスト名が不正",
-	    "invalid-port": "ポートが不正"
+            "invalid-host": "ホスト名が不正",
+            "invalid-port": "ポートが不正"
         }
     },
     "udp": {
@@ -668,7 +672,7 @@
             "toport": "ポート",
             "address": "アドレス",
             "decode-base64": "Base64形式のペイロードを復号",
-	    "port": "ポート"
+            "port": "ポート"
         },
         "placeholder": {
             "interface": "(任意) 使用するローカルインターフェイスもしくはアドレス",
@@ -716,7 +720,7 @@
             "port-invalid": "udp: ポート番号が不正です",
             "alreadyused": "udp: 既に__port__番ポートが使用されています",
             "ifnotfound": "udp: インターフェイス __iface__ がありません",
-	    "invalid-group": "マルチキャストグループが不正"
+            "invalid-group": "マルチキャストグループが不正"
         }
     },
     "switch": {
@@ -724,7 +728,9 @@
         "label": {
             "property": "プロパティ",
             "rule": "条件",
-            "repair": "メッセージ列の補正"
+            "repair": "メッセージ列の補正",
+            "value-rules": "値ルール",
+            "sequence-rules": "列ルール"
         },
         "previous": "前回の値",
         "and": "～",
@@ -732,22 +738,22 @@
         "stopfirst": "最初に合致した条件で終了",
         "ignorecase": "大文字、小文字を区別しない",
         "rules": {
-            "btwn": "is between",
-            "cont": "contains",
-            "regex": "matches regex",
-            "true": "is true",
-            "false": "is false",
-            "null": "is null",
-            "nnull": "is not null",
-            "istype": "is of type",
-            "empty": "is empty",
-            "nempty": "is not empty",
-            "head": "head",
-            "tail": "tail",
-            "index": "index between",
+            "btwn": "範囲内である",
+            "cont": "要素に含む",
+            "regex": "正規表現にマッチ",
+            "true": "trueである",
+            "false": "falseである",
+            "null": "nullである",
+            "nnull": "nullでない",
+            "istype": "指定型である",
+            "empty": "空である",
+            "nempty": "空でない",
+            "head": "先頭要素である",
+            "tail": "末尾要素である",
+            "index": "指定添字範囲要素である",
             "exp": "JSONata式",
             "else": "その他",
-            "hask": "has key"
+            "hask": "キーを含む"
         },
         "errors": {
             "invalid-expr": "不正な表現: __error__",
@@ -781,8 +787,8 @@
             "invalid-json": "対象の値のJSONプロパティが不正",
             "invalid-expr": "JSONata式が不正: __error__",
             "no-override": "オブジェクト型でないプロパティを設定できません: __property__",
-	    "invalid-prop": "プロパティ式が不正: __property__",
-	    "invalid-json-data": "JSONデータが不正: __error__"
+            "invalid-prop": "プロパティ式が不正: __property__",
+            "invalid-json-data": "JSONデータが不正: __error__"
         }
     },
     "range": {
@@ -794,10 +800,10 @@
             "from": "最小値",
             "to": "最大値",
             "roundresult": "小数値を四捨五入し整数値へ変換",
-	    "minin": "入力最小値",
-	    "maxin": "入力最大値",
-	    "minout": "出力最小値",
-	    "maxout": "出力最大値"
+            "minin": "入力最小値",
+            "maxin": "入力最大値",
+            "minout": "出力最小値",
+            "maxout": "出力最大値"
         },
         "placeholder": {
             "min": "例) 0",
@@ -922,6 +928,7 @@
             "write": "write file",
             "read": "read file",
             "filename": "ファイル名",
+            "path": "パス",
             "action": "動作",
             "addnewline": "メッセージの入力のたびに改行を追加",
             "createdir": "ディレクトリが存在しない場合は作成",
@@ -1022,8 +1029,8 @@
         "complete": "<code>msg.complete</code> プロパティが設定されたメッセージ受信後",
         "tip": "このモードでは、本ノードが <i>split</i> ノードと組となるか、 <code>msg.parts</code> プロパティが設定されたメッセージを受け取ることが前提となります。",
         "too-many": "joinノード内部で保持しているメッセージが多すぎます",
- 	"message-prop": "メッセージプロパティ",
-	"merge": {
+        "message-prop": "メッセージプロパティ",
+        "merge": {
             "topics-label": "対象トピック",
             "topics": "トピック",
             "topic": "トピック",
@@ -1081,11 +1088,11 @@
         "too-many": "batchノード内で保持しているメッセージが多すぎます",
         "unexpected": "想定外のモード",
         "no-parts": "メッセージにpartsプロパティがありません",
-	"error": {
-	    "invalid-count": "メッセージ数が不正",
-	    "invalid-overlap": "オーバラップが不正",
-	    "invalid-interval": "時間間隔が不正"
-	}
+        "error": {
+            "invalid-count": "メッセージ数が不正",
+            "invalid-overlap": "オーバラップが不正",
+            "invalid-interval": "時間間隔が不正"
+        }
     },
     "rbe": {
         "rbe": "filter",
@@ -1095,9 +1102,9 @@
             "start": "初期値",
             "name": "名前",
             "septopics": "個別に動作を適用",
-	    "gap": "変化量",
-	    "property": "プロパティ",
-	    "topic": "トピック"
+            "gap": "変化量",
+            "property": "プロパティ",
+            "topic": "トピック"
         },
         "placeholder": {
             "bandgap": "例:10、5%",
diff --git a/packages/node_modules/@node-red/nodes/locales/ja/network/10-mqtt.html b/packages/node_modules/@node-red/nodes/locales/ja/network/10-mqtt.html
index 1b43ea097..435829e1e 100644
--- a/packages/node_modules/@node-red/nodes/locales/ja/network/10-mqtt.html
+++ b/packages/node_modules/@node-red/nodes/locales/ja/network/10-mqtt.html
@@ -89,7 +89,7 @@
        <dt class="optional">userProperties <span class="property-type">オブジェクト</span></dt>
        <dd><b>MQTTv5</b>: メッセージのユーザプロパティ</dd>
        <dt class="optional">messageExpiryInterval <span class="property-type">数値</span></dt>
-       <dd><b>MQTTv5</b>: 秒単位のメッセージの有効期限</dd>   
+       <dd><b>MQTTv5</b>: 秒単位のメッセージの有効期限</dd>
        <dt class="optional">topicAlias <span class="property-type">数値</span></dt>
        <dd><b>MQTTv5</b>: 使用するMQTTトピックエイリアス</dd>
     </dl>
diff --git a/packages/node_modules/@node-red/nodes/locales/ja/network/21-httprequest.html b/packages/node_modules/@node-red/nodes/locales/ja/network/21-httprequest.html
index d592c1d6e..1835b88f6 100644
--- a/packages/node_modules/@node-red/nodes/locales/ja/network/21-httprequest.html
+++ b/packages/node_modules/@node-red/nodes/locales/ja/network/21-httprequest.html
@@ -24,7 +24,7 @@
         <dt class="optional">method <span class="property-type">文字列</span></dt>
         <dd>ノードの設定で指定していない場合、このプロパティでリクエストに用いるHTTPメソッドを設定します。<code>GET</code>, <code>PUT</code>, <code>POST</code>, <code>PATCH</code>, <code>DELETE</code>のいずれかを指定してください。</dd>
         <dt class="optional">headers <span class="property-type">オブジェクト</span></dt>
-        <dd>リクエストのHTTPヘッダを指定します。</dd>
+        <dd>リクエストのHTTPヘッダを指定します。注釈: <code>msg.headers</code>のヘッダは、ノード設定のヘッダで上書きされます。</dd>
         <dt class="optional">cookies <span class="property-type">オブジェクト</span></dt>
         <dd>設定すると、リクエストと共にクッキーを送ることができます。</dd>
         <dt class="optional">payload</dt>
diff --git a/packages/node_modules/@node-red/nodes/locales/ja/storage/10-file.html b/packages/node_modules/@node-red/nodes/locales/ja/storage/10-file.html
index 3e67368d3..69765304c 100644
--- a/packages/node_modules/@node-red/nodes/locales/ja/storage/10-file.html
+++ b/packages/node_modules/@node-red/nodes/locales/ja/storage/10-file.html
@@ -15,11 +15,12 @@
 -->
 
 <script type="text/html" data-help-name="file">
-    <p><code>msg.payload</code>をファイルに書き出します。書き出しは、ファイルの最後に追記もしくは既存の内容の置き換えを選択できます。この他、ファイルの削除を行うことも可能です。</p>
+    <p><code>msg.payload</code>をファイルに書き出します。書き出しは、ファイルの最後に追記もしくは既存の内容の置き換えを選択できます。その他、ファイルの削除を行うことも可能です。</p>
     <h3>入力</h3>
     <dl class="message-properties">
         <dt class="optional">filename <span class="property-type">文字列</span></dt>
-        <dd>対象ファイル名をノードに設定していない場合、このプロパティでファイルを指定できます</dd>
+        <dd>更新するファイルの名前は、ノード設定やメッセージのプロパティで指定できます。デフォルトでは、<code>msg.filename</code>が使われますが、ノード内でカスタマイズすることも可能です。
+        </dd>
         <dt class="optional">encoding <span class="property-type">文字列</span></dt>
         <dd>エンコーディングをmsgで設定する構成にした際は、この任意のプロパティでエンコーディングを設定できます。</dt>
     </dl>
@@ -30,7 +31,7 @@
     <p><code>msg.filename</code>を使う場合、書き込みを行う毎にファイルをクローズします。より良い性能を得るためにはファイル名をノードに設定してください。</p>
     <p>追記を行う代わりに、ファイル全体を上書きするように設定することもできます。例えば、画像のようなバイナリデータをファイルに書き出す場合は、このオプションを指定し、改行を追記するオプションを指定しないようにします。</p>
     <p>ファイル出力の際のエンコーディングは、エンコーディングリストから選択できます。</p>
-    <p>この他、ファイルの削除を行うことも可能です。</p>
+    <p>その他、ファイルの削除を行うことも可能です。</p>
 </script>
 
 <script type="text/html" data-help-name="file in">
@@ -38,14 +39,15 @@
     <h3>入力</h3>
     <dl class="message-properties">
         <dt class="optional">filename <span class="property-type">文字列</span></dt>
-        <dd>読み出し対象のファイル名をノードに設定していない場合、このプロパティでファイルを指定できます</dd>
+        <dd>読み込むファイルの名前は、ノード設定やメッセージのプロパティで指定できます。デフォルトでは、<code>msg.filename</code>が使われますが、ノード内でカスタマイズすることも可能です。
+        </dd>
     </dl>
     <h3>出力</h3>
     <dl class="message-properties">
         <dt>payload <span class="property-type">文字列 | バッファ</span></dt>
-        <dd>ファイルの内容を文字列もしくはバッファで表現します</dd>
+        <dd>ファイルの内容を文字列もしくはバッファで表現します。</dd>
         <dt class="optional">filename <span class="property-type">文字列</span></dt>
-        <dd>読み出し対象のファイル名をノードに設定していない場合、このプロパティでファイルを指定します</dd>
+        <dd>読み出し対象のファイル名をノードに設定していない場合、この任意のプロパティでファイルの名前を指定します。</dd>
     </dl>
     <h3>詳細</h3>
     <p>ファイルネームは絶対パスでの指定を推奨します。絶対パスを指定しない場合は、Node-REDプロセスのワーキングディレクトリからの相対パスとして扱います。</p>
diff --git a/packages/node_modules/@node-red/nodes/package.json b/packages/node_modules/@node-red/nodes/package.json
index a3d58974b..ff0161f86 100644
--- a/packages/node_modules/@node-red/nodes/package.json
+++ b/packages/node_modules/@node-red/nodes/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@node-red/nodes",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "license": "Apache-2.0",
     "repository": {
         "type": "git",
@@ -28,7 +28,7 @@
         "denque": "2.0.1",
         "form-data": "4.0.0",
         "fs-extra": "10.1.0",
-        "got": "11.8.3",
+        "got": "11.8.5",
         "hash-sum": "2.0.0",
         "hpagent": "1.0.0",
         "https-proxy-agent": "5.0.1",
@@ -36,7 +36,7 @@
         "js-yaml": "4.1.0",
         "media-typer": "1.1.0",
         "mqtt": "4.3.7",
-        "multer": "1.4.4",
+        "multer": "1.4.5-lts.1",
         "mustache": "4.2.0",
         "node-watch": "0.7.3",
         "on-headers": "1.0.2",
diff --git a/packages/node_modules/@node-red/registry/lib/externalModules.js b/packages/node_modules/@node-red/registry/lib/externalModules.js
index ca1e4bfd8..b61392d9b 100644
--- a/packages/node_modules/@node-red/registry/lib/externalModules.js
+++ b/packages/node_modules/@node-red/registry/lib/externalModules.js
@@ -11,6 +11,7 @@ const exec = require("@node-red/util").exec;
 const log = require("@node-red/util").log;
 const hooks = require("@node-red/util").hooks;
 const url = require("url");
+const { createRequire } = require("module");
 
 const BUILTIN_MODULES = require('module').builtinModules;
 
@@ -139,10 +140,15 @@ function importModule(module) {
     }
     const externalModuleDir = getInstallDir();
     const moduleDir = path.join(externalModuleDir,"node_modules",module);
+    // To handle both CJS and ESM we need to resolve the module to the
+    // specific file that is loaded when the module is required/imported
+    // As this won't be on the natural module search path, we use createRequire
+    // to access the module
+    const modulePath = createRequire(moduleDir).resolve(module)
     // Import needs the full path to the module's main .js file
     // It also needs to be a file:// url for Windows
-    const moduleFile = url.pathToFileURL(require.resolve(moduleDir));
-    return import(moduleFile);
+    const moduleUrl = url.pathToFileURL(modulePath);
+    return import(moduleUrl);
 }
 
 function parseModuleName(module) {
diff --git a/packages/node_modules/@node-red/registry/lib/loader.js b/packages/node_modules/@node-red/registry/lib/loader.js
index fc508aa57..61f28ab86 100644
--- a/packages/node_modules/@node-red/registry/lib/loader.js
+++ b/packages/node_modules/@node-red/registry/lib/loader.js
@@ -359,6 +359,7 @@ function loadNodeSet(node) {
     try {
         var loadPromise = null;
         var r = require(node.file);
+        r = r.__esModule ? r.default : r
         if (typeof r === "function") {
 
             var red = registryUtil.createNodeApi(node);
diff --git a/packages/node_modules/@node-red/registry/lib/localfilesystem.js b/packages/node_modules/@node-red/registry/lib/localfilesystem.js
index 62080b4a8..da4006ecc 100644
--- a/packages/node_modules/@node-red/registry/lib/localfilesystem.js
+++ b/packages/node_modules/@node-red/registry/lib/localfilesystem.js
@@ -88,9 +88,10 @@ function getLocalFile(file) {
 /**
  * Synchronously walks the directory looking for node files.
  * @param dir the directory to search
+ * @param skipValidNodeRedModules a flag to skip lading icons & files if the directory a valid node-red module
  * @return an array of fully-qualified paths to .js files
  */
-function getLocalNodeFiles(dir) {
+function getLocalNodeFiles(dir, skipValidNodeRedModules) {
     dir = path.resolve(dir);
 
     var result = [];
@@ -102,6 +103,14 @@ function getLocalNodeFiles(dir) {
         return {files: [], icons: []};
     }
     files.sort();
+    // when loading local files, if the path is a valid node-red module
+    // dont include it (will be picked up in scanTreeForNodesModules)
+    if(skipValidNodeRedModules && files.indexOf("package.json") >= 0) {
+        const package = getPackageDetails(dir)
+        if(package.isNodeRedModule) {
+            return {files: [], icons: []};
+        }
+    }
     files.forEach(function(fn) {
         var stats = fs.statSync(path.join(dir,fn));
         if (stats.isFile()) {
@@ -114,7 +123,7 @@ function getLocalNodeFiles(dir) {
         } else if (stats.isDirectory()) {
             // Ignore /.dirs/, /lib/ /node_modules/
             if (!/^(\..*|lib|icons|node_modules|test|locales)$/.test(fn)) {
-                var subDirResults = getLocalNodeFiles(path.join(dir,fn));
+                var subDirResults = getLocalNodeFiles(path.join(dir,fn), skipValidNodeRedModules);
                 result = result.concat(subDirResults.files);
                 icons = icons.concat(subDirResults.icons);
             } else if (fn === "icons") {
@@ -126,21 +135,30 @@ function getLocalNodeFiles(dir) {
     return {files: result, icons: icons}
 }
 
-function scanDirForNodesModules(dir,moduleName) {
-    var results = [];
-    var scopeName;
+function scanDirForNodesModules(dir,moduleName,package) {
+    let results = [];
+    let scopeName;
+    let files
     try {
-        var files = fs.readdirSync(dir);
-        if (moduleName) {
-            var m = /^(?:(@[^/]+)[/])?([^@/]+)/.exec(moduleName);
-            if (m) {
-                scopeName = m[1];
-                moduleName = m[2];
+        let isNodeRedModule = false
+        if(package) {
+            dir = path.join(package.moduleDir,'..')
+            files = [path.basename(package.moduleDir)]
+            moduleName =  (package.package ? package.package.name : null) || moduleName
+            isNodeRedModule = package.isNodeRedModule
+        } else {
+            files = fs.readdirSync(dir);
+            if (moduleName) {
+                var m = /^(?:(@[^/]+)[/])?([^@/]+)/.exec(moduleName);
+                if (m) {
+                    scopeName = m[1];
+                    moduleName = m[2];
+                }
             }
         }
-        for (var i=0;i<files.length;i++) {
-            var fn = files[i];
-            if (/^@/.test(fn)) {
+        for (let i=0;i<files.length;i++) {
+            let fn = files[i];
+            if (!isNodeRedModule && /^@/.test(fn)) {
                 if (scopeName && scopeName === fn) {
                     // Looking for a specific scope/module
                     results = results.concat(scanDirForNodesModules(path.join(dir,fn),moduleName));
@@ -149,16 +167,18 @@ function scanDirForNodesModules(dir,moduleName) {
                     results = results.concat(scanDirForNodesModules(path.join(dir,fn),moduleName));
                 }
             } else {
-                if (isIncluded(fn) && !isExcluded(fn) && (!moduleName || fn == moduleName)) {
-                    var pkgfn = path.join(dir,fn,"package.json");
+                if ((isNodeRedModule || (!moduleName || fn == moduleName)) && (isIncluded(fn) && !isExcluded(fn))) {
                     try {
-                        var pkg = require(pkgfn);
-                        if (pkg['node-red']) {
-                            if (!registryUtil.checkModuleAllowed(pkg.name,pkg.version,loadAllowList,loadDenyList)) {
-                                log.debug("! Module: "+pkg.name+" "+pkg.version+ " *ignored due to denyList*");
+                        const moduleDir = isNodeRedModule ? package.moduleDir : path.join(dir,fn);
+                        const pkg = package || getPackageDetails(moduleDir)
+                        if(pkg.error) {
+                            throw pkg.error
+                        }
+                        if (pkg.isNodeRedModule) {
+                            if (!pkg.allowed) {
+                                log.debug("! Module: "+pkg.package.name+" "+pkg.package.version+ " *ignored due to denyList*");
                             } else {
-                                var moduleDir = path.join(dir,fn);
-                                results.push({dir:moduleDir,package:pkg});
+                                results.push({dir:moduleDir,package:pkg.package});
                             }
                         }
                     } catch(err) {
@@ -182,11 +202,14 @@ function scanDirForNodesModules(dir,moduleName) {
  * @param moduleName the name of the module to be found
  * @return a list of node modules: {dir,package}
  */
-function scanTreeForNodesModules(moduleName) {
-    var dir = settings.coreNodesDir;
-    var results = [];
-    var userDir;
-
+ function scanTreeForNodesModules(moduleName) {
+    let coreNodesDir = settings.coreNodesDir;
+    let results = [];
+    let userDir;
+    let nodesDir;
+    if(settings.nodesDir) {
+        nodesDir = Array.isArray(settings.nodesDir) ? settings.nodesDir : [settings.nodesDir]
+    }
     if (settings.userDir) {
         packageList = getPackageList();
         userDir = path.join(settings.userDir,"node_modules");
@@ -201,15 +224,46 @@ function scanTreeForNodesModules(moduleName) {
         });
     }
 
-    if (dir) {
-        var up = path.resolve(path.join(dir,".."));
-        while (up !== dir) {
-            var pm = path.join(dir,"node_modules");
+    if (coreNodesDir) {
+        var up = path.resolve(path.join(coreNodesDir,".."));
+        while (up !== coreNodesDir) {
+            var pm = path.join(coreNodesDir,"node_modules");
             if (pm != userDir) {
                 results = results.concat(scanDirForNodesModules(pm,moduleName));
             }
-            dir = up;
-            up = path.resolve(path.join(dir,".."));
+            coreNodesDir = up;
+            up = path.resolve(path.join(coreNodesDir,".."));
+        }
+    }
+
+    // scan nodesDir for any node-red modules
+    /*
+    1. if !exist(package.json) || !package.json.has(node-red) => look for node_modules
+    2. exist(package.json) && package.json.has(node-red) => load this only
+    3. in original scan of nodesDir, ignore if:(exist(package.json) && package.json.has(node-red)) 
+    */
+    if (nodesDir) {
+        for (let dirIndex = 0; dirIndex < nodesDir.length; dirIndex++) {
+            const nodeDir = nodesDir[dirIndex];
+            const packageDetails = getPackageDetails(nodeDir)
+            if(packageDetails.isNodeRedModule) {
+                //we have found a node-red module, scan it
+                const nrModules = scanDirForNodesModules(nodeDir, packageDetails.package.name, packageDetails);
+                results = results.concat(nrModules);
+
+            } else if (packageDetails.has_node_modules) {
+                //If this dir has a `node_modues` dir, scan it
+                const nodeModulesDir = path.join(nodeDir, 'node_modules')
+                const nrModules = scanDirForNodesModules(nodeModulesDir, moduleName );
+                results = results.concat(nrModules);
+
+            } else {
+                //If this is not a node-red module AND it does NOT have a node_modules dir,
+                //it may be a directory of project directories or a node_modules dir?
+                //scan this instead
+                const nrModules = scanDirForNodesModules(nodeDir, moduleName);
+                results = results.concat(nrModules);
+            }
         }
     }
     return results;
@@ -274,24 +328,26 @@ function getModuleNodeFiles(module) {
 }
 
 function getNodeFiles(disableNodePathScan) {
-    var dir;
     // Find all of the nodes to load
-    var nodeFiles = [];
-    var results;
-
-    var dir;
-    var iconList = [];
+    let results;
+    let nodesDir;
+    if(settings.nodesDir) {
+        nodesDir = Array.isArray(settings.nodesDir) ? settings.nodesDir : [settings.nodesDir]
+    }
+    let dir;
+    let nodeFiles = [];
+    let iconList = [];
     if (settings.coreNodesDir) {
         results = getLocalNodeFiles(path.resolve(settings.coreNodesDir));
         nodeFiles = nodeFiles.concat(results.files);
         iconList = iconList.concat(results.icons);
-        var defaultLocalesPath = path.join(settings.coreNodesDir,"locales");
+        let defaultLocalesPath = path.join(settings.coreNodesDir,"locales");
         i18n.registerMessageCatalog("node-red",defaultLocalesPath,"messages.json");
     }
 
     if (settings.userDir) {
         dir = path.join(settings.userDir,"lib","icons");
-        var icons = scanIconDir(dir);
+        let icons = scanIconDir(dir);
         if (icons.length > 0) {
             iconList.push({path:dir,icons:icons});
         }
@@ -301,13 +357,9 @@ function getNodeFiles(disableNodePathScan) {
         nodeFiles = nodeFiles.concat(results.files);
         iconList = iconList.concat(results.icons);
     }
-    if (settings.nodesDir) {
-        dir = settings.nodesDir;
-        if (typeof settings.nodesDir == "string") {
-            dir = [dir];
-        }
-        for (var i=0;i<dir.length;i++) {
-            results = getLocalNodeFiles(dir[i]);
+    if (nodesDir) {
+        for (let i = 0; i < nodesDir.length; i++) {
+            results = getLocalNodeFiles(nodesDir[i], true);
             nodeFiles = nodeFiles.concat(results.files);
             iconList = iconList.concat(results.icons);
         }
@@ -479,7 +531,52 @@ function getPackageList() {
     }
     return list;
 }
-
+/**
+ * Gets the package json object for the supplied `dir`.  
+ * If there is no package.json or the `node-red` section is missing, `result.isNodeRedModule` will be `false`.
+ * If there is no package.json `isPackage` will be `false`.
+ * If an error occurs, `result.error` will contain the error.
+ * @param {string} dir The directory to inspect
+ */
+ function getPackageDetails(dir) {
+    const result = {
+        /** @type {string} The package directory */ 
+        moduleDir: dir,
+        /** @type {string} The full file path of package.json for this package */
+        packageFile: null,
+        /** @type {boolean} True if this is a valid node-red module */
+        isNodeRedModule: false,
+        /** @type {boolean} True if a package.json file is present */
+        isPackage: false,
+        /** @type {boolean} True if this a node-red module and passes the checks */
+        allowed: false,
+        /** @type {object} The contents of package.json */
+        package: null,
+    }
+    if (!dir) {  return result }
+    try {
+        const packagefile = path.join(dir,'package.json')
+        result.has_node_modules = fs.existsSync(path.join(dir,'node_modules'))
+        if(!fs.existsSync(packagefile)) {
+            return result
+        }
+        result.packageFile = packagefile
+        const pkg = require(packagefile)
+        result.package = pkg
+        if(result.package) {
+            result.allowed = true
+            result.isPackage = true
+            result.isNodeRedModule = typeof result.package['node-red'] === 'object'
+            if(result.isNodeRedModule) {
+                result.isNodeRedModule = true;
+                result.allowed = registryUtil.checkModuleAllowed(pkg.name,pkg.version,loadAllowList,loadDenyList) 
+            }
+        }
+    } catch(err) {
+        result.error = err; // this is not a package we are interested in!
+    }
+    return result || result;
+}
 module.exports = {
     init: init,
     getNodeFiles: getNodeFiles,
diff --git a/packages/node_modules/@node-red/registry/package.json b/packages/node_modules/@node-red/registry/package.json
index b5c1f8f99..f9ab44be8 100644
--- a/packages/node_modules/@node-red/registry/package.json
+++ b/packages/node_modules/@node-red/registry/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@node-red/registry",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "license": "Apache-2.0",
     "main": "./lib/index.js",
     "repository": {
@@ -16,11 +16,11 @@
         }
     ],
     "dependencies": {
-        "@node-red/util": "3.0.0-beta.1",
+        "@node-red/util": "3.0.0",
         "clone": "2.1.2",
         "fs-extra": "10.1.0",
         "semver": "7.3.7",
         "tar": "6.1.11",
-        "uglify-js": "3.15.4"
+        "uglify-js": "3.16.2"
     }
 }
diff --git a/packages/node_modules/@node-red/runtime/lib/api/diagnostics.js b/packages/node_modules/@node-red/runtime/lib/api/diagnostics.js
index 0293c7f97..cbf9fc9d7 100644
--- a/packages/node_modules/@node-red/runtime/lib/api/diagnostics.js
+++ b/packages/node_modules/@node-red/runtime/lib/api/diagnostics.js
@@ -165,7 +165,7 @@ function buildDiagnosticReport(scope, callback) {
 
     /** gets a sanitised list containing only the module name */
     function listContextModules() {
-        const keys = Object.keys(runtime.settings.contextStorage);
+        const keys = Object.keys(runtime.settings.contextStorage || {});
         const result = {};
         keys.forEach(e => {
             result[e] = {
diff --git a/packages/node_modules/@node-red/runtime/lib/api/flows.js b/packages/node_modules/@node-red/runtime/lib/api/flows.js
index d28a0479a..b91635201 100644
--- a/packages/node_modules/@node-red/runtime/lib/api/flows.js
+++ b/packages/node_modules/@node-red/runtime/lib/api/flows.js
@@ -255,5 +255,82 @@ var api = module.exports = {
             }
         }
         return sendCredentials;
-    }
+    },
+    /**
+    * Gets running state of runtime flows
+    * @param {Object} opts
+    * @param {User} opts.user - the user calling the api
+    * @param {Object} opts.req - the request to log (optional)
+    * @return {{state:string, started:boolean}} - the current run state of the flows
+    * @memberof @node-red/runtime_flows
+    */
+    getState: async function(opts) {
+        runtime.log.audit({event: "flows.getState"}, opts.req);
+        const result = {
+            state: runtime.flows.state()
+        }
+        return result;
+    },
+    /**
+    * Sets running state of runtime flows
+    * @param {Object} opts
+    * @param {Object} opts.req - the request to log (optional)
+    * @param {User} opts.user - the user calling the api
+    * @param {string} opts.state - the requested state. Valid values are "start" and "stop".
+    * @return {Promise<Flow>} - the active flow configuration
+    * @memberof @node-red/runtime_flows
+    */
+    setState: async function(opts) {
+        opts = opts || {};
+        const makeError = (error, errcode, statusCode) => {
+            const message = typeof error == "object" ? error.message : error
+            const err = typeof error == "object" ? error : new Error(message||"Unexpected Error")
+            err.status = err.status || statusCode || 400;
+            err.code = err.code || errcode || "unexpected_error"
+            runtime.log.audit({
+                event: "flows.setState",
+                state: opts.state || "",
+                error: errcode || "unexpected_error",
+                message: err.code
+            }, opts.req);
+            return err
+        }
+
+        const getState = () => {
+            return {
+                state: runtime.flows.state()
+            }
+        }
+
+        if(!runtime.settings.runtimeState || runtime.settings.runtimeState.enabled !== true) {
+            throw (makeError("Method Not Allowed", "not_allowed", 405))
+        }
+        switch (opts.state) {
+            case "start":
+                try {
+                    try {
+                        runtime.settings.set('runtimeFlowState', opts.state);
+                    } catch(err) {}
+                    if (runtime.settings.safeMode) {
+                        delete runtime.settings.safeMode
+                    }
+                    await runtime.flows.startFlows("full")
+                    return getState()
+                } catch (err) {
+                    throw (makeError(err, err.code, 500))
+                }
+            case "stop":
+                try {
+                    try {
+                        runtime.settings.set('runtimeFlowState', opts.state);
+                    } catch(err) {}
+                    await runtime.flows.stopFlows("full")
+                    return getState()
+                } catch (err) {
+                    throw (makeError(err, err.code, 500))
+                }
+            default:
+                throw (makeError(`Cannot change flows runtime state to '${opts.state}'}`, "invalid_run_state", 400))
+        }
+    },
 }
diff --git a/packages/node_modules/@node-red/runtime/lib/api/settings.js b/packages/node_modules/@node-red/runtime/lib/api/settings.js
index f56b8ab61..6c13596ce 100644
--- a/packages/node_modules/@node-red/runtime/lib/api/settings.js
+++ b/packages/node_modules/@node-red/runtime/lib/api/settings.js
@@ -91,7 +91,7 @@ var api = module.exports = {
             safeSettings.context = runtime.nodes.listContextStores();
             if (runtime.settings.editorTheme && runtime.settings.editorTheme.codeEditor) {
                 safeSettings.codeEditor = runtime.settings.editorTheme.codeEditor || {};
-                safeSettings.codeEditor.lib = safeSettings.codeEditor.lib || "ace";
+                safeSettings.codeEditor.lib = safeSettings.codeEditor.lib || "monaco";
                 safeSettings.codeEditor.options = safeSettings.codeEditor.options || {};
             }
             safeSettings.libraries = runtime.library.getLibraries();
@@ -148,6 +148,18 @@ var api = module.exports = {
                 enabled: (runtime.settings.diagnostics && runtime.settings.diagnostics.enabled === false) ? false : true,
                 ui: (runtime.settings.diagnostics && runtime.settings.diagnostics.ui === false) ? false : true
             }
+            if(safeSettings.diagnostics.enabled === false) {
+                safeSettings.diagnostics.ui = false; // cannot have UI without endpoint
+            }
+
+            safeSettings.runtimeState = {
+                //unless runtimeState.ui and runtimeState.enabled are explicitly true, they will default to false.
+                enabled: !!runtime.settings.runtimeState && runtime.settings.runtimeState.enabled === true,
+                ui: !!runtime.settings.runtimeState && runtime.settings.runtimeState.ui === true
+            }
+            if(safeSettings.runtimeState.enabled !== true) {
+                safeSettings.runtimeState.ui = false; // cannot have UI without endpoint
+            }
 
             runtime.settings.exportNodeSettings(safeSettings);
             runtime.plugins.exportPluginSettings(safeSettings);
diff --git a/packages/node_modules/@node-red/runtime/lib/flows/Subflow.js b/packages/node_modules/@node-red/runtime/lib/flows/Subflow.js
index 2e2beed74..824b88a28 100644
--- a/packages/node_modules/@node-red/runtime/lib/flows/Subflow.js
+++ b/packages/node_modules/@node-red/runtime/lib/flows/Subflow.js
@@ -390,7 +390,6 @@ class Subflow extends Flow {
             }
             name = newName;
         }
-        
 
         var parent = this.parent;
         if (parent) {
diff --git a/packages/node_modules/@node-red/runtime/lib/flows/index.js b/packages/node_modules/@node-red/runtime/lib/flows/index.js
index ae9131ec0..1b5476a3f 100644
--- a/packages/node_modules/@node-red/runtime/lib/flows/index.js
+++ b/packages/node_modules/@node-red/runtime/lib/flows/index.js
@@ -36,6 +36,8 @@ var activeFlowConfig = null;
 
 var activeFlows = {};
 var started = false;
+var state = 'stop'
+
 var credentialsPendingReset = false;
 
 var activeNodesToFlow = {};
@@ -50,6 +52,7 @@ function init(runtime) {
     storage = runtime.storage;
     log = runtime.log;
     started = false;
+    state = 'stop';
     if (!typeEventRegistered) {
         events.on('type-registered',function(type) {
             if (activeFlowConfig && activeFlowConfig.missingTypes.length > 0) {
@@ -214,19 +217,26 @@ function setFlows(_config,_credentials,type,muteLog,forceStart,user) {
             // Flows are running (or should be)
 
             // Stop the active flows (according to deploy type and the diff)
-            return stop(type,diff,muteLog).then(() => {
+            return stop(type,diff,muteLog,true).then(() => {
                 // Once stopped, allow context to remove anything no longer needed
                 return context.clean(activeFlowConfig)
             }).then(() => {
+                if (!isLoad) {
+                    log.info(log._("nodes.flows.updated-flows"));
+                }
                 // Start the active flows
-                start(type,diff,muteLog).then(() => {
+                start(type,diff,muteLog,true).then(() => {
                     events.emit("runtime-event",{id:"runtime-deploy",payload:{revision:flowRevision},retain: true});
                 });
                 // Return the new revision asynchronously to the actual start
                 return flowRevision;
             }).catch(function(err) { })
         } else {
+            if (!isLoad) {
+                log.info(log._("nodes.flows.updated-flows"));
+            }
             events.emit("runtime-event",{id:"runtime-deploy",payload:{revision:flowRevision},retain: true});
+            return flowRevision;
         }
     });
 }
@@ -259,9 +269,10 @@ function getFlows() {
     return activeConfig;
 }
 
-async function start(type,diff,muteLog) {
-    type = type||"full";
+async function start(type,diff,muteLog,isDeploy) {
+    type = type || "full";
     started = true;
+    state = 'start'
     var i;
     // If there are missing types, report them, emit the necessary runtime event and return
     if (activeFlowConfig.missingTypes.length > 0) {
@@ -283,7 +294,7 @@ async function start(type,diff,muteLog) {
             log.info(log._("nodes.flows.missing-type-install-2"));
             log.info("  "+settings.userDir);
         }
-        events.emit("runtime-event",{id:"runtime-state",payload:{error:"missing-types", type:"warning",text:"notification.warnings.missing-types",types:activeFlowConfig.missingTypes},retain:true});
+        events.emit("runtime-event",{id:"runtime-state",payload:{state: 'stop', error:"missing-types", type:"warning",text:"notification.warnings.missing-types",types:activeFlowConfig.missingTypes},retain:true});
         return;
     }
 
@@ -297,7 +308,7 @@ async function start(type,diff,muteLog) {
             missingModules.push({module:err[i].module.module, error: err[i].error.code || err[i].error.toString()})
             log.info(` - ${err[i].module.spec} [${err[i].error.code || "unknown_error"}]`);
         }
-        events.emit("runtime-event",{id:"runtime-state",payload:{error:"missing-modules", type:"warning",text:"notification.warnings.missing-modules",modules:missingModules},retain:true});
+        events.emit("runtime-event",{id:"runtime-state",payload:{state: 'stop', error:"missing-modules", type:"warning",text:"notification.warnings.missing-modules",modules:missingModules},retain:true});
         return;
     }
 
@@ -306,10 +317,23 @@ async function start(type,diff,muteLog) {
         log.info("*****************************************************************")
         log.info(log._("nodes.flows.safe-mode"));
         log.info("*****************************************************************")
-        events.emit("runtime-event",{id:"runtime-state",payload:{error:"safe-mode", type:"warning",text:"notification.warnings.safe-mode"},retain:true});
+        state = 'safe'
+        events.emit("runtime-event",{id:"runtime-state",payload:{state: 'safe', error:"safe-mode", type:"warning",text:"notification.warnings.safe-mode"},retain:true});
         return;
     }
 
+    let runtimeState
+    try {
+        runtimeState = settings.get('runtimeFlowState') || 'start'
+    } catch (err) {}
+    if (runtimeState === 'stop') {
+        log.info(log._("nodes.flows.stopped-flows"));
+        events.emit("runtime-event",{id:"runtime-state",payload:{ state: 'stop', deploy:isDeploy },retain:true});
+        state = 'stop'
+        started = false
+        return
+    }
+
     if (!muteLog) {
         if (type !== "full") {
             log.info(log._("nodes.flows.starting-modified-"+type));
@@ -364,12 +388,10 @@ async function start(type,diff,muteLog) {
             }
         }
     }
-    // Having created or updated all flows, now start them.
     for (id in activeFlows) {
         if (activeFlows.hasOwnProperty(id)) {
             try {
                 activeFlows[id].start(diff);
-
                 // Create a map of node id to flow id and also a subflowInstance lookup map
                 var activeNodes = activeFlows[id].getActiveNodes();
                 Object.keys(activeNodes).forEach(function(nid) {
@@ -387,7 +409,7 @@ async function start(type,diff,muteLog) {
     if (credentialsPendingReset === true) {
         credentialsPendingReset = false;
     } else {
-        events.emit("runtime-event",{id:"runtime-state",retain:true});
+        events.emit("runtime-event",{id:"runtime-state", payload:{ state: 'start', deploy:isDeploy}, retain:true});
     }
 
     if (!muteLog) {
@@ -400,7 +422,7 @@ async function start(type,diff,muteLog) {
     return;
 }
 
-function stop(type,diff,muteLog) {
+function stop(type,diff,muteLog,isDeploy) {
     if (!started) {
         return Promise.resolve();
     }
@@ -420,6 +442,7 @@ function stop(type,diff,muteLog) {
         }
     }
     started = false;
+    state = 'stop'
     var promises = [];
     var stopList;
     var removedList = diff.removed;
@@ -471,6 +494,8 @@ function stop(type,diff,muteLog) {
             }
         }
         events.emit("flows:stopped",{config: activeConfig, type: type, diff: diff});
+
+        events.emit("runtime-event",{ id:"runtime-state", payload:{ state: 'stop', deploy:isDeploy }, retain:true });
         // Deprecated event
         events.emit("nodes-stopped");
     });
@@ -790,7 +815,7 @@ module.exports = {
     stopFlows: stop,
 
     get started() { return started },
-
+    state: () => { return state },
     // handleError: handleError,
     // handleStatus: handleStatus,
 
diff --git a/packages/node_modules/@node-red/runtime/lib/index.js b/packages/node_modules/@node-red/runtime/lib/index.js
index 8e1d2b487..88b3b8293 100644
--- a/packages/node_modules/@node-red/runtime/lib/index.js
+++ b/packages/node_modules/@node-red/runtime/lib/index.js
@@ -215,7 +215,7 @@ function start() {
                     }
                 }
                 return redNodes.loadContextsPlugin().then(function () {
-                    redNodes.loadFlows().then(redNodes.startFlows).catch(function(err) {});
+                    redNodes.loadFlows().then(() => { redNodes.startFlows() }).catch(function(err) {});
                     started = true;
                 });
             });
@@ -399,12 +399,12 @@ module.exports = {
     * @memberof @node-red/runtime
     */
     version: externalAPI.version,
-    
+
     /**
     * @memberof @node-red/diagnostics
     */
     diagnostics:externalAPI.diagnostics,
-    
+
     storage: storage,
     events: events,
     hooks: hooks,
diff --git a/packages/node_modules/@node-red/runtime/lib/nodes/credentials.js b/packages/node_modules/@node-red/runtime/lib/nodes/credentials.js
index 0432e01fb..305594c85 100644
--- a/packages/node_modules/@node-red/runtime/lib/nodes/credentials.js
+++ b/packages/node_modules/@node-red/runtime/lib/nodes/credentials.js
@@ -373,11 +373,13 @@ var api = module.exports = {
 
                     }
                 }
-                for (cred in savedCredentials) {
-                    if (savedCredentials.hasOwnProperty(cred)) {
-                        if (!newCreds.hasOwnProperty(cred)) {
-                            delete savedCredentials[cred];
-                            dirty = true;
+                if (/^subflow(:|$)/.test(nodeType)) {
+                    for (cred in savedCredentials) {
+                        if (savedCredentials.hasOwnProperty(cred)) {
+                            if (!newCreds.hasOwnProperty(cred)) {
+                                delete savedCredentials[cred];
+                                dirty = true;
+                            }
                         }
                     }
                 }
diff --git a/packages/node_modules/@node-red/runtime/locales/en-US/runtime.json b/packages/node_modules/@node-red/runtime/locales/en-US/runtime.json
index cb2e08aab..ecd010abb 100644
--- a/packages/node_modules/@node-red/runtime/locales/en-US/runtime.json
+++ b/packages/node_modules/@node-red/runtime/locales/en-US/runtime.json
@@ -8,7 +8,6 @@
             "httpStatic": "HTTP Static    : __path__"
         }
     },
-
     "server": {
         "loading": "Loading palette nodes",
         "palette-editor": {
@@ -61,7 +60,6 @@
             "function-required": "httpsRefreshInterval requires https property to be a function"
         }
     },
-
     "api": {
         "flows": {
             "error-save": "Error saving flows: __message__",
@@ -79,18 +77,16 @@
             "error-enable": "Failed to enable node:"
         }
     },
-
     "comms": {
         "error": "Communication channel error: __message__",
         "error-server": "Communication server error: __message__",
         "error-send": "Communication send error: __message__"
     },
-
     "settings": {
         "user-not-available": "Cannot save user settings: __message__",
         "not-available": "Settings not available",
         "property-read-only": "Property '__prop__' is read-only",
-        "readonly-mode" : "Runtime in read-only mode. Changes will not be saved."
+        "readonly-mode": "Runtime in read-only mode. Changes will not be saved."
     },
     "library": {
         "unknownLibrary": "Unknown library: __library__",
@@ -101,12 +97,12 @@
     },
     "nodes": {
         "credentials": {
-            "error":"Error loading credentials: __message__",
-            "error-saving":"Error saving credentials: __message__",
+            "error": "Error loading credentials: __message__",
+            "error-saving": "Error saving credentials: __message__",
             "not-registered": "Credential type '__type__' is not registered",
             "system-key-warning": "\n\n---------------------------------------------------------------------\nYour flow credentials file is encrypted using a system-generated key.\n\nIf the system-generated key is lost for any reason, your credentials\nfile will not be recoverable, you will have to delete it and re-enter\nyour credentials.\n\nYou should set your own key using the 'credentialSecret' option in\nyour settings file. Node-RED will then re-encrypt your credentials\nfile using your chosen key the next time you deploy a change.\n---------------------------------------------------------------------\n",
-            "unencrypted" : "Using unencrypted credentials",
-            "encryptedNotFound" : "Encrypted credentials not found"
+            "unencrypted": "Using unencrypted credentials",
+            "encryptedNotFound": "Encrypted credentials not found"
         },
         "flows": {
             "safe-mode": "Flows stopped in safe mode. Deploy to start.",
@@ -126,6 +122,7 @@
             "stopped-flows": "Stopped flows",
             "stopped": "Stopped",
             "stopping-error": "Error stopping node: __message__",
+            "updated-flows": "Updated flows",
             "added-flow": "Adding flow: __label__",
             "updated-flow": "Updated flow: __label__",
             "removed-flow": "Removed flow: __label__",
@@ -150,7 +147,6 @@
             }
         }
     },
-
     "storage": {
         "index": {
             "forbidden-flow-name": "forbidden flow name"
@@ -180,7 +176,6 @@
             }
         }
     },
-
     "context": {
         "log-store-init": "Context store  : '__name__' [__info__]",
         "error-loading-module": "Error loading context store: __message__",
@@ -195,5 +190,4 @@
             "error-write": "Error writing context: __message__"
         }
     }
-
 }
diff --git a/packages/node_modules/@node-red/runtime/locales/ja/runtime.json b/packages/node_modules/@node-red/runtime/locales/ja/runtime.json
index fdf8b2249..bb5b0badc 100644
--- a/packages/node_modules/@node-red/runtime/locales/ja/runtime.json
+++ b/packages/node_modules/@node-red/runtime/locales/ja/runtime.json
@@ -100,7 +100,9 @@
             "error": "クレデンシャルの読み込みエラー: __message__",
             "error-saving": "クレデンシャルの保存エラー: __message__",
             "not-registered": "クレデンシャル '__type__' は登録されていません",
-            "system-key-warning": "\n\n---------------------------------------------------------------------\nフローのクレデンシャルファイルはシステム生成キーで暗号化されています。\n\nシステム生成キーを何らかの理由で失った場合、クレデンシャルファイルを\n復元することはできません。その場合、ファイルを削除してクレデンシャルを\n再入力しなければなりません。\n\n設定ファイル内で 'credentialSecret' オプションを使って独自キーを設定\nします。変更を次にデプロイする際、Node-REDは選択したキーを用いてクレ\nデンシャルを再暗号化します。 \n\n---------------------------------------------------------------------\n"
+            "system-key-warning": "\n\n---------------------------------------------------------------------\nフローのクレデンシャルファイルはシステム生成キーで暗号化されています。\n\nシステム生成キーを何らかの理由で失った場合、クレデンシャルファイルを\n復元することはできません。その場合、ファイルを削除してクレデンシャルを\n再入力しなければなりません。\n\n設定ファイル内で 'credentialSecret' オプションを使って独自キーを設定\nします。変更を次にデプロイする際、Node-REDは選択したキーを用いてクレ\nデンシャルを再暗号化します。 \n\n---------------------------------------------------------------------\n",
+            "unencrypted": "暗号化されていないクレデンシャルを使用",
+            "encryptedNotFound": "暗号化されたクレデンシャルが存在しません"
         },
         "flows": {
             "safe-mode": "セーフモードでフローを停止しました。開始するためにはデプロイしてください",
@@ -120,6 +122,7 @@
             "stopped-flows": "フローを停止しました",
             "stopped": "停止しました",
             "stopping-error": "ノードの停止に失敗しました: __message__",
+            "updated-flows": "フローを更新しました",
             "added-flow": "フローを追加します: __label__",
             "updated-flow": "フローを更新しました: __label__",
             "removed-flow": "フローを削除しました: __label__",
diff --git a/packages/node_modules/@node-red/runtime/package.json b/packages/node_modules/@node-red/runtime/package.json
index 6589ef675..f33cb5175 100644
--- a/packages/node_modules/@node-red/runtime/package.json
+++ b/packages/node_modules/@node-red/runtime/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@node-red/runtime",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "license": "Apache-2.0",
     "main": "./lib/index.js",
     "repository": {
@@ -16,8 +16,8 @@
         }
     ],
     "dependencies": {
-        "@node-red/registry": "3.0.0-beta.1",
-        "@node-red/util": "3.0.0-beta.1",
+        "@node-red/registry": "3.0.0",
+        "@node-red/util": "3.0.0",
         "async-mutex": "0.3.2",
         "clone": "2.1.2",
         "express": "4.18.1",
diff --git a/packages/node_modules/@node-red/util/lib/util.js b/packages/node_modules/@node-red/util/lib/util.js
index a6fec8f98..d82de0d1d 100644
--- a/packages/node_modules/@node-red/util/lib/util.js
+++ b/packages/node_modules/@node-red/util/lib/util.js
@@ -641,7 +641,12 @@ function evaluateNodeProperty(value, type, node, msg, callback) {
         result = Date.now();
     } else if (type === 'bin') {
         var data = JSON.parse(value);
-        result = Buffer.from(data);
+        if (Array.isArray(data) || (typeof(data) === "string")) {
+            result = Buffer.from(data);
+        }
+        else {
+            throw createError("INVALID_BUFFER_DATA", "Not string or array");
+        }
     } else if (type === 'msg' && msg) {
         try {
             result = getMessageProperty(msg,value);
diff --git a/packages/node_modules/@node-red/util/package.json b/packages/node_modules/@node-red/util/package.json
index 5e1972fb9..9ce885200 100644
--- a/packages/node_modules/@node-red/util/package.json
+++ b/packages/node_modules/@node-red/util/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@node-red/util",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "license": "Apache-2.0",
     "repository": {
         "type": "git",
@@ -16,11 +16,11 @@
     ],
     "dependencies": {
         "fs-extra": "10.1.0",
-        "i18next": "21.6.16",
+        "i18next": "21.8.14",
         "json-stringify-safe": "5.0.1",
         "jsonata": "1.8.6",
         "lodash.clonedeep": "^4.5.0",
-        "moment": "2.29.3",
+        "moment": "2.29.4",
         "moment-timezone": "0.5.34"
     }
 }
diff --git a/packages/node_modules/node-red/package.json b/packages/node_modules/node-red/package.json
index fc3aae90a..dfd98f6fb 100644
--- a/packages/node_modules/node-red/package.json
+++ b/packages/node_modules/node-red/package.json
@@ -1,6 +1,6 @@
 {
     "name": "node-red",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0",
     "description": "Low-code programming for event-driven applications",
     "homepage": "http://nodered.org",
     "license": "Apache-2.0",
@@ -31,10 +31,10 @@
         "flow"
     ],
     "dependencies": {
-        "@node-red/editor-api": "3.0.0-beta.1",
-        "@node-red/runtime": "3.0.0-beta.1",
-        "@node-red/util": "3.0.0-beta.1",
-        "@node-red/nodes": "3.0.0-beta.1",
+        "@node-red/editor-api": "3.0.0",
+        "@node-red/runtime": "3.0.0",
+        "@node-red/util": "3.0.0",
+        "@node-red/nodes": "3.0.0",
         "basic-auth": "2.0.1",
         "bcryptjs": "2.4.3",
         "express": "4.18.1",
diff --git a/packages/node_modules/node-red/settings.js b/packages/node_modules/node-red/settings.js
index 2e2b7035e..ec247a672 100644
--- a/packages/node_modules/node-red/settings.js
+++ b/packages/node_modules/node-red/settings.js
@@ -242,6 +242,7 @@ module.exports = {
 /*******************************************************************************
  * Runtime Settings
  *  - lang
+ *  - runtimeState
  *  - diagnostics
  *  - logging
  *  - contextStorage
@@ -249,93 +250,105 @@ module.exports = {
  *  - externalModules
  ******************************************************************************/
 
-     /** Uncomment the following to run node-red in your preferred language.
-      * Available languages include: en-US (default), ja, de, zh-CN, zh-TW, ru, ko
-      * Some languages are more complete than others.
-      */
-     // lang: "de",
+    /** Uncomment the following to run node-red in your preferred language.
+     * Available languages include: en-US (default), ja, de, zh-CN, zh-TW, ru, ko
+     * Some languages are more complete than others.
+     */
+    // lang: "de",
 
     /** Configure diagnostics options 
      * - enabled:  When `enabled` is `true` (or unset), diagnostics data will
      *   be available at http://localhost:1880/diagnostics  
      * - ui: When `ui` is `true` (or unset), the action `show-system-info` will 
      *   be available to logged in users of node-red editor  
-    */ 
+    */
     diagnostics: {
         /** enable or disable diagnostics endpoint. Must be set to `false` to disable */
         enabled: true,
         /** enable or disable diagnostics display in the node-red editor. Must be set to `false` to disable */
         ui: true,
     },
+    /** Configure runtimeState options 
+     * - enabled:  When `enabled` is `true` flows runtime can be Started/Stoped 
+     *   by POSTing to available at http://localhost:1880/flows/state  
+     * - ui: When `ui` is `true`, the action `core:start-flows` and 
+     *   `core:stop-flows` will be available to logged in users of node-red editor
+     *   Also, the deploy menu (when set to default) will show a stop or start button
+     */
+    runtimeState: {
+        /** enable or disable flows/state endpoint. Must be set to `false` to disable */
+        enabled: false,
+        /** show or hide runtime stop/start options in the node-red editor. Must be set to `false` to hide */
+        ui: false,
+    },
+    /** Configure the logging output */
+    logging: {
+        /** Only console logging is currently supported */
+        console: {
+            /** Level of logging to be recorded. Options are:
+             * fatal - only those errors which make the application unusable should be recorded
+             * error - record errors which are deemed fatal for a particular request + fatal errors
+             * warn - record problems which are non fatal + errors + fatal errors
+             * info - record information about the general running of the application + warn + error + fatal errors
+             * debug - record information which is more verbose than info + info + warn + error + fatal errors
+             * trace - record very detailed logging + debug + info + warn + error + fatal errors
+             * off - turn off all logging (doesn't affect metrics or audit)
+             */
+            level: "info",
+            /** Whether or not to include metric events in the log output */
+            metrics: false,
+            /** Whether or not to include audit events in the log output */
+            audit: false
+        }
+    },
 
-     /** Configure the logging output */
-     logging: {
-         /** Only console logging is currently supported */
-         console: {
-             /** Level of logging to be recorded. Options are:
-              * fatal - only those errors which make the application unusable should be recorded
-              * error - record errors which are deemed fatal for a particular request + fatal errors
-              * warn - record problems which are non fatal + errors + fatal errors
-              * info - record information about the general running of the application + warn + error + fatal errors
-              * debug - record information which is more verbose than info + info + warn + error + fatal errors
-              * trace - record very detailed logging + debug + info + warn + error + fatal errors
-              * off - turn off all logging (doesn't affect metrics or audit)
-              */
-             level: "info",
-             /** Whether or not to include metric events in the log output */
-             metrics: false,
-             /** Whether or not to include audit events in the log output */
-             audit: false
-         }
-     },
+    /** Context Storage
+     * The following property can be used to enable context storage. The configuration
+     * provided here will enable file-based context that flushes to disk every 30 seconds.
+     * Refer to the documentation for further options: https://nodered.org/docs/api/context/
+     */
+    //contextStorage: {
+    //    default: {
+    //        module:"localfilesystem"
+    //    },
+    //},
 
-     /** Context Storage
-      * The following property can be used to enable context storage. The configuration
-      * provided here will enable file-based context that flushes to disk every 30 seconds.
-      * Refer to the documentation for further options: https://nodered.org/docs/api/context/
-      */
-     //contextStorage: {
-     //    default: {
-     //        module:"localfilesystem"
-     //    },
-     //},
+    /** `global.keys()` returns a list of all properties set in global context.
+     * This allows them to be displayed in the Context Sidebar within the editor.
+     * In some circumstances it is not desirable to expose them to the editor. The
+     * following property can be used to hide any property set in `functionGlobalContext`
+     * from being list by `global.keys()`.
+     * By default, the property is set to false to avoid accidental exposure of
+     * their values. Setting this to true will cause the keys to be listed.
+     */
+    exportGlobalContextKeys: false,
 
-     /** `global.keys()` returns a list of all properties set in global context.
-      * This allows them to be displayed in the Context Sidebar within the editor.
-      * In some circumstances it is not desirable to expose them to the editor. The
-      * following property can be used to hide any property set in `functionGlobalContext`
-      * from being list by `global.keys()`.
-      * By default, the property is set to false to avoid accidental exposure of
-      * their values. Setting this to true will cause the keys to be listed.
-      */
-     exportGlobalContextKeys: false,
-
-     /** Configure how the runtime will handle external npm modules.
-      * This covers:
-      *  - whether the editor will allow new node modules to be installed
-      *  - whether nodes, such as the Function node are allowed to have their
-      * own dynamically configured dependencies.
-      * The allow/denyList options can be used to limit what modules the runtime
-      * will install/load. It can use '*' as a wildcard that matches anything.
-      */
-     externalModules: {
-         // autoInstall: false,   /** Whether the runtime will attempt to automatically install missing modules */
-         // autoInstallRetry: 30, /** Interval, in seconds, between reinstall attempts */
-         // palette: {              /** Configuration for the Palette Manager */
-         //     allowInstall: true, /** Enable the Palette Manager in the editor */
-         //     allowUpdate: true,  /** Allow modules to be updated in the Palette Manager */
-         //     allowUpload: true,  /** Allow module tgz files to be uploaded and installed */
-         //     allowList: ['*'],
-         //     denyList: [],
-         //     allowUpdateList: ['*'],
-         //     denyUpdateList: []
-         // },
-         // modules: {              /** Configuration for node-specified modules */
-         //     allowInstall: true,
-         //     allowList: [],
-         //     denyList: []
-         // }
-     },
+    /** Configure how the runtime will handle external npm modules.
+     * This covers:
+     *  - whether the editor will allow new node modules to be installed
+     *  - whether nodes, such as the Function node are allowed to have their
+     * own dynamically configured dependencies.
+     * The allow/denyList options can be used to limit what modules the runtime
+     * will install/load. It can use '*' as a wildcard that matches anything.
+     */
+    externalModules: {
+        // autoInstall: false,   /** Whether the runtime will attempt to automatically install missing modules */
+        // autoInstallRetry: 30, /** Interval, in seconds, between reinstall attempts */
+        // palette: {              /** Configuration for the Palette Manager */
+        //     allowInstall: true, /** Enable the Palette Manager in the editor */
+        //     allowUpdate: true,  /** Allow modules to be updated in the Palette Manager */
+        //     allowUpload: true,  /** Allow module tgz files to be uploaded and installed */
+        //     allowList: ['*'],
+        //     denyList: [],
+        //     allowUpdateList: ['*'],
+        //     denyUpdateList: []
+        // },
+        // modules: {              /** Configuration for node-specified modules */
+        //     allowInstall: true,
+        //     allowList: [],
+        //     denyList: []
+        // }
+    },
 
 
 /*******************************************************************************
@@ -401,7 +414,7 @@ module.exports = {
                  * packages/node_modules/@node-red/editor-client/src/vendor/monaco/dist/theme
                  * e.g. "tomorrow-night", "upstream-sunburst", "github", "my-theme"
                  */
-                theme: "vs",
+                // theme: "vs",
                 /** other overrides can be set e.g. fontSize, fontFamily, fontLigatures etc.
                  * for the full list, see https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.IStandaloneEditorConstructionOptions.html
                  */
diff --git a/scripts/build-custom-theme.js b/scripts/build-custom-theme.js
index e16b35e8b..3a904fea8 100644
--- a/scripts/build-custom-theme.js
+++ b/scripts/build-custom-theme.js
@@ -83,7 +83,7 @@ while((match = ruleRegex.exec(colorsFile)) !== null) {
 
     const result = sass.renderSync({
         outputStyle: "expanded",
-        file: path.join(workingDir,"style.scss"),
+        file: path.join(workingDir,"style-custom-theme.scss"),
     });
 
     const css = result.css.toString()
diff --git a/scripts/generate-publish-script.js b/scripts/generate-publish-script.js
index 0c64cb832..82d98ea3c 100644
--- a/scripts/generate-publish-script.js
+++ b/scripts/generate-publish-script.js
@@ -4,7 +4,7 @@ const path = require("path");
 const fs = require("fs-extra");
 const should = require("should");
 
-const LATEST = "2";
+const LATEST = "3";
 
 function generateScript() {
     return new Promise((resolve, reject) => {
diff --git a/test/nodes/core/common/20-inject_spec.js b/test/nodes/core/common/20-inject_spec.js
index cb14690d0..a4dbdd9e4 100644
--- a/test/nodes/core/common/20-inject_spec.js
+++ b/test/nodes/core/common/20-inject_spec.js
@@ -906,6 +906,7 @@ describe('inject node', function() {
                     msg.should.have.property("str1", "1"); //injected prop
                     msg.should.have.property("num1", 1); //injected prop
                     msg.should.have.property("bool1", true); //injected prop
+                    msg.should.have.property("jsonata1", "AB"); //injected prop
 
                     helper.clearFlows().then(function() {
                         done();
@@ -919,6 +920,7 @@ describe('inject node', function() {
                         {p:"str1", v:"1", vt:"str"}, //new prop
                         {p:"num1", v:"1", vt:"num"}, //new prop
                         {p:"bool1", v:"true", vt:"bool"}, //new prop
+                        {p:"jsonata1", v:'"A" & "B"', vt:"jsonata"}, //new prop
                     ]})
                     .expect(200).end(function(err) {
                         if (err) {
diff --git a/test/nodes/core/common/60-link_spec.js b/test/nodes/core/common/60-link_spec.js
index 63733455c..be7ffc39f 100644
--- a/test/nodes/core/common/60-link_spec.js
+++ b/test/nodes/core/common/60-link_spec.js
@@ -17,6 +17,7 @@
 var should = require("should");
 var linkNode = require("nr-test-utils").require("@node-red/nodes/core/common/60-link.js");
 var helper = require("node-red-node-test-helper");
+var clone = require("clone");
 
 describe('link Node', function() {
 
@@ -319,6 +320,48 @@ describe('link Node', function() {
                 linkCall.receive({ payload: "hello", target: "double payload" });
             });
         })
+        it('should not raise error after deploying a name change to a duplicate link-in node', async function () {
+            this.timeout(400);
+            const flow = [
+                { id: "tab-flow-1", type: "tab", label: "Flow 1" },
+                { id: "link-in-1", z: "tab-flow-1", type: "link in", name: "duplicate", wires: [["link-out-1"]] },
+                { id: "link-in-2", z: "tab-flow-1", type: "link in", name: "duplicate", wires: [["link-out-1"]] }, //duplicate name
+                { id: "link-out-1", z: "tab-flow-1", type: "link out", mode: "return" },
+                { id: "link-call", z: "tab-flow-1", type: "link call", linkType: "dynamic", links: [], wires: [["n4"]] },
+                { id: "n4", z: "tab-flow-1", type: "helper" }
+            ];
+
+            await helper.load(linkNode, flow)
+
+            const linkIn2before = helper.getNode("link-in-2");
+            linkIn2before.should.have.property("name", "duplicate") // check link-in-2 has been deployed with the duplicate name
+
+            //modify the flow and deploy change
+            const newConfig = clone(flow);
+            newConfig[2].name = "add" // change nodes name
+            await helper.setFlows(newConfig, "nodes") // deploy "nodes" only
+
+            const helperNode = helper.getNode("n4");
+            const linkCall2 = helper.getNode("link-call");
+            const linkIn2after = helper.getNode("link-in-2");
+            linkIn2after.should.have.property("name", "add") // check link-in-2 no longer has a duplicate name
+
+            //poke { payload: "hello", target: "add" } into the link-call node and 
+            //ensure that a message arrives via the link-in node named "add"
+            await new Promise((resolve, reject) => {
+                helperNode.on("input", function (msg) {
+                    try {
+                        msg.should.have.property("target", "add");
+                        msg.should.not.have.property("error");
+                        resolve()
+                    } catch (err) {
+                        reject(err);
+                    }
+                });
+                linkCall2.receive({ payload: "hello", target: "add" });
+            });
+
+        })
         it('should allow nested link-call flows', function(done) {
             this.timeout(500);
             var flow = [/** Multiply by 2 link flow **/
diff --git a/test/nodes/core/function/80-template_spec.js b/test/nodes/core/function/80-template_spec.js
index e944824b3..b4f530d05 100644
--- a/test/nodes/core/function/80-template_spec.js
+++ b/test/nodes/core/function/80-template_spec.js
@@ -144,6 +144,28 @@ describe('template node', function() {
         });
     });
 
+    describe('env var', function() {
+        before(function() {
+            process.env.TEST = 'xyzzy';
+        })
+        after(function() {
+            delete process.env.TEST;
+        })
+
+        it('should modify payload from env variable', function(done) {
+            var flow = [{id:"n1",z:"t1", type:"template", field:"payload", template:"payload={{env.TEST}}",wires:[["n2"]]},{id:"n2",z:"t1",type:"helper"}];
+            helper.load(templateNode, flow, function() {
+                var n1 = helper.getNode("n1");
+                var n2 = helper.getNode("n2");
+                n2.on("input", function(msg) {
+                    msg.should.have.property('payload', 'payload=xyzzy');
+                    done();
+                });
+                n1.receive({payload:"foo",topic: "bar"});
+            });
+        });
+    });
+
     it('should modify payload from flow context', function(done) {
         var flow = [{id:"n1",z:"t1", type:"template", field:"payload", template:"payload={{flow.value}}",wires:[["n2"]]},{id:"n2",z:"t1",type:"helper"}];
         helper.load(templateNode, flow, function() {
diff --git a/test/nodes/core/parsers/70-CSV_spec.js b/test/nodes/core/parsers/70-CSV_spec.js
index cb8d7ca09..93d59a171 100644
--- a/test/nodes/core/parsers/70-CSV_spec.js
+++ b/test/nodes/core/parsers/70-CSV_spec.js
@@ -693,19 +693,19 @@ describe('CSV node', function() {
     describe('json object to csv', function() {
 
         it('should convert a simple object back to a csv', function(done) {
-            var flow = [ { id:"n1", type:"csv", temp:"a,b,c,,e", wires:[["n2"]] },
+            var flow = [ { id:"n1", type:"csv", temp:"a,b,c,,e,f", wires:[["n2"]] },
                 {id:"n2", type:"helper"} ];
             helper.load(csvNode, flow, function() {
                 var n1 = helper.getNode("n1");
                 var n2 = helper.getNode("n2");
                 n2.on("input", function(msg) {
                     try {
-                        msg.should.have.property('payload', '4,foo,true,,0\n');
+                        msg.should.have.property('payload', '4,foo,true,,0,"Hello\nWorld"\n');
                         done();
                     }
                     catch(e) { done(e); }
                 });
-                var testJson = { e:0, d:1, b:"foo", c:true, a:4 };
+                var testJson = { e:0, d:1, b:"foo", c:true, a:4, f:"Hello\nWorld" };
                 n1.emit("input", {payload:testJson});
             });
         });
@@ -777,7 +777,7 @@ describe('CSV node', function() {
                     }
                     catch(e) { done(e); }
                 });
-                var testJson = [{ d: 1, b: 3, c: 2, a: 4 },{d:4,a:1,c:3,b:2}];
+                var testJson = [{ d:1, b:3, c:2, a:4 },{d:4, a:1, c:3, b:2}];
                 n1.emit("input", {payload:testJson});
             });
         });
@@ -790,12 +790,12 @@ describe('CSV node', function() {
                 var n2 = helper.getNode("n2");
                 n2.on("input", function(msg) {
                     try {
-                        msg.should.have.property('payload', 'a,b,c,d\n4,3,2,1\n1,2,3,4\n');
+                        msg.should.have.property('payload', 'a,b,c,d\n4,3,2,1\n1,2,3,"a\nb"\n');
                         done();
                     }
                     catch(e) { done(e); }
                 });
-                var testJson = [{ d: 1, b: 3, c: 2, a: 4 },{d:4,a:1,c:3,b:2}];
+                var testJson = [{ d:1, b:3, c:2, a:4 },{d:"a\nb", a:1, c:3, b:2}];
                 n1.emit("input", {payload:testJson});
             });
         });
@@ -826,12 +826,12 @@ describe('CSV node', function() {
                 var n2 = helper.getNode("n2");
                 n2.on("input", function(msg) {
                     try {
-                        msg.should.have.property('payload', 'd,b,c,a\n1,3,2,4\n4,2,3,1\n');
+                        msg.should.have.property('payload', 'd,b,c,a\n1,3,2,4\n4,"f\ng",3,1\n');
                         done();
                     }
                     catch(e) { done(e); }
                 });
-                var testJson = [{ d: 1, b: 3, c: 2, a: 4 },{d:4,a:1,c:3,b:2}];
+                var testJson = [{ d: 1, b: 3, c: 2, a: 4 },{d:4,a:1,c:3,b:"f\ng"}];
                 n1.emit("input", {payload:testJson});
             });
         });
@@ -844,12 +844,12 @@ describe('CSV node', function() {
                 var n2 = helper.getNode("n2");
                 n2.on("input", function(msg) {
                     try {
-                        msg.should.have.property('payload', ',0,1,foo,"ba""r","di,ng"\n');
+                        msg.should.have.property('payload', ',0,1,foo,"ba""r","di,ng","fa\nba"\n');
                         done();
                     }
                     catch(e) { done(e); }
                 });
-                var testJson = ["",0,1,"foo",'ba"r','di,ng'];
+                var testJson = ["",0,1,"foo",'ba"r','di,ng',"fa\nba"];
                 n1.emit("input", {payload:testJson});
             });
         });
@@ -898,12 +898,12 @@ describe('CSV node', function() {
                 var n2 = helper.getNode("n2");
                 n2.on("input", function(msg) {
                     try {
-                        msg.should.have.property('payload', 'col1,col2,col3,col4\r\nH1,H2,H3,H4\r\nA,B,,\r\nA,,C,\r\nA,,,D\r\n');
+                        msg.should.have.property('payload', 'col1,col2,col3,col4\r\nH1,H2,H3,H4\r\nA,B,,\r\nA,,C,\r\nA,,,"D\nE"\r\n');
                         done();
                     }
                     catch(e) { done(e); }
                 });
-                var testJson = [{"col1":"H1","col2":"H2","col3":"H3","col4":"H4"},{"col1":"A","col2":"B"},{"col1":"A","col3":"C"},{"col1":"A","col4":"D"}];
+                var testJson = [{"col1":"H1","col2":"H2","col3":"H3","col4":"H4"},{"col1":"A","col2":"B"},{"col1":"A","col3":"C"},{"col1":"A","col4":"D\nE"}];
                 n1.emit("input", {payload:testJson});
             });
         });
diff --git a/test/unit/@node-red/editor-api/lib/admin/flows_spec.js b/test/unit/@node-red/editor-api/lib/admin/flows_spec.js
index ac295a194..9ec6a3bc9 100644
--- a/test/unit/@node-red/editor-api/lib/admin/flows_spec.js
+++ b/test/unit/@node-red/editor-api/lib/admin/flows_spec.js
@@ -32,7 +32,9 @@ describe("api/admin/flows", function() {
         app = express();
         app.use(bodyParser.json());
         app.get("/flows",flows.get);
+        app.get("/flows/state",flows.getState);
         app.post("/flows",flows.post);
+        app.post("/flows/state",flows.postState);
     });
 
     it('returns flow - v1', function(done) {
@@ -208,4 +210,99 @@ describe("api/admin/flows", function() {
                 done();
             });
     });
+    it('returns flows run state', function (done) {
+        var setFlows = sinon.spy(function () { return Promise.resolve(); });
+        flows.init({
+            flows: {
+                setFlows,
+                getState: async function () {
+                    return { started: true, state: "started" };
+                }
+            }
+        });
+        request(app)
+            .get('/flows/state')
+            .set('Accept', 'application/json')
+            .set('Node-RED-Deployment-Type', 'reload')
+            .expect(200)
+            .end(function (err, res) {
+                if (err) {
+                    return done(err);
+                }
+                try {
+                    res.body.should.have.a.property('started', true);
+                    res.body.should.have.a.property('state', "started");
+                    done();
+                } catch (e) {
+                    return done(e);
+                }
+            });
+    });
+    it('sets flows run state - stopped', function (done) {
+        var setFlows = sinon.spy(function () { return Promise.resolve(); });
+        flows.init({
+            flows: {
+                setFlows: setFlows,
+                getState: async function () {
+                    return { started: true, state: "started" };
+                },
+                setState: async function () {
+                    return { started: false, state: "stopped" };
+                },
+            }
+        });
+        request(app)
+            .post('/flows/state')
+            .set('Accept', 'application/json')
+            .send({state:'stop'})
+            .expect(200)
+            .end(function (err, res) {
+                if (err) {
+                    return done(err);
+                }
+                try {
+                    res.body.should.have.a.property('started', false);
+                    res.body.should.have.a.property('state', "stopped");
+                    done();
+                } catch (e) {
+                    return done(e);
+                }
+            });
+    });
+    it('sets flows run state - bad value', function (done) {
+        var setFlows = sinon.spy(function () { return Promise.resolve(); });
+        const makeError = (error, errcode, statusCode) => {
+            const message = typeof error == "object" ? error.message : error
+            const err = typeof error == "object" ? error : new Error(message||"Unexpected Error")
+            err.status = err.status || statusCode || 400;
+            err.code = err.code || errcode || "unexpected_error"
+            return err
+        }
+        flows.init({
+            flows: {
+                setFlows: setFlows,
+                getState: async function () {
+                    return { started: true, state: "started" };
+                },
+                setState: async function () {
+                    var err = (makeError("Cannot set runtime state. Invalid state", "invalid_run_state", 400))
+                    var p = Promise.reject(err);
+                    p.catch(()=>{});
+                    return p;
+                },
+            }
+        });
+        request(app)
+            .post('/flows/state')
+            .set('Accept', 'application/json')
+            .send({state:'bad-state'})
+            .expect(400)
+            .end(function(err,res) {
+                if (err) {
+                    return done(err);
+                }
+                res.body.should.have.property("code","invalid_run_state");
+                done();
+            });
+    });
 });
diff --git a/test/unit/@node-red/editor-api/lib/editor/theme_spec.js b/test/unit/@node-red/editor-api/lib/editor/theme_spec.js
index 900be126f..fd1b42d61 100644
--- a/test/unit/@node-red/editor-api/lib/editor/theme_spec.js
+++ b/test/unit/@node-red/editor-api/lib/editor/theme_spec.js
@@ -51,7 +51,7 @@ describe("api/editor/theme", function () {
         context.should.have.a.property("asset");
         context.asset.should.have.a.property("red", "red/red.min.js");
         context.asset.should.have.a.property("main", "red/main.min.js");
-        context.asset.should.have.a.property("vendorMonaco", "");
+        context.asset.should.have.a.property("vendorMonaco", "vendor/monaco/monaco-bootstrap.js");
 
         should.not.exist(theme.settings());
     });
@@ -69,16 +69,16 @@ describe("api/editor/theme", function () {
         }
     });
 
-    it("Adds monaco bootstrap when enabled", async function () {
+    it("Does not add monaco bootstrap when ace selected", async function () {
         theme.init({
             editorTheme: {
                 codeEditor: {
-                    lib: 'monaco'
+                    lib: 'ace'
                 }
             }
         });
         var context = await theme.context();
-        context.asset.should.have.a.property("vendorMonaco", "vendor/monaco/monaco-bootstrap.js");
+        context.asset.should.have.a.property("vendorMonaco", "");
     });
 
     it("picks up custom theme", async function () {
diff --git a/test/unit/@node-red/registry/lib/localfilesystem_spec.js b/test/unit/@node-red/registry/lib/localfilesystem_spec.js
index e84761657..3b1bb63f3 100644
--- a/test/unit/@node-red/registry/lib/localfilesystem_spec.js
+++ b/test/unit/@node-red/registry/lib/localfilesystem_spec.js
@@ -14,26 +14,41 @@
  * limitations under the License.
  **/
 
-var should = require("should");
-var sinon = require("sinon");
-var path = require("path");
+const should = require("should");
+const sinon = require("sinon");
+const path = require("path");
 
-var NR_TEST_UTILS = require("nr-test-utils");
+const NR_TEST_UTILS = require("nr-test-utils");
 
-var localfilesystem = NR_TEST_UTILS.require("@node-red/registry/lib/localfilesystem");
+const localfilesystem = NR_TEST_UTILS.require("@node-red/registry/lib/localfilesystem");
 
-var resourcesDir = path.resolve(path.join(__dirname,"resources","local"));
-var userDir = path.resolve(path.join(__dirname,"resources","userDir"));
-var moduleDir = path.resolve(path.join(__dirname,"resources","local","TestNodeModule"));
+const resourcesDir = path.resolve(path.join(__dirname,"resources","local"));
+const userDir = path.resolve(path.join(__dirname,"resources","userDir"));
 
-var i18n = NR_TEST_UTILS.require("@node-red/util").i18n;
+const nodesDir1 = path.resolve(path.join(__dirname,"resources","nodesDir1"))
+const nodesDir2 = path.resolve(path.join(__dirname,"resources","nodesDir2"))
+const nodesDir3 =path.resolve(path.join(__dirname,"resources","nodesDir3"))
+
+const moduleDir = path.resolve(path.join(__dirname,"resources","local","TestNodeModule"));
+
+const i18n = NR_TEST_UTILS.require("@node-red/util").i18n;
 
 describe("red/nodes/registry/localfilesystem",function() {
+    var stubs = [];
+    function stubPathJoin() {
+        var _join = path.join;
+        stubs.push(sinon.stub(path,"join").callsFake(function() {
+            if (arguments[0] == resourcesDir) {
+                // This stops the module tree scan from going any higher
+                // up the tree than resourcesDir.
+                return arguments[0];
+            }
+            return _join.apply(null,arguments);
+        }));
+    }
     beforeEach(function() {
         stubs.push(sinon.stub(i18n,"registerMessageCatalog").callsFake(function() { return Promise.resolve(); }));
     })
-
-    var stubs = [];
     afterEach(function() {
         while(stubs.length) {
             stubs.pop().restore();
@@ -129,16 +144,76 @@ describe("red/nodes/registry/localfilesystem",function() {
             checkNodes(nm.nodes,['TestNode5'],['TestNode1']);
             done();
         });
+        it("Finds nodes and icons only in nodesDir with files, icons and valid node-red packages",function(done) {
+            localfilesystem.init({nodesDir:nodesDir1});
+            const nodeList = localfilesystem.getNodeFiles(true);
+            nodeList.should.have.a.property("node-red");
+            const nm = nodeList['node-red'];
+            nm.should.have.a.property('name','node-red');
+            nm.should.have.a.property("nodes");
+            nm.should.have.a.property("icons");
+            checkNodes(nm.nodes,['loose1', 'loose2'], []);
+            //1 icon in nodesDir1/icons/  - should be found
+            //2 icons in nodesDir1/loose2/icons/  - should be found
+            //1 icons in nodesDir1/node-red-node-testnode/icons/  - should be found
+            //1 icons in nodesDir1/regular_module/icons/  - should NOT be found
+            //total icon sets 3, total icons 4
+            nm.icons.should.have.a.property("length", 3);
+            nm.icons[0].should.have.a.property("path")
+            nm.icons[0].should.have.a.property("icons", ['loose1.svg'])
+            nm.icons[1].should.have.a.property("path")
+            nm.icons[1].should.have.a.property("icons", ['loose2.svg', 'loose2b.svg'])
+            nm.icons[2].should.have.a.property("path")
+            nm.icons[2].should.have.a.property("icons", ['test.svg'])
+            done();
+        });
+        it("Should not find node-red node in nodesDir with files, icons and valid node-red packages",function(done) {
+            // path contains a regular node module and a node-red node module
+            localfilesystem.init({nodesDir:path.join(nodesDir1)});
+            const nodeList = localfilesystem.getNodeFiles(true);
+            nodeList.should.have.a.property("node-red");
+            const nm = nodeList['node-red'];
+            nm.should.have.a.property('name','node-red');
+            nm.should.have.a.property("nodes");
+            nm.nodes.should.have.a.property("loose1");
+            nm.nodes.should.have.a.property("loose2");
+            nm.nodes.should.not.have.a.property("regular_module");
+            nm.nodes.should.not.have.a.property("node-red-node-testnode");
+            for (let key of Object.keys(nm.nodes)) {
+                const n = nm.nodes[key];
+                n.file.indexOf("regular_module").should.eql(-1, `found icons in a node-red module`)
+                n.file.indexOf("node-red-node-testnode").should.eql(-1, `found icons in a node-red module`)
+            }
+            //1 icon in nodesDir1/icons/  - should be found
+            //2 icons in nodesDir1/loose2/icons/  - should be found
+            //1 icons in nodesDir1/node-red-node-testnode/icons/  - should be found
+            //1 icons in nodesDir1/regular_module/icons/  - should NOT be found
+            //total icon sets 3, total icons 4
+            nm.should.have.a.property("icons");
+            nm.icons.should.have.a.property("length", 3);
+            let iconCount = 0;
+            for (let index = 0; index < nm.icons.length; index++) {
+                const iconDir = nm.icons[index];
+                iconCount += iconDir.icons.length
+                iconDir.path.indexOf("node-red-node-testnode").should.eql(-1, `should not find icons in a node-red module`)
+            }
+            should(iconCount).eql(4, "Should find only 4 icons")
+            done();
+        });
+        it("Should not find node-red node in nodesDir when regular package and valid node-red packages",function(done) {
+            localfilesystem.init({nodesDir:path.join(nodesDir1,"regular_module")});
+            const nodeList = localfilesystem.getNodeFiles(true);
+            nodeList.should.have.a.property("node-red");
+            const nm = nodeList['node-red'];
+            nm.should.have.a.property('name','node-red');
+            nm.should.have.a.property("nodes", {});
+            nm.should.have.a.property("icons");
+            nm.icons.should.have.a.property("length", 1); //should find 1 icons folder
+            nm.icons[0].should.have.a.property("icons", [ 'test.svg' ]); //should find 1 icon in regular package
+            done();
+        });
         it("Finds nodes module path",function(done) {
-            var _join = path.join;
-            stubs.push(sinon.stub(path,"join").callsFake(function() {
-                if (arguments[0] == resourcesDir) {
-                    // This stops the module tree scan from going any higher
-                    // up the tree than resourcesDir.
-                    return arguments[0];
-                }
-                return _join.apply(null,arguments);
-            }));
+            stubPathJoin()
             localfilesystem.init({coreNodesDir:moduleDir});
             var nodeList = localfilesystem.getNodeFiles();
             nodeList.should.have.a.property("node-red");
@@ -166,8 +241,6 @@ describe("red/nodes/registry/localfilesystem",function() {
             i18n.registerMessageCatalog.lastCall.args[1].should.eql(path.resolve(path.join(moduleDir,"locales")));
             i18n.registerMessageCatalog.lastCall.args[2].should.eql('messages.json');
 
-
-
             done();
         });
         it.skip("finds locales directory");
@@ -205,15 +278,7 @@ describe("red/nodes/registry/localfilesystem",function() {
     });
     describe("#getModuleFiles",function() {
         it("gets a nodes module files",function(done) {
-            var _join = path.join;
-            stubs.push(sinon.stub(path,"join").callsFake(function() {
-                if (arguments[0] == resourcesDir) {
-                    // This stops the module tree scan from going any higher
-                    // up the tree than resourcesDir.
-                    return arguments[0];
-                }
-                return _join.apply(null,arguments);
-            }));
+            stubPathJoin()
             localfilesystem.init({coreNodesDir:moduleDir});
             var nodeModule = localfilesystem.getModuleFiles('TestNodeModule');
             nodeModule.should.have.a.property('TestNodeModule');
@@ -230,16 +295,87 @@ describe("red/nodes/registry/localfilesystem",function() {
 
             done();
         });
+        it("Finds only 1 node-red node in nodesDir amongst legacy nodes and regular nodes",function(done) {
+            stubPathJoin()
+            localfilesystem.init({nodesDir:[path.join(nodesDir1,"node-red-node-testnode")]});
+            const nodeModule = localfilesystem.getModuleFiles();
+            const loaded = Object.keys(nodeModule)
+            loaded.should.have.a.property("length", 1)
+            loaded.indexOf('node-red-node-testnode').should.greaterThan(-1, "Should load node-red-node-testnode")
+
+            nodeModule['node-red-node-testnode'].should.have.a.property('name','node-red-node-testnode');
+            nodeModule['node-red-node-testnode'].should.have.a.property('version','1.0.0');
+            nodeModule['node-red-node-testnode'].should.have.a.property('nodes');
+            nodeModule['node-red-node-testnode'].should.have.a.property('path');
+            nodeModule['node-red-node-testnode'].should.have.a.property('user', false);
+            checkNodes(nodeModule['node-red-node-testnode'].nodes,['testnode'],[],'node-red-node-testnode');
+            done();
+        });
+        it("Finds a node-red node in nodesDir with a sub dir containing valid node-red package",function(done) {
+            stubPathJoin()
+            localfilesystem.init({nodesDir:[path.join(nodesDir1,"node-red-node-testnode")]});
+            const nodeModule = localfilesystem.getModuleFiles();
+            const loaded = Object.keys(nodeModule)
+            nodeModule['node-red-node-testnode'].should.have.a.property('name','node-red-node-testnode');
+            nodeModule['node-red-node-testnode'].should.have.a.property('version','1.0.0');
+            nodeModule['node-red-node-testnode'].should.have.a.property('nodes');
+            nodeModule['node-red-node-testnode'].should.have.a.property('path');
+            nodeModule['node-red-node-testnode'].should.have.a.property('user', false);
+            checkNodes(nodeModule['node-red-node-testnode'].nodes,['testnode'],[],'node-red-node-testnode');
+            done();
+        });
+        it("Finds 2 node-red modules and 1 plugin in nodesDir (in root of dir)",function(done) {
+            stubPathJoin()
+            localfilesystem.init({nodesDir:[nodesDir2]});
+            const nodeModule = localfilesystem.getModuleFiles();
+            const loaded = Object.keys(nodeModule)
+            loaded.should.have.a.property("length", 3)
+            loaded.indexOf('@test/testnode').should.greaterThan(-1, "Should load @test/testnode")
+            loaded.indexOf('testnode2').should.greaterThan(-1, "Should load testnode2")
+            loaded.indexOf('test-theme2').should.greaterThan(-1, "Should load test-theme2")
+
+            nodeModule['@test/testnode'].should.have.a.property('name','@test/testnode');
+            nodeModule['@test/testnode'].should.have.a.property('version','1.0.0');
+            nodeModule['@test/testnode'].should.have.a.property('nodes');
+            nodeModule['@test/testnode'].should.have.a.property('path');
+            nodeModule['@test/testnode'].should.have.a.property('user', false);
+
+            nodeModule['testnode2'].should.have.a.property('name','testnode2');
+            nodeModule['testnode2'].should.have.a.property('version','1.0.0');
+            nodeModule['testnode2'].should.have.a.property('nodes');
+            nodeModule['testnode2'].should.have.a.property('path');
+            nodeModule['testnode2'].should.have.a.property('user', false);
+
+            nodeModule['test-theme2'].should.have.a.property('name','test-theme2');
+
+            nodeModule['test-theme2'].should.have.a.property('version','0.0.1');
+            nodeModule['test-theme2'].should.have.a.property('nodes', {});
+            nodeModule['test-theme2'].should.have.a.property('path');
+            nodeModule['test-theme2'].should.have.a.property('user', false);
+            nodeModule['test-theme2'].should.have.a.property('plugins');
+            nodeModule['test-theme2'].plugins.should.have.a.property('test-theme2');
+            nodeModule['test-theme2'].plugins['test-theme2'].should.have.a.property('name','test-theme2');
+            nodeModule['test-theme2'].plugins['test-theme2'].should.have.a.property('module','test-theme2');
+            nodeModule['test-theme2'].plugins['test-theme2'].should.have.a.property('version', '0.0.1');
+            nodeModule['test-theme2'].plugins['test-theme2'].should.have.a.property('file');
+            nodeModule['test-theme2'].plugins['test-theme2'].should.have.a.property('local', false);
+
+            done();
+        });
+        it("Finds 2 node-red modules and 1 plugin in nodesDir pointing to a node_modules dir",function(done) {
+            stubPathJoin()
+            localfilesystem.init({nodesDir:[path.join(nodesDir3, "node_modules")]});
+            const nodeModule = localfilesystem.getModuleFiles();
+            const loaded = Object.keys(nodeModule)
+            loaded.should.have.a.property("length", 3)
+            
+            loaded.indexOf('@test/testnode').should.greaterThan(-1, "Should load @test/testnode")
+            loaded.indexOf('@test/test-theme3').should.greaterThan(-1, "Should load test-theme3")
+            loaded.indexOf('testnode3').should.greaterThan(-1, "Should load testnode3")
+            done();
+        });
         it("throws an error if a node isn't found",function(done) {
-            var _join = path.join;
-            stubs.push(sinon.stub(path,"join").callsFake(function() {
-                if (arguments[0] == resourcesDir) {
-                    // This stops the module tree scan from going any higher
-                    // up the tree than resourcesDir.
-                    return arguments[0];
-                }
-                return _join.apply(null,arguments);
-            }));
+            stubPathJoin()
             localfilesystem.init({coreNodesDir:moduleDir});
             /*jshint immed: false */
             (function(){
@@ -250,15 +386,7 @@ describe("red/nodes/registry/localfilesystem",function() {
         it.skip("finds locales directory");
         it.skip("finds icon path directory");
         it("scans icon files with a module file",function(done) {
-            var _join = path.join;
-            stubs.push(sinon.stub(path,"join").callsFake(function() {
-                if (arguments[0] == resourcesDir) {
-                    // This stops the module tree scan from going any higher
-                    // up the tree than resourcesDir.
-                    return arguments[0];
-                }
-                return _join.apply(null,arguments);
-            }));
+            stubPathJoin()
             localfilesystem.init({
                 coreNodesDir: moduleDir
             });
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/icons/loose1.svg b/test/unit/@node-red/registry/lib/resources/nodesDir1/icons/loose1.svg
new file mode 100644
index 000000000..927680ee3
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/icons/loose1.svg
@@ -0,0 +1 @@
+<svg width="40" height="60" viewBox="0, 0, 40, 60" xmlns="http://www.w3.org/2000/svg"><path d="M10.004 14.499h20M10.004 46.503h20M10.004 22.5h20M10.004 30.501h20M10.004 38.502h20" stroke="#fff" stroke-width="2.9997000000000003"/></svg>
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/loose1.html b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose1.html
new file mode 100644
index 000000000..8f392056c
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose1.html
@@ -0,0 +1,5 @@
+<script>
+    (function() {
+        console.log("hello from loose1.html")
+    })()
+</script>
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/loose1.js b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose1.js
new file mode 100644
index 000000000..624cfe6d8
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose1.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from loose1.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/icons/loose2.svg b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/icons/loose2.svg
new file mode 100644
index 000000000..04bebc370
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/icons/loose2.svg
@@ -0,0 +1 @@
+<svg width="40" height="60" viewBox="0, 0, 40, 60" xmlns="http://www.w3.org/2000/svg"><path d="M30.999 31.005v-3h-6.762s.812-12.397 1.162-14 .597-3.35 2.628-3.103 1.971 3.103 1.971 3.103l4.862-.016s-.783-3.984-2.783-5.984-7.946-1.7-9.633.03c-1.687 1.73-2.302 5.065-2.597 6.422-.588 4.5-.854 9.027-1.248 13.547h-8.6v3H18.1s-.812 12.398-1.162 14-.597 3.35-2.628 3.103-1.972-3.102-1.972-3.102l-4.862.015s.783 3.985 2.783 5.985c2 2 7.946 1.699 9.634-.031 1.687-1.73 2.302-5.065 2.597-6.422.587-4.5.854-9.027 1.248-13.547z" fill="#fff"/></svg>
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/icons/loose2b.svg b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/icons/loose2b.svg
new file mode 100644
index 000000000..250348861
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/icons/loose2b.svg
@@ -0,0 +1 @@
+<svg width="40" height="60" viewBox="0, 0, 40, 60" xmlns="http://www.w3.org/2000/svg"><path d="M7 38.98v3.983h11v12l13-23H19l-.463.017c-1.28 4.048-5.066 6.983-9.537 6.983zm12-11.017h12l-13-23v12H7V20.9l2 .064c4.467 0 8.25 2.93 9.534 6.972zM6.95 24.22a6 6 0 1 1-.083 11.456" fill="#fff" style="isolation:auto;mix-blend-mode:normal"/></svg>
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/loose2.html b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/loose2.html
new file mode 100644
index 000000000..e23e2880a
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/loose2.html
@@ -0,0 +1,5 @@
+<script>
+    (function() {
+        console.log("hello from loose2.html")
+    })()
+</script>
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/loose2.js b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/loose2.js
new file mode 100644
index 000000000..e1cde2a82
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/loose2/loose2.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from loose2.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/icons/test.svg b/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/icons/test.svg
new file mode 100644
index 000000000..04bebc370
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/icons/test.svg
@@ -0,0 +1 @@
+<svg width="40" height="60" viewBox="0, 0, 40, 60" xmlns="http://www.w3.org/2000/svg"><path d="M30.999 31.005v-3h-6.762s.812-12.397 1.162-14 .597-3.35 2.628-3.103 1.971 3.103 1.971 3.103l4.862-.016s-.783-3.984-2.783-5.984-7.946-1.7-9.633.03c-1.687 1.73-2.302 5.065-2.597 6.422-.588 4.5-.854 9.027-1.248 13.547h-8.6v3H18.1s-.812 12.398-1.162 14-.597 3.35-2.628 3.103-1.972-3.102-1.972-3.102l-4.862.015s.783 3.985 2.783 5.985c2 2 7.946 1.699 9.634-.031 1.687-1.73 2.302-5.065 2.597-6.422.587-4.5.854-9.027 1.248-13.547z" fill="#fff"/></svg>
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/main.js b/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/main.js
new file mode 100644
index 000000000..e2e0781d1
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/main.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from regular module main.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/package.json
new file mode 100644
index 000000000..26d4151fb
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/node-red-node-testnode/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "node-red-node-testnode",
+  "version": "1.0.0",
+  "description": "A node-red node that does nothing other than exist",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "node-red"
+  ],
+  "node-red": {
+    "nodes": {
+      "testnode": "index.js"
+    }
+  },
+  "author": "@testyMcTersterson",
+  "license": "MIT"
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/icons/test.svg b/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/icons/test.svg
new file mode 100644
index 000000000..04bebc370
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/icons/test.svg
@@ -0,0 +1 @@
+<svg width="40" height="60" viewBox="0, 0, 40, 60" xmlns="http://www.w3.org/2000/svg"><path d="M30.999 31.005v-3h-6.762s.812-12.397 1.162-14 .597-3.35 2.628-3.103 1.971 3.103 1.971 3.103l4.862-.016s-.783-3.984-2.783-5.984-7.946-1.7-9.633.03c-1.687 1.73-2.302 5.065-2.597 6.422-.588 4.5-.854 9.027-1.248 13.547h-8.6v3H18.1s-.812 12.398-1.162 14-.597 3.35-2.628 3.103-1.972-3.102-1.972-3.102l-4.862.015s.783 3.985 2.783 5.985c2 2 7.946 1.699 9.634-.031 1.687-1.73 2.302-5.065 2.597-6.422.587-4.5.854-9.027 1.248-13.547z" fill="#fff"/></svg>
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/main.js b/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/main.js
new file mode 100644
index 000000000..e2e0781d1
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/main.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from regular module main.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/package.json
new file mode 100644
index 000000000..23cfd7e86
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir1/regular_module/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "regular_node",
+  "version": "1.0.0",
+  "description": "A regular node that does nothing other than exist",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "test"
+  ],
+  "author": "@testyMcTersterson",
+  "license": "MIT"
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/index.html b/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/index.html
new file mode 100644
index 000000000..0e45b3007
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/index.html
@@ -0,0 +1,5 @@
+<script>
+    (function() {
+        console.log("hello from @test/testnode index.html")
+    })()
+</script>
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/index.js b/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/index.js
new file mode 100644
index 000000000..1fe9d89a3
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/index.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from @test/testnode index.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/package.json
new file mode 100644
index 000000000..a32462631
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/@test/testnode/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@test/testnode",
+  "version": "1.0.0",
+  "description": "A test node that does nothing other than exist",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "node-red",
+    "test"
+  ],
+  "node-red": {
+    "nodes": {
+      "testnode": "index.js"
+    }
+  },
+  "author": "@testyMcTersterson",
+  "license": "MIT"
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/index.html b/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/index.html
new file mode 100644
index 000000000..5d9f2b0ec
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/index.html
@@ -0,0 +1,5 @@
+<script>
+    (function() {
+        console.log("hello from testnode2 index.js")
+    })()
+</script>
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/index.js b/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/index.js
new file mode 100644
index 000000000..0f0eba392
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/index.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from testnode2 index.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/package.json
new file mode 100644
index 000000000..f9e8aecbe
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/testnode2/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "testnode2",
+  "version": "1.0.0",
+  "description": "A test node that does nothing other than exist",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "node-red",
+    "test"
+  ],
+  "node-red": {
+    "nodes": {
+      "testnode2": "index.js"
+    }
+  },
+  "author": "@testyMcTersterson",
+  "license": "MIT"
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/clientside.js b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/clientside.js
new file mode 100644
index 000000000..fb2e22289
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/clientside.js
@@ -0,0 +1,3 @@
+(function() {
+    console.log("Hi from test plugin client side")
+})()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/plugin.js b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/plugin.js
new file mode 100644
index 000000000..3202aeb8b
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/plugin.js
@@ -0,0 +1,14 @@
+module.exports = function (RED) {
+    RED.plugins.registerPlugin('test-theme', {
+        type: 'node-red-theme',
+        scripts: [
+            'files/clientside.js'
+        ],
+        css: [
+            'files/theme.css',
+        ],
+        monacoOptions: {
+            theme: "vs"
+        }
+    })
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/theme.css b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/theme.css
new file mode 100644
index 000000000..872c93e10
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/files/theme.css
@@ -0,0 +1 @@
+:root{--red-ui-primary-background: #f2f3fb;}
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/package.json
new file mode 100644
index 000000000..b8608c175
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/theme-plugin2/package.json
@@ -0,0 +1,24 @@
+{
+    "name": "test-theme2",
+    "version": "0.0.1",
+    "description": "test theme for Node-RED",
+
+    "keywords": [
+        "node-red",
+        "plugin",
+        "theme"
+    ],
+    "author": {
+        "name": "testy-McTesterson"
+    },
+    "license": "MIT",
+    "node-red": {
+        "version": ">=2.2.0",
+        "plugins": {
+            "test-theme2": "files/plugin.js"
+        }
+    },
+    "engines": {
+        "node": ">=12.x"
+    }
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/index.html b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/index.html
new file mode 100644
index 000000000..0e45b3007
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/index.html
@@ -0,0 +1,5 @@
+<script>
+    (function() {
+        console.log("hello from @test/testnode index.html")
+    })()
+</script>
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/index.js b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/index.js
new file mode 100644
index 000000000..1fe9d89a3
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/index.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from @test/testnode index.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/package.json
new file mode 100644
index 000000000..a32462631
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/testnode/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@test/testnode",
+  "version": "1.0.0",
+  "description": "A test node that does nothing other than exist",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "node-red",
+    "test"
+  ],
+  "node-red": {
+    "nodes": {
+      "testnode": "index.js"
+    }
+  },
+  "author": "@testyMcTersterson",
+  "license": "MIT"
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/clientside.js b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/clientside.js
new file mode 100644
index 000000000..fb2e22289
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/clientside.js
@@ -0,0 +1,3 @@
+(function() {
+    console.log("Hi from test plugin client side")
+})()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/plugin.js b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/plugin.js
new file mode 100644
index 000000000..3202aeb8b
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/plugin.js
@@ -0,0 +1,14 @@
+module.exports = function (RED) {
+    RED.plugins.registerPlugin('test-theme', {
+        type: 'node-red-theme',
+        scripts: [
+            'files/clientside.js'
+        ],
+        css: [
+            'files/theme.css',
+        ],
+        monacoOptions: {
+            theme: "vs"
+        }
+    })
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/theme.css b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/theme.css
new file mode 100644
index 000000000..872c93e10
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/files/theme.css
@@ -0,0 +1 @@
+:root{--red-ui-primary-background: #f2f3fb;}
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/package.json
new file mode 100644
index 000000000..56b1bfb6d
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/@test/theme-plugin3/package.json
@@ -0,0 +1,24 @@
+{
+    "name": "@test/test-theme3",
+    "version": "0.0.1",
+    "description": "test theme for Node-RED",
+
+    "keywords": [
+        "node-red",
+        "plugin",
+        "theme"
+    ],
+    "author": {
+        "name": "testy-McTesterson"
+    },
+    "license": "MIT",
+    "node-red": {
+        "version": ">=2.2.0",
+        "plugins": {
+            "test-theme3": "files/plugin.js"
+        }
+    },
+    "engines": {
+        "node": ">=12.x"
+    }
+}
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/index.html b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/index.html
new file mode 100644
index 000000000..a4034f340
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/index.html
@@ -0,0 +1,5 @@
+<script>
+    (function() {
+        console.log("hello from testnode3 index.js")
+    })()
+</script>
\ No newline at end of file
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/index.js b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/index.js
new file mode 100644
index 000000000..855768ad8
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/index.js
@@ -0,0 +1,4 @@
+
+    (function() {
+        console.log("hello from testnode3 index.js")
+    })()
diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/package.json
new file mode 100644
index 000000000..41e9bb8f8
--- /dev/null
+++ b/test/unit/@node-red/registry/lib/resources/nodesDir3/node_modules/testnode3/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "testnode3",
+  "version": "1.0.0",
+  "description": "A test node that does nothing other than exist",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "node-red",
+    "test"
+  ],
+  "node-red": {
+    "nodes": {
+      "testnode3": "index.js"
+    }
+  },
+  "author": "@testyMcTersterson",
+  "license": "MIT"
+}
diff --git a/test/unit/@node-red/runtime/lib/api/flows_spec.js b/test/unit/@node-red/runtime/lib/api/flows_spec.js
index 9062ef52f..deed6a9b6 100644
--- a/test/unit/@node-red/runtime/lib/api/flows_spec.js
+++ b/test/unit/@node-red/runtime/lib/api/flows_spec.js
@@ -427,4 +427,123 @@ describe("runtime-api/flows", function() {
         });
     });
 
+    describe("flow run state", function() {
+        var startFlows, stopFlows, runtime;
+        beforeEach(function() {
+            let flowsStarted = true;
+            let flowsState = "start";
+            startFlows = sinon.spy(function(type) {
+                if (type !== "full") {
+                    var err = new Error();
+                    // TODO: quirk of internal api - uses .code for .status
+                    err.code = 400;
+                    var p = Promise.reject(err);
+                    p.catch(()=>{});
+                    return p;
+                }
+                flowsStarted = true;
+                flowsState = "start";
+                return Promise.resolve();
+            });
+            stopFlows = sinon.spy(function(type) {
+                if (type !== "full") {
+                    var err = new Error();
+                    // TODO: quirk of internal api - uses .code for .status
+                    err.code = 400;
+                    var p = Promise.reject(err);
+                    p.catch(()=>{});
+                    return p;
+                }
+                flowsStarted = false;
+                flowsState = "stop";
+                return Promise.resolve();
+            });
+            runtime = {
+                log: mockLog(),
+                settings: {
+                    runtimeState: {
+                        enabled: true,
+                        ui: true,
+                    },
+                },
+                flows: {
+                    get started() {
+                        return flowsStarted;
+                    },
+                    startFlows,
+                    stopFlows,
+                    getFlows: function() { return {rev:"currentRev",flows:[]} },
+                    state: function() { return flowsState}
+                }
+            }
+        })
+
+        it("gets flows run state", async function() {
+            flows.init(runtime);
+            const state = await flows.getState({})
+            state.should.have.property("state", "start")
+        });
+        it("permits getting flows run state when setting disabled", async function() {
+            runtime.settings.runtimeState.enabled = false;
+            flows.init(runtime);
+            const state = await flows.getState({})
+            state.should.have.property("state", "start")
+        });
+        it("start flows", async function() {
+            flows.init(runtime);
+            const state = await flows.setState({state:"start"})
+            state.should.have.property("state", "start")
+            stopFlows.called.should.not.be.true();
+            startFlows.called.should.be.true();
+        });
+        it("stop flows", async function() {
+            flows.init(runtime);
+            const state = await flows.setState({state:"stop"})
+            state.should.have.property("state", "stop")
+            stopFlows.called.should.be.true();
+            startFlows.called.should.not.be.true();
+        });
+        it("rejects starting flows when setting disabled", async function() {
+            let err;
+            runtime.settings.runtimeState.enabled = false;
+            flows.init(runtime);
+            try {
+                await flows.setState({state:"start"})
+            } catch (error) {
+                err = error
+            }
+            stopFlows.called.should.not.be.true();
+            startFlows.called.should.not.be.true();
+            should(err).have.property("code", "not_allowed")
+            should(err).have.property("status", 405)
+        });
+        it("rejects stopping flows when setting disabled", async function() {
+            let err;
+            runtime.settings.runtimeState.enabled = false;
+            flows.init(runtime);
+            try {
+                await flows.setState({state:"stop"})
+            } catch (error) {
+                err = error
+            }
+            stopFlows.called.should.not.be.true();
+            startFlows.called.should.not.be.true();
+            should(err).have.property("code", "not_allowed")
+            should(err).have.property("status", 405)
+        });
+        it("rejects setting invalid flows run state", async function() {
+            let err;
+            flows.init(runtime);
+            try {
+                await flows.setState({state:"bad-state"})
+            } catch (error) {
+                err = error
+            }
+            stopFlows.called.should.not.be.true();
+            startFlows.called.should.not.be.true();
+            should(err).have.property("code", "invalid_run_state")
+            should(err).have.property("status", 400)
+        });
+    });
+
 });
diff --git a/test/unit/@node-red/runtime/lib/flows/index_spec.js b/test/unit/@node-red/runtime/lib/flows/index_spec.js
index 737846100..1a0f2a73c 100644
--- a/test/unit/@node-red/runtime/lib/flows/index_spec.js
+++ b/test/unit/@node-red/runtime/lib/flows/index_spec.js
@@ -396,12 +396,13 @@ describe('flows/index', function() {
                 try {
                     flowCreate.called.should.be.false();
                     receivedEvent.should.have.property('id','runtime-state');
-                    receivedEvent.should.have.property('payload',
-                       { error: 'missing-modules',
-                         type: 'warning',
-                         text: 'notification.warnings.missing-modules',
-                         modules: [] }
-                     );
+                    receivedEvent.should.have.property('payload', {
+                        state: 'stop',
+                        error: 'missing-modules',
+                        type: 'warning',
+                        text: 'notification.warnings.missing-modules',
+                        modules: []
+                     });
 
                     done();
                 }catch(err) {
diff --git a/test/unit/@node-red/util/lib/util_spec.js b/test/unit/@node-red/util/lib/util_spec.js
index 2013f143e..3bab2739a 100644
--- a/test/unit/@node-red/util/lib/util_spec.js
+++ b/test/unit/@node-red/util/lib/util_spec.js
@@ -388,6 +388,19 @@ describe("@node-red/util/util", function() {
             result[0].should.eql(1);
             result[1].should.eql(2);
         });
+        it('throws an error if buffer data is not array or string', function (done) {
+            try {
+                var result = util.evaluateNodeProperty('12','bin');
+                done("should throw an error");
+            } catch (err) {
+                if (err.code === "INVALID_BUFFER_DATA") {
+                    done();
+                }
+                else {
+                    done("should throw an error");
+                }
+            }
+        });
         it('returns msg property',function() {
             var result = util.evaluateNodeProperty('foo.bar','msg',{},{foo:{bar:"123"}});
             result.should.eql("123");