I have a margin table

[letnull19A]

I catch bug:

code:

<GitLogPaged
      entries={dataSource}
      branchName="main"
      headCommitHash={dataSource[0].hash}
      onSelectCommit={(e) => console.log(e)}
      theme="dark"
    >
      <GitLogPaged.GraphCanvas2D />
      <GitLogPaged.Table />
    </GitLogPaged>

I use tailwind in my project, I think this packege support tailwind with no problem

[TomPlum]

This breaks the GraphHTMLGrid variant though. I made the HTML variant first, then added the 2D Canvas variant afterwards. Looks like we just need to apply the margin-top to the HTML one only. I'll raise a separate PR and do some local testing first.

[TomPlum]

Ah I've found the issue. It's actually the GraphCanvas2D component that renders too high, since it's missing the 12px of margin at the top, not the table that is too high. If you render GitLog.Tags too, you'll see that the horizontal lines of the tags are inline with the table row, but the graph is too high-up.

But this only happens when you have showHeaders set to false (it defaults to false). That's why it looks okay in the Storybook demo with the canvas rendering strategy. If you set showHeaders to true, it'll line-up properly.

<GitLogPaged
    entries={dataSource}
    branchName="main"
    headCommitHash={dataSource[0].hash}
    onSelectCommit={(e) => console.log(e)}
    theme="dark"
    showHeaders // <-- Temporary fix for now
>
   <GitLogPaged.GraphCanvas2D />
   <GitLogPaged.Table />
</GitLogPaged>

It's not right of course, I'll fix it in the develop branch this weekend.

[letnull19A]

yes, i am fixed it because turn on showHeaders and its actually works! Also I have mistakes with storybook, no resolve aliases started at @/

[TomPlum]

I've fixed it, but npmjs have disabled granular token access for publishing now so the release is failing to deploy. I'm just configuring trusted publishing so I can the latest version out for you.

[TomPlum]

The bug fix is in 3.5.1 @letnull19A. Thanks for raising the issue 🙏🏻

[letnull19A]

wait new version :)