Feature/chips enter value on blur - #1
Closed
bakspace-itk wants to merge 8 commits into
Closed
Conversation
This change adds a blur event handler to the input_chips component that automatically commits the current input value as a new chip when the input field loses focus. This provides a better user experience by allowing users to add chips without explicitly pressing Enter. The implementation: - Uses the existing addValue() method to respect the new-value-mode setting - Only adds non-empty values (trimmed) - Clears the input field after adding the value 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Kristian Bak <kriba@aarhus.dk>
…s loss This change adds blur event handling to the input_chips component using Python event listeners instead of JavaScript. When the input field loses focus, any typed value is automatically added as a chip. Implementation details: - Added _handle_input_value_change() to track what user is typing - Added _handle_blur() to process the value when field loses focus - Respects new-value-mode setting (add, add-unique, toggle) - Added comprehensive tests for blur functionality with all modes The solution works by: 1. Listening to 'input-value' events to track current input 2. Listening to 'blur' events to trigger chip creation 3. Applying the appropriate new-value-mode logic (add/add-unique/toggle) 4. Updating the component value which triggers UI update Tests: - All existing tests pass - New test_input_chips_blur_adds_value() validates blur behavior for all modes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Kristian Bak <kriba@aarhus.dk>
The previous test didn't properly test the different new-value-mode behaviors. Now it mirrors the test_add_new_values test by: - Adding 'x' once - Adding 'y' twice - Validating that toggle mode removes the second 'y' (leaving only 'x') - Validating that add-unique mode keeps only one 'y' - Validating that add mode keeps both 'y' values This ensures blur behavior matches Enter key behavior for all modes. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Kristian Bak <kriba@aarhus.dk>
Documentation improvements: - Clarified docstring to explain blur behavior (Tab, click away) - Added explicit new_value_mode behavior descriptions with examples - Explained chip removal via "x" icon Code improvements: - Added explanatory comments in test showing expected behavior for each mode - Fixed linting warnings (use unpacking instead of concatenation) All tests pass, linting clean. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Kristian Bak <kriba@aarhus.dk>
The _handle_blur method doesn't use the event parameter - it only uses the tracked _current_input_value. Removing the parameter follows the NiceGUI pattern where handlers without event data don't take parameters. Pylint now rates the file 10.00/10. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Kristian Bak <kriba@aarhus.dk>
…m/bakspace-itk/nicegui into feature/chips_enter_value_on_blur
Added a comprehensive example showing how input_chips automatically adds values when the field loses focus (Tab, click away) in addition to Enter key. The example demonstrates all three new_value_mode options: - toggle: Adds if absent, removes if present - add: Always adds (allows duplicates) - add-unique: Only adds if not already present This provides users with a clear reference for the blur feature. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Kristian Bak <kriba@aarhus.dk>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Motivation
Implementation
Progress