Freeze Table Column

[madystricker]

Description

It would be great to be able to mark the first column of a table static, similar to freezing the first column in an Excel table.

Suggested solution

Create a True/False initialization arg for the mo.ui.table() component that freezes the first column if True.

Alternative

No response

Additional context

No response

[akshayka]

I like that idea! We could allow for freezing the first row too.

[hhk998402]

I can take a shot at this

[mscolnick]

hey @hhk998402 - that would be awesome! let me know if you need help or want to pair?

initial thoughts on how we can implement this:

• add frozen_columns to mo.ui.table(frozen_columns=)
  • for an initial version it could just be a number (e.g. 1, 2), but for something more complex, we could make it a list of strings as well which maps to the column names to pin
• Checkout frontend/src/components/data-table/column-wrapping for adding a custom table plugin
  • we can do something similar for frozen-columns
• then somewhere in frontend/src/components/data-table/data-table.tsx we can use this new plugin to check column.isFrozen() && "sticky" to make the header sticky

[wasimxyz]

@hhk998402 Were you still working on this? If not, I'll grab this one next.

[metaboulie]

@hhk998402 Were you still working on this? If not, I'll grab this one next.

Hey, I'm currently working on this and have almost fixed it, just some style issues TBD with Myles. I hope this won't bother you :P 🙂

[wasimxyz]

@metaboulie Oh nice! Looking forward to seeing it 🙂

[mscolnick]

Closed by https://github.com/marimo-team/marimo/issues/970