data_table is not responsive to the parent container and cannot be styled with tailwind or CSS.

[rohitsathish]

I'm having a hard time styling the data_table to my needs with tailwind and CSS. I understand there is a seperate properties list for data_table, but that doesn't contain all the properties I need to style the component. This is in addition to the fact that tailwind doesn't seem to work well with some chakra components like buttons, which makes tailwind styling a sort of hit and miss option when used with reflex.

Uncommenting any of the data_table styles or the parent box styles has no effect on the data table height or layout style.

import reflex as rx
import pandas as pd

# User interface
def index():
    return rx.box(
        rx.data_table(
            data = pd.DataFrame({"col1": list(range(100)), "col2": list(range(100))}),
            #class_name="border-2 border-blue-500",
            #style={"height": "20px", "border-spacing": "0px 0px", 'padding': "0px", "border": "2px solid blue"},
        ),
        #class_name="grid grid-rows-1 h-40 text-base p-4 border-2 border-green-500",
    )


@rx.page("/")
def page():
    return rx.box(index())


app = rx.App()
app.compile()