Awesome Panel Extensions Package - Change Log

In order to facility more rapid experimentation with and distribution of Panel extensions I’ve created and now launch the awesome-panel-extensions package.

The intent is to share extensions that maybe do not fit into Panel it self but have interest for me or the community or alternatively some extensions that might not be ready for Panel yet but needs to get out there and receive feedback to eventually reach a level where they can be contributed to Panel.

But who knows how this will develop over time. :slight_smile:

Please note that some of the extensions might make their way to Panel, a separate package, be deleted or change over time. So if you get something working consider whether it is important to pin the package version or maybe just copy the code into your project.

Feel free to share your comments, suggestions, ideas etc. Feel free to help improve the documentation, contribute your own extensions etc.

Repository: https://github.com/MarcSkovMadsen/awesome-panel-extensions
PyPi: https://pypi.org/project/awesome-panel-extensions/
Docs: https://awesome-panel.readthedocs.io/en/latest/packages/awesome-panel-extensions/index.html

PandasProfilerReport Added

I’ve added the first extension. It’s a PandasProfilerReport pane that allows you to show a ProfileReport in Panel.

PandasProfileReportNotebook

Check out the reference guide on binder

or use it via awesome_panel_extensions.pane.PandasProfileReport.

Comments or suggestions are very welcome.

WebComponent Added

You can think of the WebComponent pane as a HTML pane that supports bidirectional communication and large data transfer.

The WebComponent pane makes it really, really easy using Python and a minimal amount of html, css or .js knowledge to extend Panel with your favorite .js widgets or libraries.

Do you want a Panel app that follow the Material, SAP Fiori or Uber Design Specification? Just use the WebComponent pane and implement the widgets you need.

The WebComponent pane is on the roadmap for panel. You can check out the progress via Github PR 1252

Checkout the reference guide on binder

or use it via awesome_panel_extensions.web_component.WebComponent.

… also added to the Awesome Panel Extension Guide

If you wan’t to learn about the different ways of extending Panel then checkout the Awesome Panel Extensions Guide.

There is a specific guide on WebComponent Extensions here. The below example is from this guide.

The core of the code is as simple as

class MWCButton(WebComponent):
    html = param.String("<mwc-button></mwc-button")
    attributes_to_watch = param.Dict({"label": "name", "icon": "icon", "raised":"raised"})
    events_to_watch = param.Dict({"click": "clicks"})

    raised=param.Boolean(default=True)
    icon=param.ObjectSelector(default="favorite", objects=MWC_ICONS, allow_None=True)
    clicks = param.Integer()

    height = param.Integer(default=30)

mwc_button = MWCButton(name="Click Me!")
1 Like

LinkButtons Added

I wanted to enable a standard header with links to binder etc. in the notebook examples. So I created the concept of LinkButtons and added some to the package.

For now I’ve added ImageLinkButton, BinderLinkButton, NBViewerLinkButton and PanelLinkButton.

I guess also some “social” buttons like twitter, linkedin, facebook,reddit etc. could be added.

Checkout the reference notebook on binder

or use them via awesome_panel_extensions.widgets.link_buttons.

Let me know what you think.

1 Like

MaterialButton Added

In anticipation of the upcoming MaterialTemplate shipping with Panel 0.10, I’ve started working on Material widgets. They are based on Material Web Components.

I’ve added a MaterialButton to the awesome-panel-extensions package

MaterialButton

Check it out on binder

or use it via awesome_panel_extensions.frameworks.material.Button.

PerspectiveViewer Added

The PerspectiveViewer is perfect for interactive, streaming analytics of large amounts of data.

perspective-viewer

Check it out on binder

or use it via awesome_panel_extensions.widgets.PerspectiveViewer.

There are many things about the implementation of the PerspectiveViewer that could be improved. But it’s good enough for my use cases. If you want it improved or in included with Panel please create a feature request on Github. Thanks.

2 Likes

This is awesome! Combining the speed of Perspective and the convenience of serving apps with Panel would be a game-changer!
Would love to have this natively supported in Panel, @philippjfr : )

Great work @Marc!!

1 Like

Added Material Select and IntSlider

Feel free to share my tweets if you think they are awesome.


2 Likes

Added Material LinearProgress and CircularProgress

Feel free to share this tweet if you like.

PerspectiveViewer Update

I’ve improved the PerspectiveViewer widget by

  • Making it consistent with panel DataFrame widget by renaming data parameter to value
  • Adding support for streaming and patching data similar to Tabulator Widget.
  • Rewriting to Bokeh Extension
  • fixing some minor bugs

perspective_streaming

Use it via from awesome_panel_extensions.widgets.perspective_viewer import PerspectiveViewer

PivotTable.js Added

With the experience and code from the PerspectiveViewer and Tabulator it was pretty easy to add support for PivotTable.js.

It runs well on notebook and server in my experience.

Use it via from awesome_panel_extensions.widgets.tabulator import Tabulator.

The current implementation is very basic. If you need more let me know.

1 Like

FastButton added

The Fast extensions are based on the fast.design web components web component which are open sourced by Microsoft and probably will power the VS Code and Microsoft Office experience in the future.

image)

Please note that you can only use the Fast widgets inside a custom Panel template that

  • Wraps the content of the <body> html tag inside the <fast-design-system-provider> tag.
  • Loads the Fast javascript module dependencies.

We provide the FastTemplate for easy usage.

You can also develop your own custom Panel template if you need something special. For example combining it with more fast.design web components and the Fluent Design System to create VS Code and Microsoft Office like experiences.

Please also note that the Fast components do not work on legacy browser like Internet Explorer.

Use it via from awesome_panel_extensions.frameworks.fast import FastButton

image

fast-button

1 Like

If you like the FastButton above or feel Panel deserves a little more communication. Feel free to retweet


or upvote

or share

Fast Checkbox Added

fast-checkbox

Use it via from awesome_panel_extensions.frameworks.fast import FastCheckbox

Fast TextInput Added

fast-text-input

Use it via from awesome_panel_extensions.frameworks.fast import FastTextInput or checkout the reference guide on Binder.

FastAnchor Added

Use it via from awesome_panel_extensions.frameworks.fast import FastAnchor

Or checkout the reference guide

fast-anchor

FastTextAreaInput Added

Use it via from awesome_panel_extensions.frameworks.fast import FastTextAreaInput and checkout

fast-text-area

Unfortunately the fast-text-area attributes height and also autofocus, rows, min_length and spellcheck do not seem to work. Please upvote Fast Github Issue 3874 if you would like this solved.

FastLiteralAreaInput Added

Use it via from awesome_panel_extensions.frameworks.fast import FastLiteralAreaInput

FastLiteralAreaInput

FastLiteralInput

Use it via from awesome_panel_extensions.frameworks.fast import FastLiteralInput

Fast LiteralInput

FastSwitch Added

Use it via from awesome_panel_extensions.frameworks.fast import FastSwitch

Fast Switch