from awesome_panel_extensions.awesome_panel.notebook import Header
Header(folder="examples/reference/frameworks/fast", notebook="FastButton.ipynb")
The FastButton
widget is based on the fast-button web component and extends the built in Panel Button.
name
(str): The label of the Button
button_type
(str): A button theme. One of default
, primary
, success
, info
or danger
.
apperance
(string): Determines the appearance of the button. One of accent
, lightweight
, neutral
, outline
or stealth
. Defaults to neutral
.
autofocus
(bool): The autofocus attribute. Defaults to False
.
clicks
(int): The number of times the FastButton
has been clicked.
The FastButton
has the same layout and styling parameters as most other widgets. For example width
and sizing_mode
.
Please note that you can only use the Fast components inside a custom Panel template that
javascript
library.<body>
html tag inside the fast-design-system-provider tag.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 note that Fast components will not work in older, legacy browser like Internet Explorer.
Let's start by importing the dependencies
import param
import panel as pn
from awesome_panel_extensions.frameworks.fast import FastTemplate, FastButton
pn.config.sizing_mode = "stretch_width"
pn.extension()
Let's explore the parameters of the FastButton
.
button = FastButton(name="Click me", sizing_mode="fixed", width=200, appearance="accent")
button_parameters = ["name", "button_type", "disabled", "appearance", "autofocus", "clicks", "width", "height", "sizing_mode"]
app=pn.Row(
button
)
template=FastTemplate(main=[app])
template
settings_pane = pn.WidgetBox(pn.Param(button, parameters=button_parameters, show_name=False))
settings_pane
Let's verify that that FastButton
can be used as a widget by pn.Param
.
WIDGETS = {
"click_me": {
"type": FastButton, "appearance": "accent", "sizing_mode": "fixed", "width": 200
}
}
class ParameterizedApp(param.Parameterized):
click_me = param.Action()
clicks = param.Integer(default=0)
view = param.Parameter()
def __init__(self, **params):
super().__init__(**params)
self.view = pn.Param(self, parameters=["click_me", "clicks"], widgets=WIDGETS)
self.click_me = self._click_me
def _click_me(self,*events):
self.clicks+=1
parameterized_app = ParameterizedApp()
paremeterized_template = FastTemplate(main=[parameterized_app.view])
paremeterized_template