diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 8f3c8a6ce..85fc1f92a 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -5,6 +5,9 @@ on: release: types: [published] +permissions: + contents: read + jobs: generate: name: 'Update node-red-docker image' diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml index 0db909da6..28d3c1b32 100644 --- a/.github/workflows/tests.yml +++ b/.github/workflows/tests.yml @@ -6,16 +6,22 @@ on: pull_request: branches: [ master, dev ] +permissions: + contents: read + jobs: build: + permissions: + checks: write # for coverallsapp/github-action to create new checks + contents: read # for actions/checkout to fetch code runs-on: ubuntu-latest strategy: matrix: node-version: [14, 16] steps: - - uses: actions/checkout@v2 + - uses: actions/checkout@v3 - name: Use Node.js ${{ matrix.node-version }} - uses: actions/setup-node@v2 + uses: actions/setup-node@v3 with: node-version: ${{ matrix.node-version }} - name: Install Dependencies diff --git a/CHANGELOG.md b/CHANGELOG.md index bd3793487..630d91b4b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,151 @@ +#### 3.0.2: Maintenance Release + +Editor + + - Fix workspace chart bottom property (#3812) @bonanitech + - Update german translation (#3802) @Dennis14e + - Support color reset to the default in subflow and group (#3801) @kazuhitoyokoi + - Allow generateNodeNames to handle names containing regex control chars (#3817) @knolleary + - Hide scrollbars until they're needed (#3808) @bonanitech + - Include junctions/groups when exporting subflows plus related fixes (#3816) @knolleary + - remove console.log (#3820) @Steve-Mcl + +Runtime + + - Register subflow module instance node with parent flow (#3818) @knolleary + +Nodes + + - HTTP Request: Allow HTTP Headers not in spec (#3776) @hardillb + +#### 3.0.1: Maintenance Release + +Editor + + - Allow codeEditor theme to be set even if `codeEditor` is not set in settings.js (#3794) @Steve-Mcl + - Sys info (diagnostics report) amendments (#3793) @Steve-Mcl + - Allow `mode` and `title` to be omitted in `options` argument for `createEditor` (#3791) @Steve-Mcl + - Fix focus issues (#3789) @Steve-Mcl + - Ensure all typedInput buttons have button type set (#3788) @knolleary + - Do not flag hasUsers=false nodes as unused in search (#3787) @knolleary + - Properly position quick-add dialog in all cases (#3786) @knolleary + - Ensure quick-add dialog does not obscure ghost node when shifted (#3785) @knolleary + - Remove use of Object.hasOwn (#3784) @knolleary + +#### 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.}} 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** @@ -109,528 +257,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 to ').prependTo(this.uiSelect); + this.selectTrigger = $('').prependTo(this.uiSelect); $('').toggle(this.options.types.length > 1).appendTo(this.selectTrigger); this.selectLabel = $('').appendTo(this.selectTrigger); @@ -570,7 +570,7 @@ }) // explicitly set optionSelectTrigger display to inline-block otherwise jQ sets it to 'inline' - this.optionSelectTrigger = $('').appendTo(this.uiSelect); + this.optionSelectTrigger = $('').appendTo(this.uiSelect); this.optionSelectLabel = $('').prependTo(this.optionSelectTrigger); // RED.popover.tooltip(this.optionSelectLabel,function() { // return that.optionValue; @@ -591,7 +591,7 @@ that.uiSelect.addClass('red-ui-typedInput-focus'); }); - this.optionExpandButton = $('').appendTo(this.uiSelect); + this.optionExpandButton = $('').appendTo(this.uiSelect); this.optionExpandButtonIcon = $('').appendTo(this.optionExpandButton); this.type(this.typeField.val() || this.options.default||this.typeList[0].value); 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 index 379ed5433..a1fdb402a 100644 --- 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 @@ -1,4 +1,4 @@ -RED.contextMenu = (function() { +RED.contextMenu = (function () { let menu; function createMenu() { @@ -15,10 +15,6 @@ RED.contextMenu = (function() { // ], // width: 200, // }) - - - - } function disposeMenu() { @@ -34,42 +30,80 @@ RED.contextMenu = (function() { } 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 hasLinks = selection.links && selection.links.length > 0; - const isSingleLink = !hasSelection && hasLinks && selection.links.length === 1 - const isMultipleLinks = !hasSelection && hasLinks && selection.links.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() + // addX/addY must be the position in the workspace accounting for both scroll and scale + // The +5 is because we display the contextMenu -5,-5 to actual click position + let addX = (options.x + 5 - offset.left + $("#red-ui-workspace-chart").scrollLeft()) / RED.view.scale() + let addY = (options.y + 5 - offset.top + $("#red-ui-workspace-chart").scrollTop()) / RED.view.scale() const menuItems = [ - { onselect: 'core:show-action-list', onpostselect: function() {} }, + { onselect: 'core:show-action-list', onpostselect: function () { } }, { - label: 'Insert', + label: RED._("contextMenu.insert"), options: [ { - label: 'Node', - onselect: function() { + label: RED._("contextMenu.node"), + onselect: function () { RED.view.showQuickAddDialog({ - position: [ options.x - offset.left, options.y - offset.top ], + position: [addX, addY], touchTrigger: true, - splice: isSingleLink?selection.links[0]:undefined, + splice: isSingleLink ? selection.links[0] : undefined, // spliceMultiple: isMultipleLinks }) + }, + onpostselect: function() { + // ensure quick add dialog search input has focus + $('#red-ui-type-search-input').trigger('focus') + } + }, + (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: 'Junction', - onselect: 'core:split-wires-with-junctions', - disabled: hasSelection || !hasLinks - }, - { - label: 'Link Nodes', + label: RED._("contextMenu.linkNodes"), onselect: 'core:split-wire-with-link-nodes', - disabled: hasSelection || !hasLinks + disabled: !hasLinks } ] @@ -77,28 +111,13 @@ RED.contextMenu = (function() { } ] - // menuItems.push( - // { - // label: (isSingleLink || isMultipleLinks)?'Insert into wire...':'Add node...', - // onselect: function() { - // RED.view.showQuickAddDialog({ - // position: [ options.x - offset.left, options.y - offset.top ], - // touchTrigger: true, - // splice: isSingleLink?selection.links[0]:undefined, - // spliceMultiple: isMultipleLinks - // }) - // } - // }, - // ) - // if (hasLinks && !hasSelection) { - // menuItems.push({ onselect: 'core:split-wires-with-junctions', label: 'Insert junction'}) - // } + 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: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 }, @@ -110,27 +129,34 @@ RED.contextMenu = (function() { menuItems.push( null, isGroup ? - { onselect: 'core:ungroup-selection', disabled: !isGroup } - : { onselect: 'core:group-selection', disabled: !hasSelection } + { 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") }) } } - const offset = $("#red-ui-workspace-chart").offset() + + 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: 'right', + direction: direction, onpreselect: function() { disposeMenu() }, - onpostselect: function() { + onpostselect: function () { RED.view.focus() }, options: menuItems }); - menu.attr("id","red-ui-workspace-context-menu"); + menu.attr("id", "red-ui-workspace-context-menu"); menu.css({ position: "absolute" }) @@ -141,35 +167,37 @@ RED.contextMenu = (function() { var top = options.y var left = options.x - if (top+menu.height()-$(document).scrollTop() > $(window).height()) { - top -= (top+menu.height())-$(window).height() + 22; + 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; + if (left + menu.width() - $(document).scrollLeft() > $(window).width()) { + left -= (left + menu.width()) - $(window).width() + 18; } menu.css({ - top: top+"px", - left: left+"px" + top: top + "px", + left: left + "px" }) $(".red-ui-menu.red-ui-menu-dropdown").hide(); - $(document).on("mousedown.red-ui-workspace-context-menu", function(evt) { + $(document).on("mousedown.red-ui-workspace-context-menu", function (evt) { if (menu && menu[0].contains(evt.target)) { return } disposeMenu() }); menu.show(); - - // menu.show({ - // target: $('#red-ui-main-container'), - // x: options.x, - // y: options.y - // }) - + // 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 + 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() { ''+ ''+ '').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,"&").replace(//g,">") } - 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/editor.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js index fb4c200f5..da7954625 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js @@ -238,6 +238,7 @@ RED.editor = (function() { var valid = validateNodeProperty(node, defaults, property,value); if (((typeof valid) === "string") || !valid) { input.addClass("input-error"); + input.next(".red-ui-typedInput-container").addClass("input-error"); if ((typeof valid) === "string") { var tooltip = input.data("tooltip"); if (tooltip) { @@ -250,6 +251,7 @@ RED.editor = (function() { } } else { input.removeClass("input-error"); + input.next(".red-ui-typedInput-container").removeClass("input-error"); var tooltip = input.data("tooltip"); if (tooltip) { input.data("tooltip", null); @@ -1105,6 +1107,10 @@ RED.editor = (function() { if (editing_node) { RED.sidebar.info.refresh(editing_node); RED.sidebar.help.show(editing_node.type, false); + //ensure focused element is NOT body (for keyboard scope to operate correctly) + if (document.activeElement.tagName === 'BODY') { + $('#red-ui-editor-stack').trigger('focus') + } } } } 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/code-editors/monaco.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editors/monaco.js index 701e3da44..68b9a487e 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editors/monaco.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/code-editors/monaco.js @@ -100,7 +100,7 @@ RED.editor.codeEditor.monaco = (function() { "node-red-util": {package: "node-red", module: "util", path: "node-red/util.d.ts" }, "node-red-func": {package: "node-red", module: "func", path: "node-red/func.d.ts" }, } - const defaultServerSideTypes = [ knownModules["node-red-util"], knownModules["node-red-func"], knownModules["globals"], knownModules["console"], knownModules["buffer"] ]; + const defaultServerSideTypes = [ knownModules["node-red-util"], knownModules["node-red-func"], knownModules["globals"], knownModules["console"], knownModules["buffer"] , knownModules["util"] ]; const modulesCache = {}; @@ -764,7 +764,7 @@ RED.editor.codeEditor.monaco = (function() { if(!options.stateId && options.stateId !== false) { - options.stateId = RED.editor.generateViewStateId("monaco", options, (options.mode || options.title).split("/").pop()); + options.stateId = RED.editor.generateViewStateId("monaco", options, (options.mode || options.title || "").split("/").pop()); } var el = options.element || $("#"+options.id)[0]; var toolbarRow = $("
").appendTo(el); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/colorPicker.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/colorPicker.js index 4b2e19e5c..5b76d020b 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/colorPicker.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/colorPicker.js @@ -76,6 +76,9 @@ RED.editor.colorPicker = RED.colorPicker = (function() { var focusTarget = colorInput; colorInput.on("change", function (e) { var color = colorInput.val(); + if (options.defaultValue && !color.match(/^([a-z]+|#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3})$/)) { + color = options.defaultValue; + } colorHiddenInput.val(color).trigger('change'); refreshDisplay(color); }); 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 = $('
').appendTo(container).hide(); // save current info for reverting on cancel diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/expression.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/expression.js index b3c4c3848..d470e14f2 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/expression.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/expression.js @@ -255,6 +255,9 @@ var currentExpression = expressionEditor.getValue(); var expr; var usesContext = false; + var usesEnv = false; + var usesMoment = false; + var usesClone = false; var legacyMode = /(^|[^a-zA-Z0-9_'".])msg([^a-zA-Z0-9_'"]|$)/.test(currentExpression); $(".red-ui-editor-type-expression-legacy").toggle(legacyMode); try { @@ -267,6 +270,18 @@ usesContext = true; return null; }); + expr.assign("env", function(name) { + usesEnv = true; + return null; + }); + expr.assign("moment", function(name) { + usesMoment = true; + return null; + }); + expr.assign("clone", function(name) { + usesClone = true; + return null; + }); } catch(err) { testResultEditor.setValue(RED._("expressionEditor.errors.invalid-expr",{message:err.message}),-1); return; @@ -284,6 +299,18 @@ testResultEditor.setValue(RED._("expressionEditor.errors.context-unsupported"),-1); return; } + if (usesEnv) { + testResultEditor.setValue(RED._("expressionEditor.errors.env-unsupported"),-1); + return; + } + if (usesMoment) { + testResultEditor.setValue(RED._("expressionEditor.errors.moment-unsupported"),-1); + return; + } + if (usesClone) { + testResultEditor.setValue(RED._("expressionEditor.errors.clone-unsupported"),-1); + return; + } var formattedResult; if (result !== undefined) { 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 8531ba2c5..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 @@ -534,6 +534,7 @@ var container = $("#red-ui-editor-type-json-tab-ui-container").css({"height":"100%"}); var filterDepth = Infinity; var list = $('
').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..e1e6b2ba3 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; @@ -236,6 +235,7 @@ RED.editor.colorPicker.create({ id: "red-ui-editor-node-color", value: color, + defaultValue: "#DDAA99", palette: recommendedColors, sortPalette: function (a, b) {return a.l - b.l;} }).appendTo(colorRow); 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 e11a55660..a35098e52 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 @@ -101,6 +101,7 @@ RED.group = (function() { RED.editor.colorPicker.create({ id:"node-input-style-stroke", value: style.stroke || defaultGroupStyle.stroke || "#a4a4a4", + defaultValue: "#a4a4a4", palette: colorPalette, cellPerRow: colorCount, cellWidth: 16, @@ -112,6 +113,7 @@ RED.group = (function() { RED.editor.colorPicker.create({ id:"node-input-style-fill", value: style.fill || defaultGroupStyle.fill ||"none", + defaultValue: "none", palette: colorPalette, cellPerRow: colorCount, cellWidth: 16, @@ -129,6 +131,7 @@ RED.group = (function() { RED.editor.colorPicker.create({ id:"node-input-style-color", value: style.color || defaultGroupStyle.color ||"#a4a4a4", + defaultValue: "#a4a4a4", palette: colorPalette, cellPerRow: colorCount, cellWidth: 16, @@ -308,6 +311,7 @@ RED.group = (function() { RED.history.push(historyEvent); RED.view.select({nodes:[group]}); RED.nodes.dirty(true); + RED.view.focus(); } } } @@ -330,6 +334,7 @@ RED.group = (function() { RED.history.push(historyEvent); RED.view.select({nodes:newSelection}) RED.nodes.dirty(true); + RED.view.focus(); } } @@ -424,6 +429,7 @@ RED.group = (function() { }); RED.history.push(historyEvent); RED.nodes.dirty(true); + RED.view.focus(); } } @@ -451,6 +457,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 old mode 100755 new mode 100644 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 old mode 100755 new mode 100644 index 9f20cc674..5499cb672 --- 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 @@ -175,9 +175,19 @@ RED.palette = (function() { $('').appendTo(popOverContent) } - var safeType = type.replace(/'/g,"\\'"); + const safeType = type.replace(/'/g,"\\'"); + const wrapStr = function (str) { + if(str.indexOf(' ') >= 0) { + return '"' + str + '"' + } + return str + } - $('').appendTo(popOverContent) + $('') + .appendTo(popOverContent) + .on('click', function() { + RED.search.show('type:' + wrapStr(safeType)) + }) $('').appendTo(popOverContent) $('

',{style:"font-size: 0.8em"}).text(metaData).appendTo(popOverContent); @@ -422,6 +432,7 @@ RED.palette = (function() { categoryNode.find(".red-ui-palette-content").slideToggle(); categoryNode.find("i").toggleClass("expanded"); } + categoryNode.hide(); } } @@ -500,6 +511,7 @@ RED.palette = (function() { currentCategoryNode.find(".red-ui-palette-content").slideToggle(); currentCategoryNode.find("i").toggleClass("expanded"); } + currentCategoryNode.hide(); } } diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js b/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js old mode 100755 new mode 100644 index 190561e15..f32e14c33 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js @@ -545,7 +545,7 @@ RED.projects = (function() { var sshwarningRow = $('

').hide().appendTo(subrow); $('
'+RED._("projects.clone-project.ssh-key-desc")+'
').appendTo(sshwarningRow); subrow = $('
').appendTo(sshwarningRow); - $('').appendTo(subrow).on("click", function(e) { + $('').appendTo(subrow).on("click", function(e) { e.preventDefault(); dialog.dialog( "close" ); RED.userSettings.show('gitconfig'); @@ -747,14 +747,14 @@ RED.projects = (function() { var row = $('
').appendTo(body); $('').appendTo(row); var subrow = $('
').appendTo(row); - var defaultFlowFile = (createProjectOptions.files &&createProjectOptions.files.flow) || (RED.settings.files && RED.settings.files.flow)||"flow.json"; + var defaultFlowFile = (createProjectOptions.files &&createProjectOptions.files.flow) || (RED.settings.files && RED.settings.files.flow) || "flows.json"; projectFlowFileInput = $('').val(defaultFlowFile) .on("change keyup paste",validateForm) .appendTo(subrow); $('
').appendTo(subrow); $('').appendTo(row); - var defaultCredentialsFile = (createProjectOptions.files &&createProjectOptions.files.credentials) || (RED.settings.files && RED.settings.files.credentials)||"flow_cred.json"; + var defaultCredentialsFile = (createProjectOptions.files &&createProjectOptions.files.credentials) || (RED.settings.files && RED.settings.files.credentials) || "flows_cred.json"; row = $('
').appendTo(body); $('').appendTo(row); subrow = $('
').appendTo(row); @@ -1171,11 +1171,11 @@ RED.projects = (function() { row = $('
').appendTo(container); - var openProject = $('').appendTo(row); - var createAsEmpty = $('').appendTo(row); - // var createAsCopy = $('').appendTo(row); - var createAsClone = $('').appendTo(row); - // var createAsClone = $('').appendTo(row); + var openProject = $('').appendTo(row); + var createAsEmpty = $('').appendTo(row); + // var createAsCopy = $('').appendTo(row); + var createAsClone = $('').appendTo(row); + // var createAsClone = $('').appendTo(row); row.find(".red-ui-projects-dialog-screen-create-type").on("click", function(evt) { evt.preventDefault(); container.find(".red-ui-projects-dialog-screen-create-type").removeClass('selected'); @@ -1257,7 +1257,7 @@ RED.projects = (function() { row = $('
').appendTo(container); $('').appendTo(row); subrow = $('
').appendTo(row); - projectFlowFileInput = $('').val("flow.json") + projectFlowFileInput = $('').val("flows.json") .on("change keyup paste",validateForm) .appendTo(subrow); $('
').appendTo(subrow); @@ -1271,7 +1271,7 @@ RED.projects = (function() { var credentialsLeftBox = $('
').appendTo(credentialsBox); var credentialsEnabledBox = $('
').appendTo(credentialsLeftBox); - $('').appendTo(credentialsEnabledBox); + $('').appendTo(credentialsEnabledBox); var credentialsDisabledBox = $('
').appendTo(credentialsLeftBox); $('').appendTo(credentialsDisabledBox); @@ -1397,7 +1397,7 @@ RED.projects = (function() { var sshwarningRow = $('
').hide().appendTo(subrow); $('
'+RED._("projects.create.desc2")+'
').appendTo(sshwarningRow); subrow = $('
').appendTo(sshwarningRow); - $('').appendTo(subrow).on("click", function(e) { + $('').appendTo(subrow).on("click", function(e) { e.preventDefault(); $('#red-ui-projects-dialog-cancel').trigger("click"); RED.userSettings.show('gitconfig'); @@ -1631,14 +1631,14 @@ RED.projects = (function() { function deleteProject(row,name,done) { var cover = $('
').on("click", function(evt) { evt.stopPropagation(); }).appendTo(row); $('').text(RED._("projects.delete.confirm")).appendTo(cover); - $('') + $('') .appendTo(cover) .on("click", function(e) { e.stopPropagation(); cover.remove(); done(true); }); - $('') + $('') .appendTo(cover) .on("click", function(e) { e.stopPropagation(); @@ -1822,7 +1822,7 @@ RED.projects = (function() { header.addClass("selectable"); var tools = $('
').appendTo(header); - $('') + $('') .appendTo(tools) .on("click", function(e) { e.stopPropagation(); 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 217fb5a4e..3903a4a0a 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 @@ -106,38 +106,51 @@ RED.search = (function() { return val; } - function search(val) { - var results = []; - var typeFilter; - var m = /(?:^| )type:([^ ]+)/.exec(val); - if (m) { - val = val.replace(/(?:^| )type:[^ ]+/,""); - typeFilter = m[1]; + function extractType(val, flags) { + // extracts: type:XYZ & type:"X Y Z" + const regEx = /(?:type):\s*(?:"([^"]+)"|([^" ]+))/; + let m + while ((m = regEx.exec(val)) !== null) { + // avoid infinite loops with zero-width matches + if (m.index === regEx.lastIndex) { + regEx.lastIndex++; + } + val = val.replace(m[0]," ").trim() + const flag = m[2] || m[1] // quoted entries in capture group 1, unquoted in capture group 2 + flags.type = flags.type || []; + flags.type.push(flag); } - var flags = {}; + return val; + } + + function search(val) { + const results = []; + const flags = {}; val = extractFlag(val,"invalid",flags); val = extractFlag(val,"unused",flags); val = extractFlag(val,"config",flags); val = extractFlag(val,"subflow",flags); val = extractFlag(val,"hidden",flags); val = extractFlag(val,"modified",flags); - val = extractValue(val,"flow",flags);// flow:active or flow: + val = extractValue(val,"flow",flags);// flow:current or flow: val = extractValue(val,"uses",flags);// uses: + val = extractType(val,flags);// type: val = val.trim(); - var hasFlags = Object.keys(flags).length > 0; + const hasFlags = Object.keys(flags).length > 0; + const hasTypeFilter = flags.type && flags.type.length > 0 if (flags.flow && flags.flow.indexOf("current") >= 0) { let idx = flags.flow.indexOf("current"); - flags.flow[idx] = RED.workspaces.active();//convert active to flow ID + flags.flow[idx] = RED.workspaces.active();//convert 'current' to active flow ID } if (flags.flow && flags.flow.length) { flags.flow = [ ...new Set(flags.flow) ]; //deduplicate } - if (val.length > 0 || typeFilter || hasFlags) { + if (val.length > 0 || hasFlags) { val = val.toLowerCase(); - var i; - var j; - var list = []; - var nodes = {}; + let i; + let j; + let list = []; + const nodes = {}; let keys = []; if (flags.uses) { keys = flags.uses; @@ -145,10 +158,10 @@ RED.search = (function() { keys = Object.keys(index); } for (i=0;i -1) { - var ids = Object.keys(index[key]||{}); + const key = keys[i]; + const kpos = val ? keys[i].indexOf(val) : -1; + if (kpos > -1 || (val === "" && hasFlags)) { + const ids = Object.keys(index[key]||{}); for (j=0;j -1) { + nodes[node.node.id] = nodes[node.node.id] || { node: node.node, label: node.label }; - nodes[node.node.id].index = Math.min(nodes[node.node.id].index||Infinity,kpos); + nodes[node.node.id].index = Math.min(nodes[node.node.id].index || Infinity, typeIndex > -1 ? typeIndex : kpos); } } } @@ -538,7 +555,7 @@ RED.search = (function() { $(previousActiveElement).trigger("focus"); } previousActiveElement = null; - } + } if(!keepSearchToolbar) { clearActiveSearch(); } @@ -630,7 +647,7 @@ RED.search = (function() { $("#red-ui-sidebar-shade").on('mousedown',hide); $("#red-ui-view-searchtools-close").on("click", function close() { - clearActiveSearch(); + clearActiveSearch(); updateSearchToolbar(); }); $("#red-ui-view-searchtools-close").trigger("click"); 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 3aeb7151f..43e525070 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 @@ -506,6 +506,13 @@ RED.subflow = (function() { RED.nodes.groups(id).forEach(function(n) { removedGroups.push(n); }) + + var removedJunctions = RED.nodes.junctions(id) + for (var i=0;i", {class: "red-ui-sidebar-help-toc"}).appendTo(stackContainer); var helpPanel = $("
").css({ - "overflow-y": "scroll" + "overflow-y": "auto" }).appendTo(stackContainer); panels = RED.panels.create({ @@ -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/tab-info-outliner.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js index 32491f297..c1a6d5705 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js @@ -135,6 +135,10 @@ RED.sidebar.info.outliner = (function() { RED.workspaces.show(n.id, null, true); } }); + RED.popover.tooltip(toggleVisibleButton, function () { + var isHidden = !div.hasClass("red-ui-info-outline-item-hidden"); + return RED._("sidebar.info." + (isHidden ? "hideFlow" : "showFlow")); + }); } if (n.type !== 'subflow') { var toggleButton = $('').appendTo(controls).on("click",function(evt) { @@ -613,6 +617,9 @@ RED.sidebar.info.outliner = (function() { objects[n.id].children = missingParents[n.id]; delete missingParents[n.id] } + if (objects[n.id].children.length === 0) { + objects[n.id].children.push(getEmptyItem(n.id)); + } } var parent = n.g||n.z||"__global__"; diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js index dfd4b1e43..cc8539363 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js @@ -98,7 +98,7 @@ RED.sidebar.info = (function() { propertiesPanelContent = $("
").css({ "flex":"1 1 auto", - "overflow-y":"scroll", + "overflow-y":"auto", }).appendTo(propertiesPanel); 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 fc5b8e99e..989cb78ab 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 @@ -269,8 +269,8 @@ RED.typeSearch = (function() { moveCallback = opts.move; RED.events.emit("type-search:open"); //shade.show(); - if ($("#red-ui-main-container").height() - opts.y - 150 < 0) { - opts.y = opts.y - 235; + if ($("#red-ui-main-container").height() - opts.y - 195 < 0) { + opts.y = opts.y - 275; } dialog.css({left:opts.x+"px",top:opts.y+"px"}).show(); searchResultsDiv.slideDown(300); 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 888fb4d7f..3588b38bf 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); @@ -814,7 +823,7 @@ 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 } @@ -979,13 +988,14 @@ RED.view.tools = (function() { * - it uses ` ` - 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)) { @@ -1005,7 +1015,7 @@ RED.view.tools = (function() { const nodeDef = n._def || RED.nodes.getType(n.type) if (nodeDef && nodeDef.defaults && nodeDef.defaults.name) { const paletteLabel = RED.utils.getPaletteLabel(n.type, nodeDef) - const defaultNodeNameRE = new RegExp('^'+paletteLabel+' (\\d+)$') + const defaultNodeNameRE = new RegExp('^'+paletteLabel.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')+' (\\d+)$') if (!typeIndex.hasOwnProperty(n.type)) { const existingNodes = RED.nodes.filterNodes({type: n.type}) let maxNameNumber = 0; @@ -1051,7 +1061,7 @@ RED.view.tools = (function() { } function addJunctionsToWires(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 } @@ -1079,6 +1089,7 @@ RED.view.tools = (function() { 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 = { @@ -1169,12 +1180,14 @@ RED.view.tools = (function() { }) 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); } 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 old mode 100755 new mode 100644 index bca3f47a6..d1fa236cf --- 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 @@ -585,11 +586,28 @@ RED.view = (function() { var group = $(ui.helper).data("group"); if (group) { + var oldX = group.x; + var oldY = group.y; RED.group.addToGroup(group, nn); + var moveEvent = null; + if ((group.x !== oldX) || + (group.y !== oldY)) { + moveEvent = { + t: "move", + nodes: [{n: group, + ox: oldX, oy: oldY, + dx: group.x -oldX, + dy: group.y -oldY}], + dirty: true + }; + } historyEvent = { t: 'multi', events: [historyEvent], + }; + if (moveEvent) { + historyEvent.events.push(moveEvent) } historyEvent.events.push({ t: "addToGroup", @@ -628,8 +646,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() }) @@ -988,6 +1008,7 @@ RED.view = (function() { 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; @@ -1067,12 +1088,15 @@ RED.view = (function() { RED.view.redraw(); } + // `point` is the place in the workspace the mouse has clicked. + // This takes into account scrolling and scaling of the workspace. var ox = point[0]; var oy = point[1]; + // Need to map that to browser location to position the pop-up const offset = $("#red-ui-workspace-chart").offset() - var clientX = ox + offset.left - var clientY = oy + offset.top + var clientX = (ox * scaleFactor) + offset.left - $("#red-ui-workspace-chart").scrollLeft() + var clientY = (oy * scaleFactor) + 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') @@ -1343,19 +1367,35 @@ RED.view = (function() { RED.editor.validateNode(nn); if (targetGroup) { + var oldX = targetGroup.x; + var oldY = targetGroup.y; RED.group.addToGroup(targetGroup, nn); + var moveEvent = null; + if ((targetGroup.x !== oldX) || + (targetGroup.y !== oldY)) { + moveEvent = { + t: "move", + nodes: [{n: targetGroup, + ox: oldX, oy: oldY, + dx: targetGroup.x -oldX, + dy: targetGroup.y -oldY}], + dirty: true + }; + } if (historyEvent.t !== "multi") { historyEvent = { t:'multi', events: [historyEvent] - } + }; } historyEvent.events.push({ t: "addToGroup", group: targetGroup, nodes: nn - }) - + }); + if (moveEvent) { + historyEvent.events.push(moveEvent); + } } if (spliceLink) { @@ -1691,6 +1731,7 @@ RED.view = (function() { // Check link splice or group-add if (movingSet.length() === 1 && movingSet.get(0).n.type !== "group") { + //}{//NIS node = movingSet.get(0); if (spliceActive) { if (!spliceTimer) { @@ -1779,6 +1820,9 @@ RED.view = (function() { } var i; var historyEvent; + if (d3.event.button === 2) { + return + } if (mouse_mode === RED.state.PANNING) { resetMouseVars(); return @@ -2047,11 +2091,25 @@ RED.view = (function() { if (mouse_mode == RED.state.MOVING_ACTIVE) { if (movingSet.length() > 0) { var addedToGroup = null; + var moveEvent = null; if (activeHoverGroup) { + var oldX = activeHoverGroup.x; + var oldY = activeHoverGroup.y; for (var j=0;j 0) { RED.notify(RED._("clipboard.nodeCopied",{count:nodeCount}),{id:"clipboard"}); @@ -2903,6 +2971,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; @@ -3281,11 +3350,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)), @@ -3348,6 +3423,9 @@ RED.view = (function() { } if (dblClickPrimed && mousedown_node == d && clickElapsed > 0 && clickElapsed < dblClickInterval) { mouse_mode = RED.state.DEFAULT; + // Avoid dbl click causing text selection. + d3.event.preventDefault() + document.getSelection().removeAllRanges() if (d.type != "subflow") { if (/^subflow:/.test(d.type) && (d3.event.ctrlKey || d3.event.metaKey)) { RED.workspaces.show(d.type.substring(8)); @@ -3411,6 +3489,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; } @@ -3441,11 +3520,25 @@ RED.view = (function() { updateActiveNodes(); } + var moveEvent = null; if (activeHoverGroup) { + var oldX = activeHoverGroup.x; + var oldY = activeHoverGroup.y; for (var j=0;j 0 && clickElapsed < dblClickInterval) { mouse_mode = RED.state.DEFAULT; RED.editor.editGroup(g); @@ -3867,6 +3978,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; @@ -4072,7 +4187,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);}}); @@ -4546,12 +4661,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; @@ -4844,9 +4957,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); } @@ -4863,6 +4987,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 && RED.runtime.started !== undefined) { + 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]) { @@ -5858,6 +5985,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) { @@ -5916,7 +6044,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); @@ -6218,6 +6346,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 4e913942e..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-gutter-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 a08e752d4..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; } @@ -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..eb550c6f5 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; @@ -30,7 +30,7 @@ bottom: 0px; left:0px; right: 0px; - overflow-y: scroll; + overflow-y: auto; } .red-ui-debug-filter-box { position:absolute; @@ -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 4104fd83e..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,16 +41,16 @@ height: 1px; margin: 9px 1px; overflow: hidden; - background-color: $menuDivider; + background-color: var(--red-ui-menuDivider); } & > li > a, & > li > a:focus { display: block; - padding: 4px 20px 4px 12px; + padding: 4px 12px 4px 32px; clear: both; font-weight: normal; line-height: 20px; - color: $menuColor; + color: var(--red-ui-menuColor); white-space: normal !important; outline: none; } @@ -58,22 +58,37 @@ & > 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); } } @@ -121,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); } } @@ -139,9 +154,9 @@ .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 { @@ -164,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: " "; @@ -187,10 +202,10 @@ 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: " "; @@ -208,20 +223,20 @@ margin-right: -15px; /* Caret Arrow */ border-color: transparent; - border-left-color: $menuCaret; + 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; @@ -232,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..b6d12faf2 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; + overflow-y: auto; + 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 { @@ -562,15 +562,15 @@ div.red-ui-button-small.red-ui-color-picker-opacity-slider-handle { .red-ui-icon-list { width: 308px; height: 200px; - overflow-y: scroll; + overflow-y: auto; line-height: 0px; 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 2e6de1932..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,15 +371,15 @@ 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; @@ -401,18 +408,18 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line { } } .red-ui-flow-junction-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; transition: transform 0.1s; opacity: 0; pointer-events: none; } .red-ui-flow-junction-background { - 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; transform: scale(1); transition: transform 0.1s; @@ -421,10 +428,10 @@ g.red-ui-flow-link-unknown path.red-ui-flow-link-line { } } .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 b7278b332..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..c0e87b7ba 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,12 +27,13 @@ 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; + overflow: auto; + max-height: 80vh; .ui-dialog-buttonset { margin-top: 20px; margin-bottom: 10px; @@ -50,13 +51,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 800f34079..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,11 +121,11 @@ .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; @@ -141,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; @@ -149,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; @@ -161,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; @@ -170,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; @@ -198,7 +200,7 @@ background: none; } .red-ui-palette-icon-fa { - color: $secondary-text-color; + color: var(--red-ui-secondary-text-color); font-size: 18px; } } @@ -249,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 { @@ -278,7 +280,7 @@ background: none; } .red-ui-palette-icon-fa { - color: $secondary-text-color; + color: var(--red-ui-secondary-text-color); font-size: 16px; } } @@ -318,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 e820992b4..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,14 @@ 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: ''; display: block; @@ -101,7 +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..a32fd53b4 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 @@ -26,10 +26,10 @@ } } #red-ui-project-settings-tab-settings { - overflow-y: scroll; + overflow-y: auto; } .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; @@ -183,7 +183,7 @@ } .red-ui-projects-dialog-project-list-inner-container { flex-grow: 1 ; - overflow-y: scroll; + overflow-y: auto; position:relative; .red-ui-editableList-border { border: none; @@ -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..db1bba3bb 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,21 @@ 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); + color: var(--red-ui-primary-text-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-secondary-text-color-disabled); } .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 cce1e69e4..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..94450f337 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 @@ -20,7 +20,7 @@ bottom: 0; left: 0; right: 0; - overflow-y: scroll; + overflow-y: auto; .red-ui-palette-category { &:not(.expanded) button { @@ -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 76345e980..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 { @@ -161,21 +161,21 @@ button.red-ui-typedInput-option-trigger 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); } } &: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 { @@ -208,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; @@ -231,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..5e0c7fa47 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; @@ -67,7 +67,7 @@ left: 0; bottom: 0; padding: 8px 20px 20px; - overflow-y: scroll; + overflow-y: auto; } .red-ui-settings-row { padding: 5px 10px 2px; 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..a5734570d 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 @@ -29,7 +29,7 @@ #red-ui-workspace-chart { overflow: auto; position: absolute; - bottom:25px; + bottom:26px; top: 35px; left:0px; right:0px; @@ -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": "

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.

" + + "

You can choose not to see this tour in the future by disabling it under the View tab of User Settings.

", + "ja": "

最初に、既に見つけている様に、新機能の本ツアーがあります。本ツアーは、新バージョンのNode-REDフローエディタを初めて開いた時のみ表示されます。

" + + "

ユーザ設定の表示タブの中で、この機能を無効化することで、本ツアーを表示しないようにすることもできます。

" + } + }, + { + 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": "

The main menu has been updated with a new 'Edit' section. This includes all of the familar options, like cut/paste and undo/redo.

" + + "

The menu now displays keyboard shortcuts for the options.

", + "ja": "

メインメニューに「編集」セクションが追加されました。本セクションには、切り取り/貼り付けや、変更操作を戻す/やり直しの様な使い慣れたオプションが含まれています。

" + + "

本メニューには、オプションのためのキーボードショートカットも表示されるようになりました。

" + } + }, + { + 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": "

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.

", + "ja": "

メニューの新しい「配置」セクションには、ノードの配置を助ける新しいオプションが提供されています。ノードの端を揃えたり、均等に配置したり、表示順序を変更したりできます。

" + } + }, + { + title: { + "en-US": "Hiding tabs", + "ja": "タブの非表示" + }, + element: "#red-ui-workspace-tabs > li.active", + description: { + "en-US": '

Tabs can now be hidden by clicking their icon.

The Info Sidebar will still list all of your tabs, and tell you which ones are currently hidden.', + "ja": '

アイコンをクリックすることで、タブを非表示にできます。

情報サイドバーには、全てのタブが一覧表示されており、現在非表示になっているタブを確認できます。' + }, + 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": "

The new tab menu also provides lots of new options for your tabs.

", + "ja": "

新しいタブメニューには、タブに関する沢山の新しいオプションが提供されています。

" + }, + 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": "

Flows and Groups can now have their own environment variables that can be referenced by nodes inside them.

", + "ja": "

フローとグループには、内部のノードから参照できる環境変数を設定できるようになりました。

" + } + }, + { + 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": "

Their edit dialogs have a new Environment Variables section.

", + "ja": "

編集ダイアログに環境変数セクションが追加されました。

" + } + }, + { + element: ".node-input-env-container-row", + direction: "left", + description: { + "en-US": '

The environment variables are listed in this table and new ones can be added by clicking the button.

', + "ja": '

この表に環境変数が一覧表示されており、ボタンをクリックすることで新しい変数を追加できます。

' + }, + 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": "

The Link Call node lets you call another flow that begins with a Link In node and get the result back when the message reaches a Link Out node.

", + "ja": "

Link Callノードを用いることで、Link Inノードから始まるフローを呼び出し、Link Outノードに到達した時に、結果を取得できます。

" + } + }, + { + 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": '

The MQTT nodes now support creating their connections and subscriptions dynamically.

', + "ja": '

MQTTノードは、動的な接続や購読ができるようになりました。

' + }, + }, + { + 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": "

The file nodes have been renamed to make it clearer which node does what.

", + "ja": "

fileノードの名前が変更され、どのノードが何を行うかが明確になりました。

" + } + }, + { + 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": "

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.

", + "ja": "

値を代入に、値のディープコピーを作成するオプションが追加されました。これによって参照ではなく、完全なコピーが作成されます。

" + } + }, + { + title: { + "en-US": "And that's not all...", + "ja": "これが全てではありません..." + }, + description: { + "en-US": "

There are many more smaller changes, including:

  • Auto-complete suggestions in the msg TypedInput.
  • Support for msg.resetTimeout in the Join node.
  • Pushing messages to the front of the queue in the Delay node's rate limiting mode.
  • An optional second output on the Delay node for rate limited messages.
", + "ja": "

以下の様な小さな変更が沢山あります:

  • msg TypedInputの自動補完提案
  • Joinノードでmsg.resetTimeoutのサポート
  • Delayノードの流量制御モードにおいて先頭メッセージをキューに追加
  • Delayノードで流量制限されたメッセージ向けの任意の2つ目の出力
" + } + } + ] +} 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": "

The Search dialog now keeps a history of your searches, making it easier to go back to a previous search.

", + "ja": "

検索ダイアログが検索履歴を保持するようになりました。これによって、過去の検索に戻りやすくなりました。

" + }, + 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": "

The editor has new options to restore the zoom level and scroll position when reloading the editor.

", + "ja": "

エディタを再読み込みした時に、拡大/縮小のレベルやスクロール位置を復元するための新しいオプションを利用できます。

" + }, + 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": `

A pair of new actions have been added to help with wiring nodes together:

+
    +
  • Wire Series Of Nodes - adds a wire (if necessary) between each pair of nodes in the order they were selected.
    • +
  • Wire Node To Multiple - wires the first node selected to all of the other selected nodes.
    • +
+

Actions can be accessed from the Action List in the main menu.

`, + "ja": `

ノード接続を支援する2つの新しい操作が追加されました:

+
    +
  • Wire Series Of Nodes - ノードを選択した順序で、各ノードのペアの間にワイヤーを(必要に応じて)追加します。
    • +
  • Wire Node To Multiple - 最初に選択したノードから、他の選択した全てのノードに対して、ワイヤーを追加します。
    • +
+

メインメニュー内の動作一覧から、これらの操作を利用できます。

` + }, + }, + { + title: { + "en-US": "Deleting nodes and reconnecting wires", + "ja": "ノードの削除とワイヤーの再接続" + }, + image: "2.2/images/delete-repair.gif", + description: { + "en-US": `

It is now possible to delete a selection of nodes and automatically repair the wiring behind them.

+

This is really useful if you want to remove a node from the middle of the flow.

+

Hold the Ctrl (or Cmd) key when you press Delete and the nodes will be gone and the wires repaired.

+ `, + "ja": `

選択したノードを削除した後、その背後にあるワイヤーを自動的に修復できるようになりました。

+

これは、フローの中からノードを削除する時に、とても便利に使えます。

+

Ctrl (またはCmd)キーを押しながらDeleteキーを押すと、ノードがなくなり、ワイヤーが修復されます。

+ ` + } + }, + { + title: { + "en-US": "Detaching nodes from a flow", + "ja": "フローからノードの切り離し" + }, + image: "2.2/images/detach-repair.gif", + description: { + "en-US": `

If you want to remove a node from a flow without deleting it, + you can use the Detach Selected Nodes action.

+

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.

+

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.

`, + "ja": `

ノードを削除することなく、フローからノードを除きたい場合は、Detach Selected Nodes操作を利用できます。

+

フローからノードが除かれた後、背後のワイヤーが修復され、ノードはマウスポインタにつながります。そのため、ワークスペースの好きな所にノードを配置できます。

+

この新しい操作に対して、デフォルトのキーボードショートカットは登録されていませんが、メイン設定ダイアログのキーボード設定から追加できます。

` + } + }, + { + title: { + "en-US": "More wiring tricks", + "ja": "その他のワイヤー操作" + }, + image: "2.2/images/slice.gif", + description: { + "en-US": `

A couple more wiring tricks to share.

+

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.

+

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.

`, + "ja": `

その他のいくつかのワイヤー操作

+

Ctrl (またはCmd)キーを押しながらワイヤーをクリックすることで、複数のワイヤーを選択できるようになりました。これによって、複数のワイヤーを一度に削除することが簡単になりました。

+

Ctrl (またはCmd)キーを押しながら、マウスの右ボタンを用いてドラッグすると、ワイヤーを切って削除できます。

` + } + }, + { + title: { + "en-US": "Subflow Output Labels", + "ja": "サブフローの出力ラベル" + }, + image: "2.2/images/subflow-labels.png", + description: { + "en-US": "

If a subflow has labels set for its outputs, they now get shown on the ports within the subflow template view.

", + "ja": "

サブフローの出力にラベルが設定されている場合、サブフローテンプレート画面内のポートにラベルが表示されるようになりました。

" + }, + }, + { + title: { + "en-US": "Node Updates", + "ja": "ノードの更新" + }, + // image: "images/", + description: { + "en-US": `
    +
  • The JSON node will now handle parsing Buffer payloads
    • +
  • The TCP Client nodes support TLS connections
    • +
  • The WebSocket node allows you to specify a sub-protocol when connecting
    • +
`, + "ja": `
    +
  • JSONノードが、バッファ形式のペイロードを解析できるようになりました。
    • +
  • TCPクライアントノードが、TLS接続をサポートしました。
    • +
  • WebSocketノードで、接続時にサブプロトコルを指定できるようになりました。
    • +
` + } + } + ] +} 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 4b6f5f66d..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,27 +1,30 @@ export default { - version: "3.0.0-beta.3", + version: "3.0.0", steps: [ { titleIcon: "fa fa-map-o", title: { - "en-US": "Welcome to Node-RED 3.0 Beta 3!", - "ja": "Node-RED 3.0 ベータ3へようこそ!" + "en-US": "Welcome to Node-RED 3.0!", + "ja": "Node-RED 3.0へようこそ!" }, description: { - "en-US": "

This is the final beta release of Node-RED 3.0.

Let's take a moment to discover the new features in this release.

", - // "ja": "

これはNode-RED 3.0の最初のベータリリースです。これには、最終リリースで計画しているほぼ全ての機能が含まれています。

本リリースの新機能を見つけてみましょう。

" + "en-US": "

Let's take a moment to discover the new features in this release.

", + "ja": "

本リリースの新機能を見つけてみましょう。

" } }, { title: { - "en-US": "Context Menu" + "en-US": "Context Menu", + "ja": "コンテキストメニュー" }, image: 'images/context-menu.png', description: { "en-US": `

The editor now has its own context menu when you right-click in the workspace.

This makes many of the built-in actions much easier - to access.

` + to access.

`, + "ja": `

ワークスペースで右クリックすると、エディタに独自のコンテキストメニューが表示されるようになりました。

+

これによって多くの組み込み動作を、より簡単に利用できます。

` } }, { @@ -34,10 +37,10 @@ export default { "en-US": `

To make it easier to route wires around your flows, it is now possible to add junction nodes that give you more control.

-

Junctions can be added to wires by holding the Alt key +

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.

`, - // "ja": `

フローのワイヤーの経路をより制御しやすくするために、分岐点ノードを追加できるようになりました。

- //

シフトキーを押しながら、マウスの右ボタンをクリックし、ワイヤーを横切るようにドラッグすることで、分岐点を追加できます。

` + "ja": `

フローのワイヤーの経路をより制御しやすくするために、分岐点ノードを追加できるようになりました。

+

Altキーとシフトキーを押しながらマウスをクリックし、ワイヤーを横切るようにドラッグすることで、分岐点を追加できます。

` }, }, { diff --git a/packages/node_modules/@node-red/editor-client/src/types/node-red/func.d.ts b/packages/node_modules/@node-red/editor-client/src/types/node-red/func.d.ts index ae411f33c..fd2adcbd8 100644 --- a/packages/node_modules/@node-red/editor-client/src/types/node-red/func.d.ts +++ b/packages/node_modules/@node-red/editor-client/src/types/node-red/func.d.ts @@ -14,6 +14,9 @@ declare var msg: NodeMessage; /** @type {string} the id of the incoming `msg` (alias of msg._msgid) */ declare const __msgid__:string; +declare const util:typeof import('util') +declare const promisify:typeof import('util').promisify + /** * @typedef NodeStatus * @type {object} diff --git a/packages/node_modules/@node-red/editor-client/src/vendor/jsonata/formatter.js b/packages/node_modules/@node-red/editor-client/src/vendor/jsonata/formatter.js index 3d1af605c..2431a8bbd 100644 --- a/packages/node_modules/@node-red/editor-client/src/vendor/jsonata/formatter.js +++ b/packages/node_modules/@node-red/editor-client/src/vendor/jsonata/formatter.js @@ -160,6 +160,7 @@ '$base64encode':{ args:[ ]}, '$boolean':{ args:[ 'arg' ]}, '$ceil':{ args:[ 'number' ]}, + '$clone': { args:[ 'arg' ]}, '$contains':{ args:[ 'str', 'pattern' ]}, '$count':{ args:[ 'array' ]}, '$decodeUrl':{ args:[ 'str' ]}, 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 734bce765..3f2992cd5 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 @@ -95,45 +95,64 @@ module.exports = function(RED) { } this.on("input", function(msg, send, done) { - var errors = []; - var props = this.props; + const errors = []; + let props = this.props; if (msg.__user_inject_props__ && Array.isArray(msg.__user_inject_props__)) { props = msg.__user_inject_props__; } delete msg.__user_inject_props__; - props.forEach(p => { - var property = p.p; - var value = p.v ? p.v : ''; - var valueType = p.vt ? p.vt : 'str'; + props = [...props] + function evaluateProperty(doneEvaluating) { + if (props.length === 0) { + doneEvaluating() + return + } + const p = props.shift() + const property = p.p; + const value = p.v ? p.v : ''; + const valueType = p.vt ? p.vt : 'str'; - if (!property) return; - - if (valueType === "jsonata") { - if (p.v) { - try { - var exp = RED.util.prepareJSONataExpression(p.v, node); - var val = RED.util.evaluateJSONataExpression(exp, msg); - RED.util.setMessageProperty(msg, property, val, true); + if (property) { + if (valueType === "jsonata") { + if (p.v) { + try { + var exp = RED.util.prepareJSONataExpression(p.v, node); + var val = RED.util.evaluateJSONataExpression(exp, msg); + RED.util.setMessageProperty(msg, property, val, true); + } + catch (err) { + errors.push(err.message); + } } - catch (err) { - errors.push(err.message); + evaluateProperty(doneEvaluating) + } else { + try { + RED.util.evaluateNodeProperty(value, valueType, node, msg, (err, newValue) => { + if (err) { + errors.push(err.toString()) + } else { + RED.util.setMessageProperty(msg,property,newValue,true); + } + evaluateProperty(doneEvaluating) + }) + } catch (err) { + errors.push(err.toString()); + evaluateProperty(doneEvaluating) } } - return; + } else { + evaluateProperty(doneEvaluating) } - try { - RED.util.setMessageProperty(msg,property,RED.util.evaluateNodeProperty(value, valueType, this, msg),true); - } catch (err) { - errors.push(err.toString()); - } - }); - - if (errors.length) { - done(errors.join('; ')); - } else { - send(msg); - done(); } + + evaluateProperty(() => { + if (errors.length) { + done(errors.join('; ')); + } else { + send(msg); + done(); + } + }) }); } 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 62da1b259..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 { @@ -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/24-complete.html b/packages/node_modules/@node-red/nodes/core/common/24-complete.html index a6a7a2a45..2f68a0fcf 100644 --- a/packages/node_modules/@node-red/nodes/core/common/24-complete.html +++ b/packages/node_modules/@node-red/nodes/core/common/24-complete.html @@ -1,6 +1,6 @@ diff --git a/packages/node_modules/@node-red/nodes/locales/en-US/function/80-template.html b/packages/node_modules/@node-red/nodes/locales/en-US/function/80-template.html index 07027e76e..52b6c2920 100644 --- a/packages/node_modules/@node-red/nodes/locales/en-US/function/80-template.html +++ b/packages/node_modules/@node-red/nodes/locales/en-US/function/80-template.html @@ -52,4 +52,7 @@ used to mark the templated sections. For example, to use [[ ]] instead, add the following line to the top of the template:

{{=[[ ]]=}}
+

Using environment variables

+

The template node can access environment variables using the syntax:

+ 
My favourite colour is {{env.COLOUR}}.
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 index 62d5f351f..9c055d47b 100644 --- a/packages/node_modules/@node-red/nodes/locales/en-US/messages.json +++ b/packages/node_modules/@node-red/nodes/locales/en-US/messages.json @@ -119,7 +119,10 @@ } }, "complete": { - "completeNodes": "complete: __number__" + "completeNodes": "complete: __number__", + "errors": { + "scopeUndefined": "scope undefined" + } }, "debug": { "output": "Output", @@ -181,8 +184,9 @@ "staticLinkCall": "Fixed target", "dynamicLinkCall": "Dynamic target (msg.target)", "dynamicLinkLabel": "Dynamic", - "error": { - "missingReturn": "Missing return node information" + "errors": { + "missingReturn": "Missing return node information", + "linkUndefined": "link undefined" } }, "tls": { @@ -446,7 +450,9 @@ "staticTopic": "Subscribe to single topic", "dynamicTopic": "Dynamic subscription", "auto-connect": "Connect automatically", - "auto-mode-depreciated": "This option is depreciated. Please use the new auto-detect mode." + "auto-mode-depreciated": "This option is depreciated. Please use the new auto-detect mode.", + "none": "none", + "other": "other" }, "sections-label": { "birth-message": "Message sent on connection (birth message)", @@ -554,7 +560,8 @@ }, "status": { "requesting": "requesting" - } + }, + "insecureHTTPParser": "Disable strict HTTP parsing" }, "websocket": { "label": { 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 @@

返却/sendの対象は次のとおりです:

  • 単一メッセージオブジェクト - 最初の出力に接続されたノードに渡されます
    • -
  • メッセージオブジェクトの配列 - 対応する出力に接続されたノードに渡されます
    • +
  • メッセージオブジェクトの配列 - 対応する出力に接続されたノードに渡されます

注: 初期化処理の実行はノードの初期化中に行われます。そのため、初期化処理タブにsendを記述した場合に後続ノードでメッセージを受け取れないことがあります。

配列要素が配列の場合には、複数のメッセージを対応する出力に送出します。

diff --git a/packages/node_modules/@node-red/nodes/locales/ja/function/80-template.html b/packages/node_modules/@node-red/nodes/locales/ja/function/80-template.html index 1a9c17453..9b64003a5 100644 --- a/packages/node_modules/@node-red/nodes/locales/ja/function/80-template.html +++ b/packages/node_modules/@node-red/nodes/locales/ja/function/80-template.html @@ -48,4 +48,7 @@

注: デフォルトでは、mustache形式は置換対象のHTML要素をエスケープします。これを抑止するには{{{三重}}}括弧形式を使います。

もし、コンテンツの中で{{ }}を出力する必要がある場合は、テンプレートで使われる記号文字を変えることもできます。例えば、[[ ]]を代わりに用いるには、テンプレートの先頭に以下の行を追加します。

{{=[[ ]]=}}
+

環境変数の利用

+

templateノードでは、次の構文を用いると環境変数にアクセスできます:

+ 
私の好きな色は{{env.COLOUR}}です。
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 c508a3e76..76e5c65dd 100644 --- a/packages/node_modules/@node-red/nodes/locales/ja/messages.json +++ b/packages/node_modules/@node-red/nodes/locales/ja/messages.json @@ -119,7 +119,10 @@ } }, "complete": { - "completeNodes": "complete: __number__" + "completeNodes": "complete: __number__", + "errors": { + "scopeUndefined": "スコープが未定義" + } }, "debug": { "output": "対象", @@ -181,8 +184,9 @@ "staticLinkCall": "対象を固定で指定", "dynamicLinkCall": "対象を動的に指定 (msg.target)", "dynamicLinkLabel": "動的", - "error": { - "missingReturn": "返却するノードの情報が存在しません" + "errors": { + "missingReturn": "返却するノードの情報が存在しません", + "linkUndefined": "リンクが未定義" } }, "tls": { @@ -446,7 +450,9 @@ "staticTopic": "1つのトピックを購読", "dynamicTopic": "動的な購読", "auto-connect": "自動接続", - "auto-mode-depreciated": "本オプションは非推奨になりました。新しい自動判定モードを使用してください。" + "auto-mode-depreciated": "本オプションは非推奨になりました。新しい自動判定モードを使用してください。", + "none": "なし", + "other": "その他" }, "sections-label": { "birth-message": "接続時の送信メッセージ(Birthメッセージ)", @@ -554,7 +560,8 @@ }, "status": { "requesting": "要求中" - } + }, + "insecureHTTPParser": "厳密なHTTPパース処理を無効化" }, "websocket": { "label": { @@ -928,6 +935,7 @@ "write": "write file", "read": "read file", "filename": "ファイル名", + "path": "パス", "action": "動作", "addnewline": "メッセージの入力のたびに改行を追加", "createdir": "ディレクトリが存在しない場合は作成", 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 @@
userProperties オブジェクト
MQTTv5: メッセージのユーザプロパティ
messageExpiryInterval 数値
-
MQTTv5: 秒単位のメッセージの有効期限
+
MQTTv5: 秒単位のメッセージの有効期限
topicAlias 数値
MQTTv5: 使用するMQTTトピックエイリアス
diff --git a/packages/node_modules/@node-red/nodes/locales/ko/messages.json b/packages/node_modules/@node-red/nodes/locales/ko/messages.json old mode 100755 new mode 100644 diff --git a/packages/node_modules/@node-red/nodes/locales/ru/messages.json b/packages/node_modules/@node-red/nodes/locales/ru/messages.json old mode 100755 new mode 100644 diff --git a/packages/node_modules/@node-red/nodes/package.json b/packages/node_modules/@node-red/nodes/package.json index 8c9d5adf7..818110f2f 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.2", + "version": "3.0.2", "license": "Apache-2.0", "repository": { "type": "git", @@ -25,10 +25,10 @@ "cookie": "0.5.0", "cors": "2.8.5", "cronosjs": "1.7.1", - "denque": "2.0.1", + "denque": "2.1.0", "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", diff --git a/packages/node_modules/@node-red/registry/lib/loader.js b/packages/node_modules/@node-red/registry/lib/loader.js index fc508aa57..d125156ab 100644 --- a/packages/node_modules/@node-red/registry/lib/loader.js +++ b/packages/node_modules/@node-red/registry/lib/loader.js @@ -43,37 +43,40 @@ function load(disableNodePathScan) { return loadModuleFiles(modules); } +function splitPath(p) { + return path.posix.normalize((p || '').replace(/\\/g, path.sep)).split(path.sep) +} function loadModuleTypeFiles(module, type) { const things = module[type]; - var first = true; - var promises = []; - for (var thingName in things) { + let first = true; + const promises = []; + for (let thingName in things) { /* istanbul ignore else */ if (things.hasOwnProperty(thingName)) { if (module.name != "node-red" && first) { // Check the module directory exists first = false; - var fn = things[thingName].file; - var parts = fn.split("/"); - var i = parts.length-1; - for (;i>=0;i--) { - if (parts[i] == "node_modules") { - break; - } + let moduleFn = module.path + const fn = things[thingName].file + const parts = splitPath(fn) + const nmi = parts.indexOf('node_modules') + if(nmi > -1) { + moduleFn = parts.slice(0,nmi+2).join(path.sep); + } + if (!moduleFn) { + // shortcut - skip calling statSync on empty string + break; // Module not found, don't attempt to load its nodes } - var moduleFn = parts.slice(0,i+2).join("/"); - try { - var stat = fs.statSync(moduleFn); + const stat = fs.statSync(moduleFn); } catch(err) { - // Module not found, don't attempt to load its nodes - break; + break; // Module not found, don't attempt to load its nodes } } try { - var promise; + let promise; if (type === "nodes") { promise = loadNodeConfig(things[thingName]); } else if (type === "plugins") { @@ -82,8 +85,7 @@ function loadModuleTypeFiles(module, type) { promises.push( promise.then( (function() { - var m = module.name; - var n = thingName; + const n = thingName; return function(nodeSet) { things[n] = nodeSet; return nodeSet; @@ -93,7 +95,6 @@ function loadModuleTypeFiles(module, type) { ); } catch(err) { console.log(err) - // } } } @@ -125,38 +126,24 @@ function loadModuleFiles(modules) { } var pluginList; var nodeList; - return Promise.all(pluginPromises).then(function(results) { pluginList = results.filter(r => !!r); - // Initial plugin load has happened. Ensure modules that provide - // plugins are in the registry now. - for (var module in modules) { - if (modules.hasOwnProperty(module)) { - if (modules[module].plugins && Object.keys(modules[module].plugins).length > 0) { - // Add the modules for plugins - if (!modules[module].err) { - registry.addModule(modules[module]); - } - } - } - } - return loadNodeSetList(pluginList); - }).then(function() { - return Promise.all(nodePromises); + return Promise.all(nodePromises) }).then(function(results) { nodeList = results.filter(r => !!r); // Initial node load has happened. Ensure remaining modules are in the registry for (var module in modules) { if (modules.hasOwnProperty(module)) { - if (!modules[module].plugins || Object.keys(modules[module].plugins).length === 0) { - if (!modules[module].err) { - registry.addModule(modules[module]); - } + if (!modules[module].err) { + registry.addModule(modules[module]); } } } + }).then(function() { + return loadNodeSetList(pluginList); + }).then(function() { return loadNodeSetList(nodeList); - }); + }) } async function loadPluginTemplate(plugin) { @@ -359,6 +346,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 da4006ecc..0c231552f 100644 --- a/packages/node_modules/@node-red/registry/lib/localfilesystem.js +++ b/packages/node_modules/@node-red/registry/lib/localfilesystem.js @@ -106,8 +106,8 @@ function getLocalNodeFiles(dir, skipValidNodeRedModules) { // 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) { + const packageDetails = getPackageDetails(dir) + if(packageDetails.isNodeRedModule) { return {files: [], icons: []}; } } @@ -135,17 +135,17 @@ function getLocalNodeFiles(dir, skipValidNodeRedModules) { return {files: result, icons: icons} } -function scanDirForNodesModules(dir,moduleName,package) { +function scanDirForNodesModules(dir,moduleName,packageDetails) { let results = []; let scopeName; let files try { 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 + if(packageDetails) { + dir = path.join(packageDetails.moduleDir,'..') + files = [path.basename(packageDetails.moduleDir)] + moduleName = (packageDetails.package ? packageDetails.package.name : null) || moduleName + isNodeRedModule = packageDetails.isNodeRedModule } else { files = fs.readdirSync(dir); if (moduleName) { @@ -156,6 +156,16 @@ function scanDirForNodesModules(dir,moduleName,package) { } } } + + // if we have found a package.json, this IS a node_module, lets see if it is a node-red node + if (!isNodeRedModule && files.indexOf('package.json') > -1) { + packageDetails = getPackageDetails(dir) // get package details + if(packageDetails && packageDetails.isNodeRedModule) { + isNodeRedModule = true + files = ['package.json'] // shortcut the file scan + } + } + for (let i=0;i} - 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/Flow.js b/packages/node_modules/@node-red/runtime/lib/flows/Flow.js index b5685d3ec..b5bedb2d6 100644 --- a/packages/node_modules/@node-red/runtime/lib/flows/Flow.js +++ b/packages/node_modules/@node-red/runtime/lib/flows/Flow.js @@ -818,6 +818,16 @@ function handlePreRoute(flow, sendEvent, reportError) { }) } +function deliverMessageToDestination(sendEvent) { + if (sendEvent?.destination?.node) { + try { + sendEvent.destination.node.receive(sendEvent.msg); + } catch(err) { + Log.error(`Error delivering message to node:${sendEvent.destination.node._path} [${sendEvent.destination.node.type}]`) + Log.error(err.stack) + } + } +} function handlePreDeliver(flow,sendEvent, reportError) { // preDeliver - the local router has identified the node it is going to send to. At this point, the message has been cloned if needed. hooks.trigger("preDeliver",sendEvent,(err) => { @@ -827,15 +837,10 @@ function handlePreDeliver(flow,sendEvent, reportError) { } else if (err !== false) { if (asyncMessageDelivery) { setImmediate(function() { - if (sendEvent.destination.node) { - sendEvent.destination.node.receive(sendEvent.msg); - } + deliverMessageToDestination(sendEvent) }) } else { - if (sendEvent.destination.node) { - sendEvent.destination.node.receive(sendEvent.msg); - - } + deliverMessageToDestination(sendEvent) } // postDeliver - the message has been dispatched to be delivered asynchronously (unless the sync delivery flag is set, in which case it would be continue as synchronous delivery) hooks.trigger("postDeliver", sendEvent, function(err) { 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..f37b922fc 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"); }); @@ -616,6 +641,7 @@ function getFlow(id) { if (node.type === 'link out') { delete node.wires; } + delete node.credentials; return node; }) } @@ -623,7 +649,10 @@ function getFlow(id) { if (flow.configs) { var configIds = Object.keys(flow.configs); result.configs = configIds.map(function(configId) { - return clone(flow.configs[configId]); + const node = clone(flow.configs[configId]); + delete node.credentials; + return node + }) if (result.configs.length === 0) { delete result.configs; @@ -635,12 +664,16 @@ function getFlow(id) { var subflow = clone(flow.subflows[subflowId]); var nodeIds = Object.keys(subflow.nodes); subflow.nodes = nodeIds.map(function(id) { - return subflow.nodes[id]; + const node = clone(subflow.nodes[id]) + delete node.credentials + return node }); if (subflow.configs) { var configIds = Object.keys(subflow.configs); subflow.configs = configIds.map(function(id) { - return subflow.configs[id]; + const node = clone(subflow.configs[id]) + delete node.credentials + return node }) } delete subflow.instances; @@ -790,7 +823,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/flows/util.js b/packages/node_modules/@node-red/runtime/lib/flows/util.js index 0f3435b77..7c98fc041 100644 --- a/packages/node_modules/@node-red/runtime/lib/flows/util.js +++ b/packages/node_modules/@node-red/runtime/lib/flows/util.js @@ -134,10 +134,12 @@ function createNode(flow,config) { subflowInstanceConfig, instanceConfig ); + // Register this subflow as an instance node of the parent flow. + // This allows nodes inside the subflow to get ahold of each other + // such as a node accessing its config node + flow.subflowInstanceNodes[config.id] = subflow subflow.start(); return subflow.node; - - Log.error(Log._("nodes.flow.unknown-type", {type:type})); } } catch(err) { Log.error(err); diff --git a/packages/node_modules/@node-red/runtime/lib/index.js b/packages/node_modules/@node-red/runtime/lib/index.js index 8e1d2b487..a886cd2ca 100644 --- a/packages/node_modules/@node-red/runtime/lib/index.js +++ b/packages/node_modules/@node-red/runtime/lib/index.js @@ -161,6 +161,8 @@ function start() { for (i=0;i { redNodes.startFlows() }).catch(function(err) {}); started = true; }); }); @@ -399,12 +401,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/Node.js b/packages/node_modules/@node-red/runtime/lib/nodes/Node.js index f20359b8a..7a7445a92 100644 --- a/packages/node_modules/@node-red/runtime/lib/nodes/Node.js +++ b/packages/node_modules/@node-red/runtime/lib/nodes/Node.js @@ -373,6 +373,11 @@ Node.prototype.send = function(msg) { if (msg === null || typeof msg === "undefined") { return; } else if (!util.isArray(msg)) { + // A single message has been passed in + if (typeof msg !== 'object') { + this.error(Log._("nodes.flow.non-message-returned", { type: typeof msg })); + return + } if (this._wire) { // A single message and a single wire on output 0 // TODO: pre-load flows.get calls - cannot do in constructor @@ -425,27 +430,31 @@ Node.prototype.send = function(msg) { for (k = 0; k < msgs.length; k++) { var m = msgs[k]; if (m !== null && m !== undefined) { - if (!m._msgid) { - hasMissingIds = true; + if (typeof m !== 'object') { + this.error(Log._("nodes.flow.non-message-returned", { type: typeof m })); + } else { + if (!m._msgid) { + hasMissingIds = true; + } + /* istanbul ignore else */ + if (!sentMessageId) { + sentMessageId = m._msgid; + } + sendEvents.push({ + msg: m, + source: { + id: this.id, + node: this, + port: i + }, + destination: { + id: wires[j], + node: undefined + }, + cloneMessage: msgSent + }); + msgSent = true; } - /* istanbul ignore else */ - if (!sentMessageId) { - sentMessageId = m._msgid; - } - sendEvents.push({ - msg: m, - source: { - id: this.id, - node: this, - port: i - }, - destination: { - id: wires[j], - node: undefined - }, - cloneMessage: msgSent - }); - msgSent = true; } } } 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/lib/storage/localfilesystem/projects/defaultFileSet.js b/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/defaultFileSet.js index 04b95e3e0..186c6d781 100644 --- a/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/defaultFileSet.js +++ b/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/defaultFileSet.js @@ -18,7 +18,7 @@ var i18n = require("@node-red/util").i18n; module.exports = { "package.json": function(project) { - var package = { + var packageDetails = { "name": project.name, "description": project.summary||i18n._("storage.localfilesystem.projects.summary"), "version": "0.0.1", @@ -30,11 +30,11 @@ module.exports = { }; if (project.files) { if (project.files.flow) { - package['node-red'].settings.flowFile = project.files.flow; - package['node-red'].settings.credentialsFile = project.files.credentials; + packageDetails['node-red'].settings.flowFile = project.files.flow; + packageDetails['node-red'].settings.credentialsFile = project.files.credentials; } } - return JSON.stringify(package,"",4); + return JSON.stringify(packageDetails,"",4); }, "README.md": function(project) { var content = project.name+"\n"+("=".repeat(project.name.length))+"\n\n"; diff --git a/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/git/index.js b/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/git/index.js index f9d809231..77b9ad2cd 100644 --- a/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/git/index.js +++ b/packages/node_modules/@node-red/runtime/lib/storage/localfilesystem/projects/git/index.js @@ -71,6 +71,8 @@ function runGitCommand(args,cwd,env,emit) { err.code = "git_missing_user"; } else if (/name consists only of disallowed characters/i.test(stderr)) { err.code = "git_missing_user"; + } else if (/nothing (add )?to commit/i.test(stdout)) { + return stdout; } throw err; }) @@ -106,7 +108,7 @@ function runGitCommandWithSSHCommand(args,cwd,auth,emit) { commandEnv.GIT_SSH = path.join(__dirname,"node-red-ssh.sh"); commandEnv.NODE_RED_KEY_FILE=auth.key_path; // GIT_SSH_COMMAND - added in git 2.3.0 - commandEnv.GIT_SSH_COMMAND = "ssh -i " + auth.key_path + " -F /dev/null"; + commandEnv.GIT_SSH_COMMAND = "ssh -i \"" + auth.key_path + "\" -F /dev/null"; // console.log('commandEnv:', commandEnv); return runGitCommand(args,cwd,commandEnv,emit).then( result => { rs.close(); @@ -419,7 +421,10 @@ module.exports = { }); }, initRepo: function(cwd) { - return runGitCommand(["init"],cwd); + var args = ["init", "--initial-branch", "main"]; + return runGitCommand(args, cwd).catch(function () { + return runGitCommand(["init"], cwd); + }); }, setUpstream: function(cwd,remoteBranch) { var args = ["branch","--set-upstream-to",remoteBranch]; diff --git a/packages/node_modules/@node-red/runtime/locales/de/runtime.json b/packages/node_modules/@node-red/runtime/locales/de/runtime.json old mode 100755 new mode 100644 index 6811ba86a..0249d638d --- a/packages/node_modules/@node-red/runtime/locales/de/runtime.json +++ b/packages/node_modules/@node-red/runtime/locales/de/runtime.json @@ -1,6 +1,6 @@ { "runtime": { - "welcome": "Willkommen bei Node-RED!", + "welcome": "Willkommen bei Node-RED", "version": "__component__ Version: __version__", "unsupported_version": "Nicht unterstützte Version von __component__. Erforderlich: __requires__, jedoch gefunden: __version__", "paths": { @@ -8,7 +8,6 @@ "httpStatic": "HTTP-Statisch: __path__" } }, - "server": { "loading": "Paletten-Nodes werden geladen", "palette-editor": { @@ -34,17 +33,19 @@ "install-failed-not-found": "Das Modul $t(server.install.install-failed-long) wurde nicht gefunden", "install-failed-name": "$t(server.install.install-failed-long). Ungültiger Modulname: __name__", "install-failed-url": "$t(server.install.install-failed-long). Ungültige URL: __url__", + "post-install-error": "Fehler bei der Ausführung des 'postInstall'-Hooks:", "upgrading": "Upgrade von Modul __name__ auf Version __version__ gestartet", "upgraded": "Upgrade von Modul __name__ war erfolgreich. Neustart von Node-RED für die Verwendung der neuen Version erforderlich.", "upgrade-failed-not-found": "Upgrade fehlgeschlagen. $t(server.install.install-failed-long). Version nicht gefunden.", "uninstalling": "Das Modul __name__ wird deinstalliert", "uninstall-failed": "Deinstallation fehlgeschlagen", "uninstall-failed-long": "Die Deinstallation des Moduls __name__ ist fehlgeschlagen:", - "uninstalled": "Das Modul __name__ ist deinstalliert" + "uninstalled": "Das Modul __name__ ist deinstalliert", + "old-ext-mod-dir-warning": "\n\n---------------------------------------------------------------------\nNode-RED 1.3 Verzeichnis externer Module erkannt:\n __oldDir__\nDieses Verzeichnis wird nicht mehr verwendet. Die externen Module werden\nin Ihrem Node-RED-Benutzerverzeichnis neu installiert:\n __newDir__\nLöschen Sie das alte externalModules-Verzeichnis, um diese Meldung abzustellen.\n---------------------------------------------------------------------\n" }, "deprecatedOption": "Die Verwendung von __old__ ist abgekündigt. Stattdessen __new__ verwenden.", "unable-to-listen": "Überwachen (listen) von __listenpath__ nicht möglich", - "port-in-use": "FEHLER: Port wird verwendet", + "port-in-use": "Fehler: Port wird verwendet", "uncaught-exception": "Nicht abgefangene Ausnahmebedingung:", "admin-ui-disabled": "Administrator-Benutzeroberfläche deaktiv", "now-running": "Server wird jetzt auf __listenpath__ ausgeführt", @@ -55,11 +56,10 @@ "refresh-interval": "Erneuerung der https-Einstellungen erfolgt alle __interval__ Stunden", "settings-refreshed": "https-Einstellungen wurden erneuert", "refresh-failed": "Erneuerung der https-Einstellungen fehlgeschlagen: __message__", - "nodejs-version": "httpsRefreshInterval erfordert Node.js 11 or later", + "nodejs-version": "httpsRefreshInterval erfordert Node.js 11 oder höher", "function-required": "httpsRefreshInterval erfordert die https-Eigenschaft in Form einer Funktion" } }, - "api": { "flows": { "error-save": "Fehler beim Speichern der Flows: __message__", @@ -77,17 +77,16 @@ "error-enable": "Der Node konnte nicht aktiviert werden:" } }, - "comms": { "error": "Kommunikationskanal-Fehler: __message__", "error-server": "Kommunikationsserver-Fehler: __message__", "error-send": "Kommunikationsende-Fehler: __message__" }, - "settings": { "user-not-available": "Einstellungen konnten nicht gespeichert werden: __message__", "not-available": "Einstellungen nicht verfügbar", - "property-read-only": "Die Eigenschaft '__prop__ 'ist schreibgeschützt" + "property-read-only": "Die Eigenschaft '__prop__' ist schreibgeschützt", + "readonly-mode": "Laufzeitumgebung im Nur-Lese-Modus. Änderungen werden nicht gespeichert." }, "library": { "unknownLibrary": "Unbekannte Bibliothek (Library): __library__", @@ -98,10 +97,12 @@ }, "nodes": { "credentials": { - "error": "Fehler beim Laden der Berechtigungen: __message__", - "error-saving": "Fehler beim Speichern der Berechtigungen: __message__", - "not-registered": "Der Berechtigung-Typ '__type__' ist nicht registriert", - "system-key-warning": "\n---------------------------------------------------------------------\nDie Datei mit den Flow-Berechtigungen wird mit einem vom System\ngenerierten Schlüssel verschlüsselt.\nWenn der vom System generierte Schlüssel aus irgendeinem Grund\nverloren geht, kann die Datei mit den Berechtigungen nicht\nwiederhergestellt werden. Sie muss dann gelöscht und die\nBerechtigungen müssen erneut eingestellt werden.\nEs sollte ein eigener Schlüssel mit Hilfe der Option\n'credentialSecret' in der Einstellungsdatei vorgegeben werden.\nNode-RED wird dann die Datei mit den Flow-Berechtigungen\nbei der nächsten Übernahme (deploy) einer Änderung erneut\nverschlüsseln.\n---------------------------------------------------------------------" + "error": "Fehler beim Laden der Credentials: __message__", + "error-saving": "Fehler beim Speichern der Credentials: __message__", + "not-registered": "Der Credentials-Typ '__type__' ist nicht registriert", + "system-key-warning": "\n---------------------------------------------------------------------\nDie Datei mit den Flow-Credentials wird mit einem vom System\ngenerierten Schlüssel verschlüsselt.\nWenn der vom System generierte Schlüssel aus irgendeinem Grund\nverloren geht, kann die Datei mit den Credentials nicht\nwiederhergestellt werden. Sie muss dann gelöscht und die\nCredentials müssen erneut eingestellt werden.\nEs sollte ein eigener Schlüssel mit Hilfe der Option\n'credentialSecret' in der Einstellungsdatei vorgegeben werden.\nNode-RED wird dann die Datei mit den Flow-Credentials\nbei der nächsten Übernahme (deploy) einer Änderung erneut\nverschlüsseln.\n---------------------------------------------------------------------", + "unencrypted": "Verwende unverschlüsselte Credentials", + "encryptedNotFound": "Verschlüsselte Credentials nicht gefunden" }, "flows": { "safe-mode": "Die Flows sind gestoppt im abgesicherten Modus. Übernahme (deploy) zum Starten.", @@ -121,6 +122,7 @@ "stopped-flows": "Flows sind gestoppt", "stopped": "gestoppt", "stopping-error": "Fehler beim Stoppen des Nodes: __message__", + "updated-flows": "Flows aktualisiert", "added-flow": "Flow wird hinzugefügt: __label__", "updated-flow": "Aktualisierter Flow: __label__", "removed-flow": "Entfernter Flow: __label__", @@ -145,7 +147,6 @@ } } }, - "storage": { "index": { "forbidden-flow-name": "Unzulässiger Flow-Name" @@ -159,6 +160,7 @@ "restore": "Die '__type__'-Dateisicherung wird wiederhergestellt: __path__", "restore-fail": "Die Wiederherstellung der '__type__'-Dateisicherung ist fehlgeschlagen: __message__", "fsync-fail": "Die Übertragung der Datei __path__ auf das Laufwerk ist fehlgeschlagen: __message__", + "warn_name": "Name der Flows-Datei nicht festgelegt. Name wird unter Verwendung des Hostnamens generiert.", "projects": { "changing-project": "Aktives Projekt wird festgelegt: __project__", "active-project": "Aktives Projekt: __project__", @@ -174,7 +176,6 @@ } } }, - "context": { "log-store-init": "Kontextspeicher: __name__ [__info__]", "error-loading-module": "Fehler beim Laden des Kontextspeichers: __message__", @@ -189,5 +190,4 @@ "error-write": "Fehler beim Schreiben des Kontextes: __message__" } } - } 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 3b46d0c9f..46890c26c 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 @@ -20,6 +20,7 @@ "errors-help": "Run with -v for details", "missing-modules": "Missing node modules:", "node-version-mismatch": "Node module cannot be loaded on this version. Requires: __version__ ", + "set-has-no-types": "Set does not have any types. name: '__name__', module: '__module__', file: '__file__'", "type-already-registered": "'__type__' already registered by module __module__", "removing-modules": "Removing modules from config", "added-types": "Added node types:", @@ -122,6 +123,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__", @@ -133,7 +135,8 @@ "flow": { "unknown-type": "Unknown type: __type__", "missing-types": "missing types", - "error-loop": "Message exceeded maximum number of catches" + "error-loop": "Message exceeded maximum number of catches", + "non-message-returned": "Node tried to send a message of type __type__" }, "index": { "unrecognised-id": "Unrecognised id: __id__", 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 df5f9fa08..8e4bceebe 100644 --- a/packages/node_modules/@node-red/runtime/locales/ja/runtime.json +++ b/packages/node_modules/@node-red/runtime/locales/ja/runtime.json @@ -20,6 +20,7 @@ "errors-help": "詳細は -v を指定して実行してください", "missing-modules": "不足しているノードモジュール:", "node-version-mismatch": "ノードモジュールはこのバージョンではロードできません。必要なバージョン: __version__ ", + "set-has-no-types": "セットに型がありません。 名前: '__name__', モジュール: '__module__', ファイル: '__file__'", "type-already-registered": "'__type__' はモジュール __module__ で登録済みです", "removing-modules": "設定からモジュールを削除します", "added-types": "追加したノード:", @@ -122,6 +123,7 @@ "stopped-flows": "フローを停止しました", "stopped": "停止しました", "stopping-error": "ノードの停止に失敗しました: __message__", + "updated-flows": "フローを更新しました", "added-flow": "フローを追加します: __label__", "updated-flow": "フローを更新しました: __label__", "removed-flow": "フローを削除しました: __label__", @@ -133,7 +135,8 @@ "flow": { "unknown-type": "不明なノード: __type__", "missing-types": "欠落したノード", - "error-loop": "メッセージの例外補足回数が最大値を超えました" + "error-loop": "メッセージの例外補足回数が最大値を超えました", + "non-message-returned": "ノードが __type__ 型のメッセージの送信を試みました" }, "index": { "unrecognised-id": "不明なID: __id__", diff --git a/packages/node_modules/@node-red/runtime/locales/ko/runtime.json b/packages/node_modules/@node-red/runtime/locales/ko/runtime.json old mode 100755 new mode 100644 diff --git a/packages/node_modules/@node-red/runtime/package.json b/packages/node_modules/@node-red/runtime/package.json index 7ee872153..c7d02e948 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.2", + "version": "3.0.2", "license": "Apache-2.0", "main": "./lib/index.js", "repository": { @@ -16,8 +16,8 @@ } ], "dependencies": { - "@node-red/registry": "3.0.0-beta.2", - "@node-red/util": "3.0.0-beta.2", + "@node-red/registry": "3.0.2", + "@node-red/util": "3.0.2", "async-mutex": "0.3.2", "clone": "2.1.2", "express": "4.18.1", diff --git a/packages/node_modules/@node-red/util/package.json b/packages/node_modules/@node-red/util/package.json index a75ecd7ff..66f5750b8 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.2", + "version": "3.0.2", "license": "Apache-2.0", "repository": { "type": "git", @@ -16,11 +16,11 @@ ], "dependencies": { "fs-extra": "10.1.0", - "i18next": "21.8.10", + "i18next": "21.8.16", "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 e089fea71..aaaccad22 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.2", + "version": "3.0.2", "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.2", - "@node-red/runtime": "3.0.0-beta.2", - "@node-red/util": "3.0.0-beta.2", - "@node-red/nodes": "3.0.0-beta.2", + "@node-red/editor-api": "3.0.2", + "@node-red/runtime": "3.0.2", + "@node-red/util": "3.0.2", + "@node-red/nodes": "3.0.2", "basic-auth": "2.0.1", "bcryptjs": "2.4.3", "express": "4.18.1", diff --git a/packages/node_modules/node-red/red.js b/packages/node_modules/node-red/red.js index 4763fd5a1..2f5ab354c 100755 --- a/packages/node_modules/node-red/red.js +++ b/packages/node_modules/node-red/red.js @@ -458,7 +458,7 @@ httpsPromise.then(function(startupHttps) { RED.start().then(function() { if (settings.httpAdminRoot !== false || settings.httpNodeRoot !== false || settings.httpStatic) { server.on('error', function(err) { - if (err.errno === "EADDRINUSE") { + if (err.code === "EADDRINUSE") { RED.log.error(RED.log._("server.unable-to-listen", {listenpath:getListenPath()})); RED.log.error(RED.log._("server.port-in-use")); } else { diff --git a/packages/node_modules/node-red/settings.js b/packages/node_modules/node-red/settings.js index d8f879851..ac58f280a 100644 --- a/packages/node_modules/node-red/settings.js +++ b/packages/node_modules/node-red/settings.js @@ -181,7 +181,7 @@ module.exports = { /** Some nodes, such as HTTP In, can be used to listen for incoming http requests. * By default, these are served relative to '/'. The following property - * can be used to specifiy a different root path. If set to false, this is + * can be used to specify a different root path. If set to false, this is * disabled. */ //httpNodeRoot: '/red-nodes', @@ -219,17 +219,17 @@ module.exports = { /** When httpAdminRoot is used to move the UI to a different root path, the * following property can be used to identify a directory of static content * that should be served at http://localhost:1880/. - * When httpStaticRoot is set differently to httpAdminRoot, there is no need + * When httpStaticRoot is set differently to httpAdminRoot, there is no need * to move httpAdminRoot */ //httpStatic: '/home/nol/node-red-static/', //single static source /* OR multiple static sources can be created using an array of objects... */ //httpStatic: [ - // {path: '/home/nol/pics/', root: "/img/"}, - // {path: '/home/nol/reports/', root: "/doc/"}, + // {path: '/home/nol/pics/', root: "/img/"}, + // {path: '/home/nol/reports/', root: "/doc/"}, //], - /** + /** * All static routes will be appended to httpStaticRoot * e.g. if httpStatic = "/home/nol/docs" and httpStaticRoot = "/static/" * then "/home/nol/docs" will be served at "/static/" @@ -242,6 +242,7 @@ module.exports = { /******************************************************************************* * Runtime Settings * - lang + * - runtimeState * - diagnostics * - logging * - contextStorage @@ -255,19 +256,31 @@ module.exports = { */ // lang: "de", - /** Configure diagnostics options + /** 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 - */ + * 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/Stopped + * 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 */ @@ -401,9 +414,9 @@ 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 + * for the full list, see https://microsoft.github.io/monaco-editor/docs.html#interfaces/editor.IStandaloneEditorConstructionOptions.html */ //fontSize: 14, //fontFamily: "Cascadia Code, Fira Code, Consolas, 'Courier New', monospace", @@ -506,7 +519,7 @@ module.exports = { */ //tlsConfigDisableLocalFiles: true, - /** The following property can be used to verify websocket connection attempts. + /** The following property can be used to verify WebSocket connection attempts. * This allows, for example, the HTTP request headers to be checked to ensure * they include valid authentication information. */ 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/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/15-change_spec.js b/test/nodes/core/function/15-change_spec.js index b8d7be03b..66f02d6d1 100644 --- a/test/nodes/core/function/15-change_spec.js +++ b/test/nodes/core/function/15-change_spec.js @@ -1717,6 +1717,24 @@ describe('change Node', function() { changeNode1.receive({topic:{foo:{bar:1}}, payload:"String"}); }); }); + it('moves the value of a message property object to itself', function(done) { + var flow = [{"id":"changeNode1","type":"change","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload","tot":"msg"}],"name":"changeNode","wires":[["helperNode1"]]}, + {id:"helperNode1", type:"helper", wires:[]}]; + helper.load(changeNode, flow, function() { + var changeNode1 = helper.getNode("changeNode1"); + var helperNode1 = helper.getNode("helperNode1"); + helperNode1.on("input", function(msg) { + try { + msg.should.have.property('payload'); + msg.payload.should.equal("bar"); + done(); + } catch(err) { + done(err); + } + }); + changeNode1.receive({payload:"bar"}); + }); + }); it('moves the value of a message property object to a sub-property', function(done) { var flow = [{"id":"changeNode1","type":"change","rules":[{"t":"move","p":"payload","pt":"msg","to":"payload.foo","tot":"msg"}],"name":"changeNode","wires":[["helperNode1"]]}, {id:"helperNode1", type:"helper", wires:[]}]; 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/network/21-httprequest_spec.js b/test/nodes/core/network/21-httprequest_spec.js index 688776289..14f3fd628 100644 --- a/test/nodes/core/network/21-httprequest_spec.js +++ b/test/nodes/core/network/21-httprequest_spec.js @@ -31,6 +31,8 @@ var multer = require("multer"); var RED = require("nr-test-utils").require("node-red/lib/red"); var fs = require('fs-extra'); var auth = require('basic-auth'); +const { version } = require("os"); +const net = require('net') describe('HTTP Request Node', function() { var testApp; @@ -1527,7 +1529,7 @@ describe('HTTP Request Node', function() { msg.payload.headers.should.have.property('Content-Type').which.startWith('application/json'); //msg.dynamicHeaderName should be present in headers with the value of msg.dynamicHeaderValue msg.payload.headers.should.have.property('dyn-header-name').which.startWith('dyn-header-value'); - //static (custom) header set in Flow UI should be present + //static (custom) header set in Flow UI should be present msg.payload.headers.should.have.property('static-header-name').which.startWith('static-header-value'); //msg.headers['location'] should be deleted because Flow UI "Location" header has a blank value //ensures headers with matching characters but different case are eliminated @@ -2265,4 +2267,105 @@ describe('HTTP Request Node', function() { }); }); }); + + describe('should parse broken headers', function() { + + const versions = process.versions.node.split('.') + + if (( versions[0] == 14 && versions[1] >= 20 ) || + ( versions[0] == 16 && versions[1] >= 16 ) || + ( versions[0] == 18 && versions[1] >= 5 ) || + ( versions[0] > 18)) { + // only test if on new enough NodeJS version + + let port = testPort++ + + let server; + + before(function() { + server = net.createServer(function (socket) { + socket.write("HTTP/1.0 200\nContent-Type: text/plain\n\nHelloWorld") + socket.end() + }) + + server.listen(port,'127.0.0.1', function(err) { + }) + }); + + after(function() { + server.close() + }); + + it('should accept broken headers', function (done) { + var flow = [{id:'n1',type:'http request',wires:[['n2']],method:'GET',ret:'obj',url:`http://localhost:${port}/`, insecureHTTPParser: true}, + {id:"n2", type:"helper"}]; + helper.load(httpRequestNode, flow, function() { + var n1 = helper.getNode("n1"); + var n2 = helper.getNode("n2"); + n2.on('input', function(msg) { + try { + msg.payload.should.equal('HelloWorld') + done() + } catch (err) { + done(err) + } + }) + n1.receive({payload: 'foo'}) + }); + }); + + it('should reject broken headers', function (done) { + var flow = [{id:'n1',type:'http request',wires:[['n2']],method:'GET',ret:'obj',url:`http://localhost:${port}/`}, + {id:"n2", type:"helper"}]; + helper.load(httpRequestNode, flow, function() { + var n1 = helper.getNode("n1"); + var n2 = helper.getNode("n2"); + n2.on('input', function(msg) { + try{ + msg.payload.should.match(/RequestError: Parse Error/) + done() + } catch (err) { + done(err) + } + }) + n1.receive({payload: 'foo'}) + + }); + }); + } + }); + + describe('multipart form posts', function() { + it('should send arrays as multiple entries', function (done) { + const flow = [ + { + id: 'n1', type: 'http request', wires: [['n2']], method: 'POST', ret: 'obj', url: getTestURL('/file-upload'), headers: [ + ] + }, + { id: "n2", type: "helper" } + ]; + helper.load(httpRequestNode, flow, function() { + var n1 = helper.getNode("n1"); + var n2 = helper.getNode("n2"); + n2.on('input', function(msg){ + try { + msg.payload.body.should.have.property('foo') + msg.payload.body.list.should.deepEqual(['a','b','c']) + done() + } catch (e) { + done(e) + } + }); + n1.receive({ + headers: { + 'content-type': 'multipart/form-data' + }, + payload: { + foo: 'bar', + list: [ 'a', 'b', 'c' ] + } + }); + }) + }); + }) }); diff --git a/test/nodes/core/network/21-mqtt_spec.js b/test/nodes/core/network/21-mqtt_spec.js index 655cc9c73..f97442b50 100644 --- a/test/nodes/core/network/21-mqtt_spec.js +++ b/test/nodes/core/network/21-mqtt_spec.js @@ -27,7 +27,7 @@ describe('MQTT Nodes', function () { } catch (error) { } }); - it('should be loaded and have default values', function (done) { + it('should be loaded and have default values (MQTT V4)', function (done) { this.timeout = 2000; const { flow, nodes } = buildBasicMQTTSendRecvFlow({ id: "mqtt.broker", name: "mqtt_broker", autoConnect: false }, { id: "mqtt.in", topic: "in_topic" }, { id: "mqtt.out", topic: "out_topic" }); helper.load(mqttNodes, flow, function () { @@ -61,6 +61,52 @@ describe('MQTT Nodes', function () { mqttBroker.options.clientId.should.containEql('nodered_'); mqttBroker.options.should.have.property('keepalive').type("number"); mqttBroker.options.should.have.property('reconnectPeriod').type("number"); + //as this is not a v5 connection, ensure v5 properties are not present + mqttBroker.options.should.not.have.property('protocolVersion', 5); + mqttBroker.options.should.not.have.property('properties'); + done(); + } catch (error) { + done(error) + } + }); + }); + it('should be loaded and have default values (MQTT V5)', function (done) { + this.timeout = 2000; + const { flow, nodes } = buildBasicMQTTSendRecvFlow({ id: "mqtt.broker", name: "mqtt_broker", autoConnect: false, cleansession: false, clientid: 'clientid', keepalive: 35, sessionExpiry: '6000', protocolVersion: '5', userProps: {"prop": "val"}}, { id: "mqtt.in", topic: "in_topic" }, { id: "mqtt.out", topic: "out_topic" }); + helper.load(mqttNodes, flow, function () { + try { + const mqttIn = helper.getNode("mqtt.in"); + const mqttOut = helper.getNode("mqtt.out"); + const mqttBroker = helper.getNode("mqtt.broker"); + + should(mqttIn).be.type("object", "mqtt in node should be an object") + mqttIn.should.have.property('broker', nodes.mqtt_broker.id); //should be the id of the broker node + mqttIn.should.have.property('datatype', 'utf8'); //default: 'utf8' + mqttIn.should.have.property('isDynamic', false); //default: false + mqttIn.should.have.property('inputs', 0); //default: 0 + mqttIn.should.have.property('qos', 2); //default: 2 + mqttIn.should.have.property('topic', "in_topic"); + mqttIn.should.have.property('wires', [["helper.node"]]); + + should(mqttOut).be.type("object", "mqtt out node should be an object") + mqttOut.should.have.property('broker', nodes.mqtt_broker.id); //should be the id of the broker node + mqttOut.should.have.property('topic', "out_topic"); + + should(mqttBroker).be.type("object", "mqtt broker node should be an object") + mqttBroker.should.have.property('broker', BROKER_HOST); + mqttBroker.should.have.property('port', BROKER_PORT); + mqttBroker.should.have.property('brokerurl'); + // mqttBroker.should.have.property('autoUnsubscribe', true);//default: true + mqttBroker.should.have.property('autoConnect', false);//Set "autoConnect:false" in brokerOptions + mqttBroker.should.have.property('options'); + mqttBroker.options.should.have.property('clean', false); + mqttBroker.options.should.have.property('clientId', 'clientid'); + mqttBroker.options.should.have.property('keepalive').type("number", 35); + mqttBroker.options.should.have.property('reconnectPeriod').type("number"); + //as this IS a v5 connection, ensure v5 properties are not present + mqttBroker.options.should.have.property('protocolVersion', 5); + mqttBroker.options.should.have.property('properties'); + mqttBroker.options.properties.should.have.property('sessionExpiryInterval'); done(); } catch (error) { done(error) @@ -173,7 +219,7 @@ describe('MQTT Nodes', function () { topic: nextTopic(), payload: '{prop:"value3", "num":3}', // send invalid JSON ... } - const hooks = { done: done, beforeLoad: null, afterLoad: null, afterConnect: null } + const hooks = { done: null, beforeLoad: null, afterLoad: null, afterConnect: null } hooks.afterLoad = (helperNode, mqttBroker, mqttIn, mqttOut) => { helperNode.on("input", function (msg) { try { @@ -299,7 +345,7 @@ describe('MQTT Nodes', function () { topic: nextTopic(), payload: '{prop:"value3", "num":3}', contentType: "application/json", // send invalid JSON ... } - const hooks = { done: done, beforeLoad: null, afterLoad: null, afterConnect: null } + const hooks = { done: null, beforeLoad: null, afterLoad: null, afterConnect: null } hooks.afterLoad = (helperNode, mqttBroker, mqttIn, mqttOut) => { helperNode.on("input", function (msg) { try { @@ -385,7 +431,7 @@ describe('MQTT Nodes', function () { if (skipTests) { return this.skip() } this.timeout = 2000; const options = {} - const hooks = { done: done, beforeLoad: null, afterLoad: null, afterConnect: null } + const hooks = { beforeLoad: null, afterLoad: null, afterConnect: null } hooks.beforeLoad = (flow) => { //add a status node pointed at MQTT Out node (to watch for connection status change) flow.push({ "id": "status.node", "type": "status", "name": "status_node", "scope": ["mqtt.out"], "wires": [["helper.node"]] });//add status node to watch mqtt_out } @@ -416,20 +462,66 @@ describe('MQTT Nodes', function () { this.timeout = 2000; const baseTopic = nextTopic(); const brokerOptions = { + autoConnect: false, protocolVersion: 4, birthTopic: baseTopic + "/birth", - birthPayload: "broker connected", + birthPayload: "broker birth", birthQos: 2, } - const options = {}; - const hooks = { done: done, beforeLoad: null, afterLoad: null, afterConnect: null }; - options.expectMsg = { + const expectMsg = { topic: brokerOptions.birthTopic, payload: brokerOptions.birthPayload, qos: brokerOptions.birthQos }; + const options = { }; + const hooks = { }; + hooks.afterLoad = (helperNode, mqttBroker, mqttIn, mqttOut) => { + helperNode.on("input", function (msg) { + try { + compareMsgToExpected(msg, expectMsg); + done(); + } catch (error) { + done(error) + } + }) + mqttIn.receive({ "action": "connect" }); //now request connect action + return true; //handled + } testSendRecv(brokerOptions, { topic: brokerOptions.birthTopic }, {}, options, hooks); }); + itConditional('should safely discard bad birth topic', function (done) { + if (skipTests) { return this.skip() } + this.timeout = 2000; + const baseTopic = nextTopic(); + const brokerOptions = { + protocolVersion: 4, + birthTopic: baseTopic + "#", // a publish topic should never have a wildcard + birthPayload: "broker connected", + birthQos: 2, + } + const options = {}; + const hooks = { done: null, beforeLoad: null, afterLoad: null, afterConnect: null }; + hooks.afterLoad = (helperNode, mqttBroker, mqttIn, mqttOut) => { + helperNode.on("input", function (msg) { + try { + msg.should.have.a.property("error").type("object"); + msg.error.should.have.a.property("source").type("object"); + msg.error.source.should.have.a.property("id", mqttIn.id); + done(); + } catch (err) { + done(err) + } + }); + return true; //handled + } + options.expectMsg = null; + try { + testSendRecv(brokerOptions, { topic: brokerOptions.birthTopic }, {}, options, hooks); + done() + } catch(err) { + done(e) + } + }); itConditional('should publish close message', function (done) { if (skipTests) { return this.skip() } this.timeout = 2000; @@ -587,12 +679,13 @@ function testSendRecv(brokerOptions, inNodeOptions, outNodeOptions, options, hoo const mqttBroker = helper.getNode(brokerOptions.id); const mqttIn = helper.getNode(nodes.mqtt_in.id); const mqttOut = helper.getNode(nodes.mqtt_out.id); - let afterLoadHandled = false; + let afterLoadHandled = false, finished = false; if (hooks.afterLoad) { afterLoadHandled = hooks.afterLoad(helperNode, mqttBroker, mqttIn, mqttOut) } if (!afterLoadHandled) { helperNode.on("input", function (msg) { + finished = true try { compareMsgToExpected(msg, expectMsg); if (hooks.done) { hooks.done(); } @@ -617,10 +710,12 @@ function testSendRecv(brokerOptions, inNodeOptions, outNodeOptions, options, hoo } }) .catch((e) => { + if(finished) { return } if (hooks.done) { hooks.done(e); } else { throw e; } }); } catch (err) { + if(finished) { return } if (hooks.done) { hooks.done(err); } else { throw err; } } @@ -666,6 +761,7 @@ function buildMQTTBrokerNode(id, name, brokerHost, brokerPort, options) { node.cleansession = String(options.cleansession) == "false" ? false : true; node.autoUnsubscribe = String(options.autoUnsubscribe) == "false" ? false : true; node.autoConnect = String(options.autoConnect) == "false" ? false : true; + node.sessionExpiry = options.sessionExpiry ? options.sessionExpiry : undefined; if (options.birthTopic) { node.birthTopic = options.birthTopic; @@ -760,8 +856,8 @@ function waitBrokerConnect(broker, timeLimit) { let waitConnected = (broker, timeLimit) => { const brokers = Array.isArray(broker) ? broker : [broker]; timeLimit = timeLimit || 1000; - let timer, resolved = false; return new Promise( (resolve, reject) => { + let timer, resolved = false; timer = wait(); function wait() { if (brokers.every(e => e.connected == true)) { diff --git a/test/nodes/core/parsers/70-CSV_spec.js b/test/nodes/core/parsers/70-CSV_spec.js index cb8d7ca09..681711b3b 100644 --- a/test/nodes/core/parsers/70-CSV_spec.js +++ b/test/nodes/core/parsers/70-CSV_spec.js @@ -693,19 +693,20 @@ 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,g,h,i,j,k", 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) { + // console.log("GOT",msg) try { - msg.should.have.property('payload', '4,foo,true,,0\n'); + msg.should.have.property('payload', '4,foo,true,,0,"Hello\nWorld",,,undefined,null,null\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", h:undefined, i:"undefined",j:null,k:"null" }; n1.emit("input", {payload:testJson}); }); }); @@ -717,13 +718,14 @@ describe('CSV node', function() { var n1 = helper.getNode("n1"); var n2 = helper.getNode("n2"); n2.on("input", function(msg) { + // console.log("GOT",msg) try { - msg.should.have.property('payload', '1,foo,"ba""r","di,ng"\n'); + msg.should.have.property('payload', '1,foo,"ba""r","di,ng",,undefined,null\n'); done(); } catch(e) { done(e); } }); - var testJson = { d:1, b:"foo", c:"ba\"r", a:"di,ng" }; + var testJson = { d:1, b:"foo", c:"ba\"r", a:"di,ng", e:undefined, f:"undefined", g:null,h:"null" }; n1.emit("input", {payload:testJson}); }); }); @@ -764,6 +766,33 @@ describe('CSV node', function() { }); }); + it('should handle a template with quotes in the property names', function(done) { + var flow = [ { id:"n1", type:"csv", temp:"", hdrout:"all", 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', 'a"a,b\'b\nA1,B1\nA2,B2\n'); + done(); + } + catch(e) { done(e); } + }); + var testJson = [ + { + "a\"a": "A1", + "b'b": "B1" + }, + { + "a\"a": "A2", + "b'b": "B2" + } + ] + n1.emit("input", {payload:testJson}); + }); + }); + it('should convert an array of objects to a multi-line csv', function(done) { var flow = [ { id:"n1", type:"csv", temp:"a,d,c,b", wires:[["n2"]] }, {id:"n2", type:"helper"} ]; @@ -777,7 +806,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 +819,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 +855,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 +873,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 +927,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/nodes/core/storage/10-file_spec.js b/test/nodes/core/storage/10-file_spec.js index 9d5aa033f..19026d457 100644 --- a/test/nodes/core/storage/10-file_spec.js +++ b/test/nodes/core/storage/10-file_spec.js @@ -194,6 +194,55 @@ describe('file Nodes', function() { }); }); + it('should append to a file and add newline, except last line of multipart input', function(done) { + var flow = [{id:"fileNode1", type:"file", name: "fileNode", "filename":fileToTest, "appendNewline":true, "overwriteFile":false, wires: [["helperNode1"]]}, + {id:"helperNode1", type:"helper"}]; + try { + fs.unlinkSync(fileToTest); + } catch(err) { + } + helper.load(fileNode, flow, function() { + var n1 = helper.getNode("fileNode1"); + var n2 = helper.getNode("helperNode1"); + var count = 0; + //var data = ["Line1", "Line2"]; + + n2.on("input", function (msg) { + try { + msg.should.have.property("payload"); + //data.should.containDeep([msg.payload]); + if (count === 3) { + var f = fs.readFileSync(fileToTest).toString(); + if (os.type() !== "Windows_NT") { + f.should.have.length(23); + f.should.equal("Line1\nLine2\nLine3\nLine4"); + } + else { + f.should.have.length(23); + f.should.equal("Line1\r\nLine2\r\nLine3\r\nLine4"); + } + done(); + } + count++; + } + catch (e) { + done(e); + } + }); + + n1.receive({payload:"Line1",parts:{index:0,type:"string"}}); // string + setTimeout(function() { + n1.receive({payload:"Line2",parts:{index:1,type:"string"}}); // string + },30); + setTimeout(function() { + n1.receive({payload:"Line3",parts:{index:2,type:"string"}}); // string + },60); + setTimeout(function() { + n1.receive({payload:"Line4",parts:{index:3,type:"string",count:4}}); // string + },90); + }); + }); + it('should append to a file after it has been deleted ', function(done) { var flow = [{id:"fileNode1", type:"file", name: "fileNode", "filename":fileToTest, "appendNewline":false, "overwriteFile":false, wires: [["helperNode1"]]}, {id:"helperNode1", type:"helper"}]; diff --git a/test/nodes/core/storage/23-watch_spec.js b/test/nodes/core/storage/23-watch_spec.js index a9942d5b1..dd7b94037 100644 --- a/test/nodes/core/storage/23-watch_spec.js +++ b/test/nodes/core/storage/23-watch_spec.js @@ -15,11 +15,14 @@ **/ var fs = require("fs-extra"); +var os = require("os"); var path = require("path"); var should = require("should"); var helper = require("node-red-node-test-helper"); var watchNode = require("nr-test-utils").require("@node-red/nodes/core/storage/23-watch.js"); +var arch = os.arch(); +var platform = os.platform(); describe('watch Node', function() { this.timeout(5000); @@ -89,7 +92,10 @@ describe('watch Node', function() { msg.should.have.property('payload', result.payload); msg.should.have.property('type', result.type); if('size' in result) { - msg.should.have.property('size', result.size); + if (!((arch === "arm64") && (platform === "darwin"))) { + // On OSX/ARM, two change events occur and first event do not reflect file size change. So ignore size field in the case. + msg.should.have.property('size', result.size); + } } count++; if(count === len) { 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/editor-api/lib/index_spec.js b/test/unit/@node-red/editor-api/lib/index_spec.js index 7308fdc2d..37bb82c13 100644 --- a/test/unit/@node-red/editor-api/lib/index_spec.js +++ b/test/unit/@node-red/editor-api/lib/index_spec.js @@ -61,7 +61,7 @@ describe("api/index", function() { should.not.exist(api.httpAdmin); done(); }); - describe('initalises admin api without adminAuth', function(done) { + describe('initalises admin api without adminAuth', function() { before(function() { beforeEach(); api.init({},{},{},{}); @@ -78,7 +78,7 @@ describe("api/index", function() { }) }); - describe('initalises admin api without editor', function(done) { + describe('initalises admin api without editor', function() { before(function() { beforeEach(); api.init({ disableEditor: true },{},{},{}); @@ -95,7 +95,7 @@ describe("api/index", function() { }) }); - describe('initialises api with admin middleware', function(done) { + describe('initialises api with admin middleware', function() { it('ignores non-function values',function(done) { api.init({ httpAdminRoot: true, httpAdminMiddleware: undefined },{},{},{}); const middlewareFound = api.httpAdmin._router.stack.filter((layer) => layer.name === 'testMiddleware') @@ -112,7 +112,7 @@ describe("api/index", function() { }); }); - describe('initialises api with authentication enabled', function(done) { + describe('initialises api with authentication enabled', function() { it('enables an oauth/openID based authentication mechanism',function(done) { const stub = sinon.stub(apiAuth, 'genericStrategy').callsFake(function(){}); @@ -135,7 +135,7 @@ describe("api/index", function() { }); - describe('initialises api with custom cors config', function (done) { + describe('initialises api with custom cors config', function () { const httpAdminCors = { origin: "*", methods: "GET,PUT,POST,DELETE" @@ -156,7 +156,7 @@ describe("api/index", function() { }) }); - describe('editor start', function (done) { + describe('editor start', function () { it('cannot be started when editor is disabled', function (done) { const stub = sinon.stub(apiEditor, 'start').callsFake(function () { diff --git a/test/unit/@node-red/registry/lib/localfilesystem_spec.js b/test/unit/@node-red/registry/lib/localfilesystem_spec.js index 3b1bb63f3..3ce74c158 100644 --- a/test/unit/@node-red/registry/lib/localfilesystem_spec.js +++ b/test/unit/@node-red/registry/lib/localfilesystem_spec.js @@ -329,17 +329,36 @@ describe("red/nodes/registry/localfilesystem",function() { 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('lower-case').should.greaterThan(-1, "Should load lower-case") + loaded.indexOf('@lowercase/lower-case2').should.greaterThan(-1, "Should load @lowercase/lower-case2") loaded.indexOf('testnode2').should.greaterThan(-1, "Should load testnode2") loaded.indexOf('test-theme2').should.greaterThan(-1, "Should load test-theme2") + loaded.should.have.a.property("length", 5) + // scoped module with nodes in same dir as package.json 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); + // node-red module with nodes in sub dir + nodeModule['@lowercase/lower-case2'].should.have.a.property('name','@lowercase/lower-case2'); + nodeModule['@lowercase/lower-case2'].should.have.a.property('version','2.0.0'); + nodeModule['@lowercase/lower-case2'].should.have.a.property('nodes'); + nodeModule['@lowercase/lower-case2'].nodes.should.have.a.property('lower-case'); + nodeModule['@lowercase/lower-case2'].should.have.a.property('path'); + nodeModule['@lowercase/lower-case2'].should.have.a.property('user', false); + + // scoped module with nodes in sub dir + nodeModule['lower-case'].should.have.a.property('name', 'lower-case'); + nodeModule['lower-case'].should.have.a.property('version','1.0.0'); + nodeModule['lower-case'].should.have.a.property('nodes'); + nodeModule['lower-case'].nodes.should.have.a.property('lower-case'); + nodeModule['lower-case'].should.have.a.property('path'); + nodeModule['lower-case'].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'); diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/lower-case2/lower-case.html b/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/lower-case2/lower-case.html new file mode 100644 index 000000000..617f48491 --- /dev/null +++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/lower-case2/lower-case.html @@ -0,0 +1,26 @@ + + + + + \ No newline at end of file diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/lower-case2/lower-case.js b/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/lower-case2/lower-case.js new file mode 100644 index 000000000..73579ba04 --- /dev/null +++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/lower-case2/lower-case.js @@ -0,0 +1,11 @@ +module.exports = function(RED) { +function LowerCaseNode(config) { + RED.nodes.createNode(this,config); + var node = this; + node.on('input', function(msg) { + msg.payload = msg.payload.toLowerCase(); + node.send(msg); + }); + } + RED.nodes.registerType("lower-case2",LowerCaseNode); +} \ No newline at end of file diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/package.json new file mode 100644 index 000000000..6b6ce9aa9 --- /dev/null +++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/@lower-case2/package.json @@ -0,0 +1,9 @@ +{ + "name" : "@lowercase/lower-case2", + "node-red" : { + "nodes": { + "lower-case": "lower-case2/lower-case.js" + } + }, + "version": "2.0.0" +} \ No newline at end of file diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/lower-case/lower-case.html b/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/lower-case/lower-case.html new file mode 100644 index 000000000..e57d51131 --- /dev/null +++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/lower-case/lower-case.html @@ -0,0 +1,26 @@ + + + + + diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/lower-case/lower-case.js b/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/lower-case/lower-case.js new file mode 100644 index 000000000..006b35eb6 --- /dev/null +++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/lower-case/lower-case.js @@ -0,0 +1,11 @@ +module.exports = function(RED) { + function LowerCaseNode(config) { + RED.nodes.createNode(this,config); + var node = this; + node.on('input', function(msg) { + msg.payload = msg.payload.toLowerCase(); + node.send(msg); + }); + } + RED.nodes.registerType("lower-case",LowerCaseNode); +} diff --git a/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/package.json b/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/package.json new file mode 100644 index 000000000..a632eaddd --- /dev/null +++ b/test/unit/@node-red/registry/lib/resources/nodesDir2/lower-case/package.json @@ -0,0 +1,9 @@ +{ + "name" : "lower-case", + "node-red" : { + "nodes": { + "lower-case": "lower-case/lower-case.js" + } + }, + "version": "1.0.0" +} diff --git a/test/unit/@node-red/runtime/lib/api/diagnostics_spec.js b/test/unit/@node-red/runtime/lib/api/diagnostics_spec.js index 07e499344..136e4826c 100644 --- a/test/unit/@node-red/runtime/lib/api/diagnostics_spec.js +++ b/test/unit/@node-red/runtime/lib/api/diagnostics_spec.js @@ -33,6 +33,11 @@ describe("runtime-api/diagnostics", function() { flowFile: "flows.json", mqttReconnectTime: 321, serialReconnectTime: 432, + socketReconnectTime: 2222, + socketTimeout: 3333, + tcpMsgQueueSize: 4444, + inboundWebSocketTimeout: 5555, + runtimeState: {enabled: true, ui: false}, adminAuth: {},//should be sanitised to "SET" httpAdminRoot: "/admin/root/", httpAdminCors: {},//should be sanitised to "SET" @@ -45,6 +50,7 @@ describe("runtime-api/diagnostics", function() { uiHost: "something.secret.com",//should be sanitised to "SET" uiPort: 1337,//should be sanitised to "SET" userDir: "/var/super/secret/",//should be sanitised to "SET", + nodesDir: "/var/super/secret/",//should be sanitised to "SET", contextStorage: { default : { module: "memory" }, file: { module: "localfilesystem" }, @@ -73,8 +79,9 @@ describe("runtime-api/diagnostics", function() { //result.runtime.xxxxx const runtimeCount = Object.keys(result.runtime).length; - runtimeCount.should.eql(4);//ensure no more than 4 keys are present in runtime + runtimeCount.should.eql(5);//ensure 5 keys are present in runtime result.runtime.should.have.property('isStarted',true) + result.runtime.should.have.property('flows') result.runtime.should.have.property('modules').type("object"); result.runtime.should.have.property('settings').type("object"); result.runtime.should.have.property('version','7.7.7'); @@ -87,7 +94,7 @@ describe("runtime-api/diagnostics", function() { //result.runtime.settings.xxxxx const settingsCount = Object.keys(result.runtime.settings).length; - settingsCount.should.eql(21);//ensure no more than the 21 settings listed below are present in the settings object + settingsCount.should.eql(27);//ensure no more than the 21 settings listed below are present in the settings object result.runtime.settings.should.have.property('available',true); result.runtime.settings.should.have.property('apiMaxLength', "UNSET");//deliberately disabled to ensure UNSET is returned result.runtime.settings.should.have.property('debugMaxLength', 1111); @@ -96,6 +103,11 @@ describe("runtime-api/diagnostics", function() { result.runtime.settings.should.have.property('flowFile', "flows.json"); result.runtime.settings.should.have.property('mqttReconnectTime', 321); result.runtime.settings.should.have.property('serialReconnectTime', 432); + result.runtime.settings.should.have.property('socketReconnectTime', 2222); + result.runtime.settings.should.have.property('socketTimeout', 3333); + result.runtime.settings.should.have.property('tcpMsgQueueSize', 4444); + result.runtime.settings.should.have.property('inboundWebSocketTimeout', 5555); + result.runtime.settings.should.have.property('runtimeState', {enabled: true, ui: false}); result.runtime.settings.should.have.property("adminAuth", "SET"); //should be sanitised to "SET" result.runtime.settings.should.have.property("httpAdminCors", "SET"); //should be sanitised to "SET" result.runtime.settings.should.have.property('httpAdminRoot', "/admin/root/"); @@ -109,6 +121,7 @@ describe("runtime-api/diagnostics", function() { result.runtime.settings.should.have.property("uiPort", "SET"); //should be sanitised to "SET" result.runtime.settings.should.have.property("userDir", "SET"); //should be sanitised to "SET" result.runtime.settings.should.have.property('contextStorage').type("object"); + result.runtime.settings.should.have.property('nodesDir', "SET") //result.runtime.settings.contextStorage.xxxxx const contextCount = Object.keys(result.runtime.settings.contextStorage).length; 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) {