[progressbar]: add support for variable width

[snowystinger]

Description

Bar loaders should support any width. It seems like we could specify all sub parts as percentages.

Why do you need this feature or component?

Someone asked how to do this with an indeterminate loader and was given the response that they must create their own styles and keyframes.

Additional context

I'm not sure if this is intentional, if so, then we should probably document it on the spectrum site or here.

synced to jira: https://jira.corp.adobe.com/browse/CSS-132

[GarthDB]

@badimon says that there's no real reason to not allow it to be flexible, but I'll need to dig into the indeterminate keyframes and styles. @snowystinger do you have any specific use cases I could use to test out a different width?

[snowystinger]

@GarthDB I do not know, but the conversation was here https://adobe.slack.com/archives/C7N5BE1EW/p1579716339061800

[GarthDB]

An example that seems to be doing it with just right and left properties https://codepen.io/holdencreative/pen/vEVbwv

[snowystinger]

FYI, just got back from a dive into css animation performance, we probably don't want to use left/right, it's apparently a general no no
still randomly thinking about this one, maybe something along these lines instead so we can take advantage of translateX
https://jsfiddle.net/snowystinger/r1t76cwv/1/

or constant fill size but variable bar size https://jsfiddle.net/snowystinger/fpzxk6s7/2/

[castastrophe]

@pfulton Do you know if this is still an outstanding question or has this issue been resolved during our rework of the component?

[pfulton]

@castastrophe with the new tokens definition, it looks like Design has specified that this component should have min and max width values: (see here in Spectrum Tokens)—but, we do make --mod-* prefixed overrides available for this, so if folks wanted to customize it, they could.

I don't know if that fully addresses the topic of conversation here, but it's an answer!

[castastrophe]

@pfulton Thank you so much! I'll close this out but @snowystinger, feel free to reopen if needed.