dash_table.DataTable style inheritance is not working as I expect. Below I set the style for columns in 3 examples. In the 1st example, style for both columns is aligned right, as expected. In the 2nd example, using both style_cell and style_cell_condtional, both columns are aligned left. I thought the ‘Result’ column would have been right aligned, the ‘Label’ column aligned left. In the 3rd example, both columns are aligned right, not as expected. What am I missing? Or what do I not understand about how inheritance works?
from dash import Dash, html, dash_table
test_dict = [
{"index": 0, "Label": "Line 1", "Out": 0},
{
"index": 1,
"Label": "Line 2",
"Out": 150000,
},
{
"index": 2,
"Label": "Line 3",
"Out": 40000,
},
{
"index": 3,
"Label": "Line 4",
"Out": 190000,
},
]
app = Dash(__name__)
app.layout = html.Div(
[
dash_table.DataTable(
data=test_dict,
columns=[
{"name": "Label", "id": "Label", "type": "numeric"},
{"name": "Result", "id": "Out", "type": "numeric"},
],
style_cell={"textAlign": "right"},
),
dash_table.DataTable(
data=test_dict,
columns=[
{"name": "Label", "id": "Label", "type": "numeric"},
{"name": "Result", "id": "Out", "type": "numeric"},
],
style_cell={"textAlign": "right"},
style_cell_conditional=[
{
"if": {"{column_id": "Label"},
"textAlign": "left",
},
],
),
dash_table.DataTable(
data=test_dict,
columns=[
{"name": "Label", "id": "Label", "type": "numeric"},
{"name": "Result", "id": "Out", "type": "numeric"},
],
style_cell={"textAlign": "right"},
style_cell_conditional=[
{
"if": {"{column_id": "Label"},
"textAlign": "left",
},
{
"if": {"{column_id": "Out"},
"textAlign": "right",
},
],
),
]
)
print(dash_table.version)
6.0.2
