Amazing work - quick question about reacton HOT 13 OPEN

with w.VBox() as main:
     ...

#!wget https://raw.githubusercontent.com/bloomberg/ipydatagrid/main/examples/cars.json
from ipydatagrid import DataGrid, TextRenderer, BarRenderer, Expr
from json import load
import pandas as pd

with open("./cars.json") as fobj:
    data = load(fobj)
df = pd.DataFrame(data["data"]).set_index("index")
df = df[sorted(df.columns)]

from bqplot import LinearScale, LogScale, ColorScale, OrdinalColorScale, OrdinalScale
from py2vega.functions.color import rgb
import reacton
import reacton.ipywidgets as w

def horsepower_coloring(cell):
    if cell.value < 100:
        return "red"
    elif cell.value < 150:
        return "orange"
    else:
        return "green"


def weight_coloring(cell):
    scaled_value = 1 if cell.value > 4500 else cell.value / 4500
    color_value = scaled_value * 255

    return rgb(color_value, 0, 0)


@reacton.component
def DataGridTest():
    acc_max, set_acc_max = reacton.use_state(20)
    use_log, set_use_log = reacton.use_state(False)
    renderers = {
        "Acceleration": BarRenderer.element(
            horizontal_alignment="center",
            bar_color=ColorScale(min=0, max=acc_max, scheme="viridis"),
            bar_value=LogScale(min=1, max=acc_max) if use_log else LinearScale(min=0, max=acc_max),
        ),
        "Cylinders": TextRenderer.element(
            background_color=Expr('"grey" if cell.row % 2 else default_value')
        ),
        "Displacement": TextRenderer.element(
            text_color=ColorScale(min=97, max=455),
            font=Expr(
                "'16px sans-serif' if cell.value > 400 else '12px sans-serif'"
            ),
        ),
        "Horsepower": TextRenderer.element(
            text_color="black", background_color=Expr(horsepower_coloring)
        ),
        "Miles_per_Gallon": TextRenderer.element(
            background_color=Expr('"grey" if cell.value is None else default_value')
        ),
        "Name": TextRenderer.element(
            background_color=Expr(
                'rgb(0, 100, 255) if "chevrolet" in cell.value or "ford" in cell.value else default_value'
            )
        ),
        "Origin": TextRenderer.element(
            text_color="black",
            background_color=OrdinalColorScale.element(domain=["USA", "Japan", "Europe"]),
            horizontal_alignment=Expr(
                "'right' if cell.value in ['USA', 'Japan'] else 'left'"
            ),
        ),
        "Weight_in_lbs": TextRenderer.element(
            text_color="black", background_color=Expr(weight_coloring)
        ),
        "Year": TextRenderer.element(text_color="black", background_color="green"),
    }
    
    with w.VBox() as main:
        w.IntSlider(value=acc_max, on_value=set_acc_max, description="Max acc.")
        w.Checkbox(value=use_log, on_value=set_use_log, description="Log acc.")
        DataGrid.element(
            dataframe=df, base_row_size=32, base_column_size=150, renderers=renderers
        )
    return main
display(DataGridTest())

@reacton.component
def Demo():
    with w.VBox() as main:
        w.Button(...)
        PerspectiveWidget.element(table, ...)
    return main

import pandas as pd
import numpy as np
from datetime import date, datetime
import perspective
import reacton.ipywidgets as w
import reacton


data = pd.DataFrame({
    "int": np.arange(100),
    "float": [i * 1.5 for i in range(100)],
    "bool": [True for i in range(100)],
    "date": [date.today() for i in range(100)],
    "datetime": [datetime.now() for i in range(100)],
    "string": [str(i) for i in range(100)]
})
table = perspective.Table(data, index="float")

@reacton.component
def Demo():
    with w.VBox() as main:
        w.Button(description="Hi")
        perspective.PerspectiveWidget.element(data=table)
    return main
Demo()

@reacton.component
def Demo():
    out = ipy.Output.element()
    with out:
        display(perspective.PerspectiveWidget(table))
    with w.VBox() as main:
        w.Button(description="Hi")
        out
    return main