mdgriffith / style-elements

Create styles that don't mysteriously break!
http://package.elm-lang.org/packages/mdgriffith/style-elements/latest
BSD 3-Clause "New" or "Revised" License
445 stars 49 forks source link

table element has rows/columns transposed #93

Closed may-day closed 6 years ago

may-day commented 6 years ago

The big picture of what I'm trying to do

I'm trying to display tabular data using the table element.

What I did

Here's a sample view function to illustrate it.

view : Model -> Html.Html Msg
view model =
    Element.layout stylesheet <|
        table None []  [
               [text "r0c0", text "r0c1", text "r0c2"]
             , [text "r1c0", text "r1c1", text "r1c2"]
             , [text "r2c0", text "r2c1", text "r2c2"]
            ]

What I Expected To Happen

I expected the the output to be:

r0c0 r0c1 r0c2
r1c0 r1c1 r1c2
r2c0 r2c1 r2c2

What Actually Happened

r0c0 r1c0 r2c0
r0c1 r1c1 r2c1
r0c2 r1c2 r2c2

Why ( i think) it happens

the table function creates a grid with start = (row, col) in mdgriffith/style-elements/4.1.0/src/Element.elm:674

                                cell
                                    { start = ( row, col )
                                    , width = 1
                                    , height = 1
                                    , content = content
                                    }

but it is deconstructed as (col, row) in mdgriffith/style-elements/4.1.0/src/Style/Internal/Render/Value.elm:84

gridPosition (GridPosition { start, width, height }) =
    let
        ( x, y ) =
            start

        ( rowStart, rowEnd ) =
            ( y + 1, y + 1 + height )

        ( colStart, colEnd ) =
            ( x + 1, x + 1 + width )
....

same in src/Next/Internal/Model.elm:79

Versions

mdgriffith commented 6 years ago

Hi,

Tables are supposed to be used like this:

table Styles.None [ ]
    [ text "First name" :: List.map (text << .firstName) persons
    , text "Last name" :: List.map (text << .lastName) persons
    ]

I should have probably been better about the docs though :)