[question] Can you manually adjust the height of the aggregation display row? about mui-x HOT 6 CLOSED

You should find what you need in the following links:

https://mui.com/x/react-data-grid/row-height/#variable-row-height

https://codesandbox.io/s/agitated-surf-rghlwv?file=/Demo.js

Does that answer your question?

from mui-x.

This does indeed fix that, but it also causes other issues. Any way to set this without it causing overflow of columns that were previously working?

With it enabled I get this issue where my part descriptions overflow into my quantity column. Without this setting it was fine and would truncate at the end of the column as expected.

from mui-x.

Please provide a minimal reproduction test case with the latest version. This would help a lot 👷.
A live example would be perfect. This codesandbox.io template may be a good starting point. Thank you!

from mui-x.

Working on that recreation. Trying to simplify things as much as possible because our table is pretty heavy on custom cellRenderers and feature implementations. I'll probably have a link to it bright and early tomorrow.

Edit: Still working on this. Can't seem to get it to replicate just yet. Trying to find what settings in mine are different without fully recreating my whole setup.

from mui-x.

I actually figured it out. I can post the example if you'd like or you can just close it. In my custom cell renderer there was an overlap with some old tailwind css code that I accidentally left in that was causing it to not wrap properly.

In case anyone ever needs it for their own diagnosis, or just so you guys have it here's the problematic code and also the link to my sandbox setup

const PartCell = (params): JSX.Element => {
  return (
    <Stack>
      <Typography
        variant="subtitle1"
        fontWeight={"bold"}
        textTransform="uppercase"
        noWrap={false}
        sx={{ textDecoration: !params.row?.enabled ? "line-through" : "" }}
      >
        {params.row.part_num}
      </Typography>

      <Typography
        fontWeight="light"
        title={params.row?.part_description}
        className="truncate text-ellipsis" <- this line here
        variant="body2"
      >
        {params.row?.part_description}
      </Typography>
    </Stack>
  );
};

Sandbox: https://codesandbox.io/s/frosty-saha-rpqhlq

Thank you for your help along the way.

from mui-x.

👍

from mui-x.