Is there a way to keep only react.main for moving objects around without the sidebar?

I want to move the objects around without sidebar, but this doesn’t seem to work.

import panel as pn

pn.extension()
pn.config.sizing_mode = 'stretch_width'

react = pn.template.ReactTemplate()
react.main[:, :6] = pn.Card(pn.widgets.Button())
react.main[:, 6:] = pn.Card(pn.widgets.Button())
pn.Card(react.main).servable()

Or keep the sidebar but, nest it under an object like card?

import panel as pn

pn.extension()
pn.config.sizing_mode = 'stretch_width'

react = pn.template.ReactTemplate()
react.main[:, :6] = pn.Card(pn.widgets.Button())
react.main[:, 6:] = pn.Card(pn.widgets.Button())
pn.Card(react).servable()

This functionality would be amazing !! :smiley:

1 Like

Hi @ahuang11 and @nghenzi

If you don’t put anything in the template.sidebar the sidebar should not be shown. At least that is the behavior of the other templates. You will still have the header bar though.

Regarding nesting Templates inside other Panel components. That is not possible for technical reasons.

The easiest way forward right now is to make a custom version of the React Template. I.e. copy the code and modify it. It would especially be the .html file that needs modification.

There is an old “work in progress” PR on Panel that would enable creating templates that do work inside Panel components. But in order for you to use it 1) The PR needs to be finished 2) Someone should copy the ReactTemplate into the new TemplatedHTML component.

Check the PR out here https://github.com/holoviz/panel/pull/1343

1 Like