Add "Send after Delay" option to number input widget

[Copilot]

Add "Send after Delay" option to number input widget

• Add delay and sendOnDelay properties to nodes/widgets/ui_number_input.html defaults
• Add validation for delay property (>= 0) in nodes/widgets/ui_number_input.html
• Add UI elements for "Send after Delay" option in nodes/widgets/ui_number_input.html template
• Update localization file nodes/widgets/locales/en-US/ui_number_input.json with delay-related labels
• Update localization file nodes/widgets/locales/de/ui_number_input.json with delay-related labels
• Implement delay logic in ui/src/widgets/ui-number-input/UINumberInput.vue (matching text input behavior)
• Add in-place upgrade handling in HTML for existing nodes (sets delay=0, sendOnDelay=true)
• Add in-place upgrade handling in JS with numeric validation and coercion
• Lint and build the code

Behavior

For New Nodes (default: sendOnDelay=false, delay=300ms)

• When typing: Messages are NOT sent on each keystroke
• When to send: Messages send only when user presses Enter or clicks away (blur)
• Purpose: Prevents sending intermediate values while user is typing multi-digit numbers

For Existing Nodes (upgraded with delay=0, sendOnDelay=true)

• Messages send immediately via the delay mechanism with 0ms delay
• Preserves the original immediate-send behavior for backward compatibility

When User Enables "Send after Delay"

• Typing debounces messages by the configured delay (e.g., 300ms)
• Each keystroke resets the timer
• Message sends after user stops typing for the delay duration

In-Place Upgrade Handling

• Existing nodes (where delay === undefined) are detected and configured with:
  • delay = 0 (immediate sending via delay mechanism)
  • sendOnDelay = true (to preserve existing behavior)
• Numeric validation ensures delay is always a valid integer >= 0

This implementation matches the text input widget behavior exactly, fixing the issue where keyboard entry of multi-digit numbers would send a message after each digit.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Number input widget needs the Send after Delay option</issue_title>
<issue_description>### Description

The number input widget ui-number-input does not have a Send after Delay option as the text input node does. The result is that if the keyboard is used to enter 1 2 3 then messages are sent after each digit. There is no way in the flow to ignore the first digits, other than adding a trigger node after it.

This effectively makes the node useless for keyboard entry of other than single digit numbers.

Have you provided an initial effort estimate for this issue?

I am no FlowFuse team member</issue_description>

<agent_instructions>There are two parts.

1. update nodes/widgets/ui_number_input.html node-red node edit panel to allow user to set a typing delay.
   This is already implemented in nodes/widgets/ui_text_input.html so use that as a reference.

2. Alter the vue component ui/src/widgets/ui-number-input/UINumberInput.vue to use the delay value to delay calling send(...). For reference, ui/src/widgets/ui-text-input/UITextInput.vue already does this.</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes Number input widget needs the Send after Delay option #1999

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[colinl]

When Send on Delay is not selected then the behaviour should not be as present, there should be nothing sent on change.
Does the change allow for only positive numbers, including 0, to be specified for the delay?
Does the code work if the delay is set to 0?
It is also necessary to cope with the situation where a user upgrades the node when there is already a number node in the flow. In this case, in order to keep the same behaviour, send on delay should be enabled, with a time of 0.

[Steve-Mcl]

@copilot

It is also necessary to cope with the "in-place upgrade" situation (where a user has updated their node-red to bring in this updated package).

Any existing instance of a ui-number-input node already added to the node-red canvas in the flow should behave as it did before, A test for this.delay being undefined in nodes/widgets/ui_progress.html will identify an "in-place upgrade situation". In these cases, the delay dom element should be set to "0" and the dom element for sendOnDelay should be programmatically turned on (checked). Also, in nodes/widgets/ui_number_input.js at line 9, a similar "in-place upgrade" test and default should be done. If config.delay is undefined then it signifies an in place upgrade and defaults should be set (i.e. config.delay = 0 and config.sendOnDelay = true.

Additional "is numeric" and is ">= 0" should be made to auto coerce the type/value of delay into a valid delay integer.

[Copilot]

@copilot

It is also necessary to cope with the "in-place upgrade" situation (where a user has updated their node-red to bring in this updated package).
...

Implemented in 32aec7c:

• HTML: Added check for this.delay === undefined to set delay=0 and sendOnDelay=true for upgraded nodes
• JS: Added similar check at line 9-12 with config.delay === undefined and numeric validation/coercion using Math.max(0, parseInt(config.delay, 10) || 0)

[Steve-Mcl]

@colinl

I tried a different approach with this one. I let copilot have a shot.
It took probably just as long to write the instructions and provide file hints and do fine tuning, however, tbf, it looks close!

If you have a chance to review before I do, please feel free to pull and test / review.

[colinl]

Tested works correctly with number input from previous version already in flow - defaulting to existing behaviour.
Tested works correctly with new widget added to flow.
Checked send on delay with 0 and non-zero timeout.
Checked that if send on delay not checked then does not send on change.
Checked validations on delay time field.

The help text (and presumably docs) should be updated.

Is copilot clever enough to generate tests?

[colinl]

Looking at the diffs, it has added <span> directives in the label for focus leave (line 244), which doesn't seem to be relevant to this PR. Some of the labels have the text in spans and some don't, I don't know whether they should be present or not. I don't see any other obvious issues.