Add support for `Arrangement.spacedBy`

[bitspittle]

See also: https://developer.android.com/reference/kotlin/androidx/compose/foundation/layout/Arrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.compose.ui.Alignment.Horizontal)

How would this get done in an html world?

[conradboehnke]

I think it would work with columnGap and rowGap but I'm not a CSS or HTML expert so It's possible that I say false stuff... :D

[bitspittle]

This bug was originally about spacedBy but I'd like to support all of:

• SpaceAround
• SpaceEvenly
• SpaceBetween
• spacedBy(...)

The first three should hopefully not be too bad, as that should just require adding some extra CSS rules for them. spacedBy may still be tricky because it's a function and not just an enum value I can add.

[bitspittle]

• ~~SpaceAround~~
• ~~SpaceEvenly~~
• ~~SpaceBetween~~
• spacedBy(...)

Supporting the three crossed off arrangement values was easy. There already was a direct CSS support for them.

spacedBy will require another pass later.

---

For more context, a call like this:

Row(horizontalArrangment = Arrangement.SpaceAround)

is simply converted into a class selector: .kobweb-row.kobweb-arrange-space-around

The relevant code in Row looks like this:

Div(modifier.asAttributesBuilder {
    classes("kobweb-row", horizontalArrangement.toClassName(), verticalAlignment.toClassName())
}

In contrast, spacedBy takes a dynamic value, so you can't just bake in a simple class name. Instead, I'd need to detect that spacedBy is a special type of Arrangment and then do something like this:

Div(modifier.asAttributesBuilder {
    when (horizontalArrangement) {
       is SpacedRowArrangement -> ... do something with rowGap, probably? ...
       else -> classes("kobweb-row", horizontalArrangement.toClassName(), verticalAlignment.toClassName())
    }
}

That should work, but the when statement seems a little messy, so I'd want to take a bit more time to think about it.

@conradboehnke I know it's been a long time, so if you don't respond, I won't mind. But would you still want spacedBy if you could have instead used, say, SpaceAround?