Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add IDOM pane #2004

Merged
merged 10 commits into from
Feb 25, 2021
Merged

Add IDOM pane #2004

merged 10 commits into from
Feb 25, 2021

Conversation

philippjfr
Copy link
Member

@philippjfr philippjfr commented Feb 24, 2021

This now works as well as I would hope both in the notebook and when deployed. One thing I had to do since I'm using preact rather than React is swap out the build paths and provide my own package.json. This also means that external JS components have to be served either by the Panel jupyter_server_extension or by the Bokeh server. I'll have to do some more testing that the Jupyter server extension is installed properly in all cases but that's technically separate from this PR. Another side-effect of this is that users have to go via pn.pane.IDOM.install (rather than idom.install) to install external packages to ensure that all the paths are set correctly.

One nicety I've provided for integration with Panel/Param is pn.pane.IDOM.use_param, which can be used like so to get a state value which mirrors a parameter or widget value:

aw = pn.widgets.IntSlider(name='a', start=0, end=20, value=1)
bw = pn.widgets.IntSlider(name='b', start=0, end=20, value=1)

@idom.component
def view():
    a = pn.pane.IDOM.use_param(aw)
    b = pn.pane.IDOM.use_param(bw.param.value) # equivalent to passing in the widget
    return idom.html.div({}, f'{a}+{b}={a+b}')

pn.Row(aw, bw, view)

Screen Shot 2021-02-25 at 12 34 56 PM

In the long-term I would still like to have a much simpler implementation which leverages idom-client-react and is shipped as a standalone bokeh extension in http://github.com/idom-team/idom-bokeh.

@MarcSkovMadsen
Copy link
Collaborator

Can you also set a parameter? So implementing a Material Slider in Idom but use the value of the slider outside Idom?

@philippjfr
Copy link
Member Author

Can you also set a parameter? So implementing a Material Slider in Idom but use the value of the slider outside Idom?

You can do whatever you like in the idom callbacks.

@codecov
Copy link

codecov bot commented Feb 25, 2021

Codecov Report

Merging #2004 (db6762b) into master (fd9e09c) will decrease coverage by 0.16%.
The diff coverage is 51.90%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #2004      +/-   ##
==========================================
- Coverage   84.81%   84.65%   -0.17%     
==========================================
  Files         166      168       +2     
  Lines       19997    20166     +169     
==========================================
+ Hits        16961    17072     +111     
- Misses       3036     3094      +58     
Impacted Files Coverage Δ
panel/pane/ace.py 100.00% <ø> (ø)
panel/pane/idom.py 46.15% <46.15%> (ø)
panel/io/server.py 62.39% <100.00%> (+0.43%) ⬆️
panel/io/state.py 60.19% <100.00%> (+0.19%) ⬆️
panel/models/__init__.py 100.00% <100.00%> (ø)
panel/models/idom.py 100.00% <100.00%> (ø)
panel/pane/__init__.py 100.00% <100.00%> (ø)
panel/param.py 89.07% <0.00%> (-0.09%) ⬇️
panel/widgets/input.py 95.83% <0.00%> (-0.04%) ⬇️
panel/pane/vtk/vtk.py 96.39% <0.00%> (-0.03%) ⬇️
... and 11 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update fd9e09c...db6762b. Read the comment docs.

@philippjfr philippjfr merged commit eaa5285 into master Feb 25, 2021
@philippjfr philippjfr deleted the idom branch February 25, 2021 18:29
@rmorshea
Copy link
Contributor

@philippjfr I started work on idom-bokeh, but haven't been able to get it to work unfortunately. The docs are a little thin when it comes to pre-built extensions so I haven't been able to make much more progress. I've written up an issue with some info on the errors I'm getting.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants