🛠️ [TASK] : User Input Component - Token Value (Numerical Only)

[mike-mcnulty]

Summary

As a proposer, I need to be able to specify the budget I'm requesting, so that voters can evaluate my proposal's impact against its budget.

Use Cases:

• Budget Requested

Acceptance Criteria

• Placeholder value should be shown in view state until user response updated
• Placeholder value should be determined by the minimum value for the user's selected category (discuss for F14 scope)
• Subtitle shows the acceptable range for budget given selected category
• Component should not allow user to save budget if it falls outside the acceptable range for the selected category
• Component accepts numerical inputs only; integers only
• Widget is "currency-aware" based on what is specified in JSON
• Generic error states / error messages defined, to be tailored to specific F14 fields later, as needed

Designs

https://www.figma.com/design/1e1MMDXyi0oL9sG9IunWL7/UI-Kit-Figma-for-catalyst?node-id=5271-49626&t=gTh3B1j2eYONQrjf-0

Default

Selected

Editing

Filled

[dtscalac]

@mike-mcnulty How should the validation error be shown?

[mike-mcnulty]

@dtscalac imagine some prominent red text that tells me something like "You've entered a number outside of the acceptable range. Please enter a number within the range to save your response."

i think @seankdesigns working through adding some guidance on error state across these components