Wrapper div affects layout

[jcheng5]

In the following example app, without with_spinner, the plot fills the card (the correct behavior). With with_spinner, the plot no longer fills. I'm guessing similar problems will arise with other flex/grid layouts.

I tried applying display: contents to the wrapper and was surprised it did not affect this behavior.

import matplotlib.pyplot as plt
from loading_spinners import with_spinner

from shiny import App, render, ui

app_ui = ui.page_sidebar(
    ui.sidebar(
        ui.input_slider("rows", "Rows", 0, 100, 20),
    ),
    ui.card(
        with_spinner(
            ui.output_plot("plot"),
        ),
    ),
)

def server(input, output, session):
    @render.plot
    def plot():
        plt.plot(list(range(input.rows())))
        plt.ylabel("some numbers")
        return plt.gcf()

app = App(app_ui, server)

[nstrayer]

It's because the fill behavior is largely built on css selectors like

.html-fill-container > .html-fill-item {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}

which display contents doesn't fix. So either we should update those or just default to using pure CSS pseudo-elements. Also, transferring this issue to the shiny-spinners repo as that's where the web-component updates are.