Input width attribute

[apfohl]

This PR adds a new width attribute to inputs.

There are five possible values:

• full: 100%
• wide: 72rem
• half: 48rem
• narrow: 32rem
• slim: 16rem

I chose these value arbitrarily with some looks at our specified designs. So feel free to suggest others or wait for input from design. We can change them at a later point.

The new attribute is active for:

• TextField
• Select

As I only need these right now. But it super easy to add them to other components as well.

You can use the attribute like this:

class SingleTextFieldForm < ApplicationForm
  form do |my_form|
    my_form.text_field(
      name: :ultimate_answer,
      label: "Ultimate answer",
      required: true,
      caption: "The answer to life, the universe, and everything",
      width: :narrow
    )
  end
end

[changeset-bot]

🦋 Changeset detected

Latest commit: 21bff2a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@openproject/primer-view-components	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[apfohl]

Sorry was not meant to be created here.

[camertron]

@apfohl out of curiosity, where else would it be created?

[apfohl]

@camertron to the main branch of our own fork for now.

[camertron]

@apfohl ah ok I see 👍 Any chance you'd like to upstream your work?

[apfohl]

@camertron I can prepare a different PR because we diverged quite a bit by now. How are the chances of getting this merged?

[camertron]

@apfohl apologies for the late reply, I was at RubyConf last week 😎

Now that I think more about it, one of our design goals with the forms framework was to intentionally set field width to 100% and require that developers use the framework's grouping feature for layout, which can put multiple fields in the same logical row. So unfortunately for this particular change, we probably would not merge it unless a strong case could be made.

It sounds like you've contributed significantly to the project in your fork, and I would be glad to either take a look at PRs or discuss upstreaming other contributions 😄

[apfohl]

Thanks for the offer. Currently we are integrating primer as our new design system into our application. I only did a small part. But many of our changes correspond to special needs for our layout. Not sure if anything of this can be pushed to upstream. I'm not the expert for this.