Add prefix and suffix to ui.input, and enable ui.number to support dy…

[Yuerchu]

This pull request adds support for prefix and suffix text to both the Input and Number elements in the NiceGUI library. These enhancements allow developers to easily display additional context before or after the input value, such as units or currency symbols. The changes include new constructor parameters, updates to property handling, and new setter methods.

Input element enhancements

• Added prefix and suffix parameters to the Input element constructor, allowing developers to specify text to display before or after the input value. [1] [2]
• Updated internal property handling in Input to store the prefix and suffix values if provided.
• Introduced set_prefix and set_suffix methods to dynamically update prefix and suffix text for the Input element.

Number element enhancements

• Added set_prefix and set_suffix methods to the Number element, enabling dynamic updates of prefix and suffix text.

[Copilot]

Pull request overview

This PR enhances both ui.input and ui.number elements by adding support for prefix and suffix text display, allowing developers to show contextual information like currency symbols or units alongside input values.

Key Changes

• Added prefix and suffix constructor parameters to ui.input element for displaying text before/after input values
• Introduced set_prefix() and set_suffix() setter methods for both ui.input and ui.number elements to enable dynamic updates
• Updated parameter documentation for both elements

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 8 comments.

File	Description
nicegui/elements/input.py	Added prefix/suffix constructor parameters and corresponding setter methods to the Input element
nicegui/elements/number.py	Added set_prefix() and set_suffix() methods to enable dynamic prefix/suffix updates for the Number element

[evnchn]

Hello @Yuerchu thanks for the PR. Other than the comments by GitHub copilot I don't have much to add for now.

But should we make it bindable as well?

[falkoschindler]

@evnchn I'm not so sure about binding methods. They add a lot of repetitive code and I don't really see the application for binding prefixes and suffixes. We can always add them later if needed.

[Yuerchu]

I've tried to fix some of the syntax issues pointed out by Copilot. But I don't have enough time in the short term to write unit tests.

[evnchn]

@Yuerchu I don't have permission to push for some reason, but here is the test code:

def test_input_with_prefix_suffix(screen: Screen):
    @ui.page('/')
    def page():
        n = ui.input(prefix='MyPrefix', suffix='MySuffix')

        def change_prefix_suffix():
            n.set_prefix('NewPrefix')
            n.set_suffix('NewSuffix')

        ui.button('Change', on_click=change_prefix_suffix)

    screen.open('/')
    screen.should_contain('MyPrefix')
    screen.should_contain('MySuffix')
    screen.click('Change')
    screen.should_contain('NewPrefix')
    screen.should_contain('NewSuffix')

Same for ui.number

[evnchn]

I don't have permission to push for some reason

Hmm how come? But I see "Maintainers are allowed to edit this pull request" though...

[evnchn]

Oh I know why: You are working on main, so therefore although in-principle maintainers are allowed to edit, they can't go so far as to edit the main branch.

@Yuerchu Please do not do that next time. Check https://github.com/zauberzeug/nicegui/blob/main/CONTRIBUTING.md#pull-requests for more details 🙏

[evnchn]

For some reason the web editor works, so I shoved 2 changes down your main 🤣

@falkoschindler The original checklist is missing. I think we only lack docs now, but do we need it? It already shows up because we defined the set_ methods...

Anyways this should be ready for review!

[Yuerchu]

Oh I know why: You are working on main, so therefore although in-principle maintainers are allowed to edit, they can't go so far as to edit the main branch.

@Yuerchu Please do not do that next time. Check https://github.com/zauberzeug/nicegui/blob/main/CONTRIBUTING.md#pull-requests for more details 🙏

Thanks for the reminder. I will create branches in future commits.