import ipydatagrid as ipg
import pandas as pd
import numpy as np

# Columns
col_top_level = [
    "VeryLongValueFactors",
    "VeryLongValueFactors",
    "Even Longer Momentum Factors",
    "Even Longer Momentum Factors",
]
col_bottom_level = ["Factor_A", "Factor_B", "Factor_C", "Factor_D"]

# Rows
row_top_level = ["Sector 1", "Sector 1", "Sector 2", "Sector 2"]
row_bottom_level = ["Security A", "Security B", "Security C", "Security D"]

header_renderer = ipg.TextRenderer(
    background_color="moccasin",
    text_color="navy",
    vertical_alignment="top",
    horizontal_alignment="center",
)

default_renderer = ipg.TextRenderer(
    text_color=ipg.VegaExpr("cell.value <= 0 ? 'purple' : 'green'")
)

nested_df = pd.DataFrame(
    np.random.randn(4, 4).round(4),
    columns=pd.MultiIndex.from_arrays([col_top_level, col_bottom_level]),
    index=pd.MultiIndex.from_arrays(
        [row_top_level, row_bottom_level], names=("Sector", "Ticker")
    ),
)

nested_grid = ipg.DataGrid(
    nested_df,
    base_column_size=80,
    base_column_header_size=35,
    base_row_header_size=80,
    layout={"height": "180px"},
    header_renderer=header_renderer,
    default_renderer=default_renderer,
)

nested_grid