evidence-dev
Add freeze column to datatable
Description
Minimal implementation of a freezeColumn prop for DataTable, which freezes the first column on the left and allows you to scroll the other columns.
If rowNumbers are shown, these are not frozen - they will scroll away, leaving only the first column of the table frozen on the left.
Checklist
- [x] For UI or styling changes, I have added a screenshot or gif showing before & after
- [x] I have added a changeset
To Do
- Fix issue with white background in Firefox - overrides the border of the cells
- Fix issue with edges of white background on mobile - interferes with header bottom border
- Test on Windows and multiple browsers
🦋 Changeset detected
Latest commit: 639d47a42f50821398581e776ef24c793d98e87e
The changes in this PR will be included in the next version bump.
This PR includes changesets to release 4 packages
| Name | Type |
|---|---|
| @evidence-dev/core-components | Patch |
| @evidence-dev/components | Patch |
| @evidence-dev/evidence | Patch |
| evidence-test-environment | Patch |
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
![changeset-bot[bot] avatar](https://avatars.githubusercontent.com/in/28616?v=4 "Published by a pub.dev verified publisher"){kind=small}
The latest updates on your projects. Learn more about Vercel for Git ↗︎
| Name | Status | Preview | Comments | Updated (UTC) |
|---|---|---|---|---|
| docs | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jan 26, 2024 5:36pm |
![vercel[bot] avatar](https://avatars.githubusercontent.com/in/8329?v=4 "Published by a pub.dev verified publisher"){kind=small}
Deploy Preview for evidence-development-workspace ready!
| Name | Link |
|---|---|
| Latest commit | 639d47a42f50821398581e776ef24c793d98e87e |
| Latest deploy log | https://app.netlify.com/sites/evidence-development-workspace/deploys/65b3ed449ecb37000864fd6d |
| Deploy Preview | https://deploy-preview-1515--evidence-development-workspace.netlify.app |
| Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
To edit notification comments on pull requests, go to your Netlify site configuration.
![netlify[bot] avatar](https://avatars.githubusercontent.com/in/13473?v=4 "Published by a pub.dev verified publisher"){kind=small}
Why is the white background needed?
when you scroll horizontally, the content from the right columns will pass behind the frozen column - you can see it underneath if you don't set the background
Need to revisit this - would be a great feature to have, but it seems like the table needs to be aware of the width of the columns, which will require some thought