[Replace] Rose::Form::Label and <input.field> elements

[laurenolivia]

Description

This PR replaces instances of <input.label> with Hds::Form::Label, and those instances only exist on our role/grants form.

Update:
Usage of input.field cause a11y violations, so we agreed to expand the scope of this ticket to also refactor the input field.

🎟️ Jira ticket

Screenshots (if appropriate)

Before 👇

After 👇

How to Test

Checklist

• I have added before and after screenshots for UI changes
• I have added JSON response output for API changes
• I have added steps to reproduce and test for bug fixes in the description
• I have commented on my code, particularly in hard-to-understand areas
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
boundary-ui	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 2, 2025 2:57pm
boundary-ui-desktop	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 2, 2025 2:57pm

[hashicc]

With migrating just the label (Rose::Form::Label) and not the input (Rose::Form::Input) that yields the label (input.label) it looks like the a11y wiring between the label and the input is broken: a quick test for this is to click the label, Grant or New Grant and it should focus on the input. Instead of trying to restore the label linkage it might make more sense to migrate the Rose::Form::Input to Hds::Form::Input.

[laurenolivia]

With migrating just the label (Rose::Form::Label) and not the input (Rose::Form::Input) that yields the label (input.label) it looks like the a11y wiring between the label and the input is broken: a quick test for this is to click the label, Grant or New Grant and it should focus on the input. Instead of trying to restore the label linkage it might make more sense to migrate the Rose::Form::Input to Hds::Form::Input.

@hashicc thanks for the feedback!

cc: @DhariniJeeva - do you mind if we increase the scope of this ticket?

[laurenolivia]

With migrating just the label (Rose::Form::Label) and not the input (Rose::Form::Input) that yields the label (input.label) it looks like the a11y wiring between the label and the input is broken: a quick test for this is to click the label, Grant or New Grant and it should focus on the input. Instead of trying to restore the label linkage it might make more sense to migrate the Rose::Form::Input to Hds::Form::Input.

@hashicc thanks for the feedback!

cc: @DhariniJeeva - do you mind if we increase the scope of this ticket?

Oh, actually, I just checked our epics. It doesn't appear that we have a ticket for replacing Rose::Form::Input (we do have a ticket to retire the component, though), so if it's ok with you, I will just make that change within this PR and update the ticket to expand the scope?

[DhariniJeeva]

With migrating just the label (Rose::Form::Label) and not the input (Rose::Form::Input) that yields the label (input.label) it looks like the a11y wiring between the label and the input is broken: a quick test for this is to click the label, Grant or New Grant and it should focus on the input. Instead of trying to restore the label linkage it might make more sense to migrate the Rose::Form::Input to Hds::Form::Input.

@hashicc thanks for the feedback!
cc: @DhariniJeeva - do you mind if we increase the scope of this ticket?

Oh, actually, I just checked our epics. It doesn't appear that we have a ticket for replacing Rose::Form::Input (we do have a ticket to retire the component, though), so if it's ok with you, I will just make that change within this PR and update the ticket to expand the scope?

that's a good point, I'm totally ok with migrating the input in this PR

[ZedLi]

Looks good!

[priya-patel04]

Thanks for making the changes!