Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

USWDS - Feature: Move usa-input--[width] classes to the usa-input module #5312

Open
2 tasks done
jamigibbs opened this issue Jun 1, 2023 · 1 comment · May be fixed by #5935
Open
2 tasks done

USWDS - Feature: Move usa-input--[width] classes to the usa-input module #5312

jamigibbs opened this issue Jun 1, 2023 · 1 comment · May be fixed by #5935
Labels
Affects: Compiling Related to compiling Sass or JavaScript Needs: Discussion We need to discuss an approach to this issue Package: Forms Possible future enhancement Ideas that could be useful improvements in the future. Role: Dev Development/engineering skills needed Type: Feature Request New functionality

Comments

@jamigibbs
Copy link
Contributor

Is your feature request related to a problem? Please describe.

We have a need for applying the .usa-input--[width] class to a standalone web component. I had hoped that those classes were included with the usa-input module but they are instead in usa-form nested under the .usa-form class.

https://github.com/uswds/uswds/blob/develop/packages/usa-form/src/styles/_usa-form.scss

Being an individual component, I did not think it appropriate to wrap it with .usa-form just so that we could access the width classes. It seems like .usa-form is intended to be used on a wrapping element around an entire form.

Describe the solution you'd like

It would be ideal in our use case to have the usa-input--[width] available as part of the usa-input module. As it is now, we would need to copy those classes into our component library as a mixin which isn't ideal because we'd like to continue to pull them directly from the USWDS library instead.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

@jamigibbs jamigibbs added Status: Triage We're triaging this issue and grooming if necessary Type: Feature Request New functionality labels Jun 1, 2023
@thisisdano thisisdano added the Role: Dev Development/engineering skills needed label Jun 1, 2023
@mejiaj mejiaj added Package: Forms Affects: Compiling Related to compiling Sass or JavaScript Possible future enhancement Ideas that could be useful improvements in the future. and removed Status: Triage We're triaging this issue and grooming if necessary labels Jun 22, 2023
@aduth
Copy link
Contributor

aduth commented May 21, 2024

We ran into this issue recently in our project, since we don't include the usa-form package, but expected to be able to use width variants .usa-input--[width] since we do include the usa-input package.

This feels like a bug to me rather than a feature request, since I think it's reasonable to expect that including the package documented for a component (usa-input in the case of Text Input) would make available all of the usage options documented for that component.

@amyleadem amyleadem added the Needs: Discussion We need to discuss an approach to this issue label Oct 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Affects: Compiling Related to compiling Sass or JavaScript Needs: Discussion We need to discuss an approach to this issue Package: Forms Possible future enhancement Ideas that could be useful improvements in the future. Role: Dev Development/engineering skills needed Type: Feature Request New functionality
Projects
Status: Review
Development

Successfully merging a pull request may close this issue.

5 participants