Indenting Nested Rows Using Tabulator Wrapper V3 and Above

[BT-ACoffey]

What I'm trying to do:
I am trying to create a tabulator with a nested data tree structure where the first column is indented for _children rows. The formatter on the first column returns an anvil link component. The indentation is working as expected on tabulator wrapper version V2.2.22, but it is broken on versions V3.0 and above.

What I've tried and what's not working:
I have created a sample application to show the problem. I have included multiple formatters to test different anvil components and included a basic tabulator formatter for links (uncomment which formatter you would like to see). Change Tabulator dependency versions from V3+ to V2.2.22 and see the differences in indentation.

Steps for testing:

1. Add Tabulator dependency V2.2.22
2. Uncomment which formatter you want to see
3. Load app and see indentation working as expected
4. Switch to V3.0+, reload app and see indentation only works on the generic tabulator "formatter":"link"

Code Sample:

# this is a formatted code snippet.
# paste your code between ``` 
self.tabulator_1.columns = [
            {
                "title": "Identification",
                "field": "id",
                # "formatter": partial(format_as_button, self),
                # "formatter": partial(format_as_link, self),
                # "formatter": partial(format_as_form, self),
                # "formatter":"link",
            },

Clone link: https://anvil.works/build#clone:UWGOZES43SV4APBB=NW4DX5R3KMRWTZE4A4F2HRNR|67JINVT3WHRDQWVO=QESYD5IRZNZF6TBCDYHZ7R5Q
share a copy of your app

I created an Anvil Forum Post that can be found here: https://anvil.works/forum/t/indenting-nested-rows-using-tabulator-wrapper/24419?u=aaron.coffey

[s-cork]

Your clone link is to your bakertilly installation
You'll need to move the app to anvil.works for others to clone

[BT-ACoffey]

Sorry about that, moved the MVE app to anvil.works and updated the clone link: https://anvil.works/build#clone:UWGOZES43SV4APBB=NW4DX5R3KMRWTZE4A4F2HRNR|67JINVT3WHRDQWVO=QESYD5IRZNZF6TBCDYHZ7R5Q

[s-cork]

ok try this in your theme.css

if it fixes the issue without any other noticeable changes i might add it to this repo by default

.tabulator-cell > .anvil-component {
  display: inline-block;
}