panel.ui package#

Subpackages#

Module contents#

The panel.ui namespace, Panel’s Material UI based component library.

The Material components are implemented by the panel-material-ui package, which Panel depends on, and are re-exported here alongside the classic components that have no Material equivalent, so that an application can import everything it needs from one namespace. Panel 2.0 moves the implementation into this package, at which point the imports below change source but not name.

Components are available both flat and per module:

from panel.ui import Button
from panel.ui.widgets import Button

class panel.ui.AVIF(object=None, **params)[source]#

Bases: ImageBase

The AVIF pane embeds a .avif image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/AVIF.html

Example:

>>> AVIF(
...     'https://assets.holoviz.org/panel/samples/avif_sample.avif',
...     alt_text='A nice tree',
...     link_url='https://en.wikipedia.org/wiki/AVIF',
...     width=500
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

class panel.ui.Accordion(*objects, **params)[source]#

Bases: MaterialNamedListLike, PaperMixin

The Accordion layout is a type of Card layout that allows switching between multiple objects by clicking on the corresponding card header.

The labels for each card will default to the name parameter of the card’s contents, but may also be defined explicitly as part of a tuple.

Accordion has a list-like API that allows interactively updating and modifying the cards using the methods append, extend, clear, insert, pop, remove and __setitem__.

References:

Example:

>>> Accordion(("Card 1", "Card 1 objects"), ("Card 2", "Card 2 objects"))

Parameter Definitions

Parameters inherited from:

panel_material_ui.layout.base.PaperMixin: elevation, raised, square, variant

panel.layout.base.NamedListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialNamedListLike: _names, _headers

active_header_color = Color(allow_None=True, allow_named=True, label='Active header color'): The text color of the active Card header.
active_header_background = Color(allow_None=True, allow_named=True, label='Active header background'): The background color of the active Card header.
active = List(bounds=(0, None), default=[], label='Active'): List of indexes of active cards.
disabled = List(bounds=(0, None), default=[], label='Disabled'): List of indexes of disabled cards.
disable_gutters = Boolean(default=False, label='Disable gutters'): Whether to disable margins between expanded sections.
header_background = Color(allow_None=True, allow_named=True, label='Header background'): The background color of the Card header.
header_color = Color(allow_None=True, allow_named=True, label='Header color'): The text color of the Card header.
title_variant = String(default='h3', label='Title variant'): The text variant of the Accordion header titles.
toggle = Boolean(default=False, label='Toggle'): Whether to toggle between active cards or allow multiple cards

class panel.ui.Alert(*objects, **params)[source]#

Bases: MaterialListLike

An Alert displays messages, such as warnings, errors, success messages, or informational updates. It provides a visually distinct way to inform users about the system’s status.

References:

Example:

>>> Alert(title="This is an alert")

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

alert_type = Selector(default='primary', label='Alert type', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The type of the alert.
closed = Boolean(default=False, label='Closed'): Whether the alert is closed.
closeable = Boolean(default=False, label='Closeable'): Whether the alert is closeable.
severity = Selector(default='success', label='Severity', names={}, objects=['error', 'warning', 'info', 'success']): The severity of the alert.
object = String(default='', label='Object'): The object to display in the alert.
title = String(allow_None=True, label='Title'): The title of the alert.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined']): The variant of the alert.

class panel.ui.AppBar(*objects, **params)[source]#

Bases: MaterialComponent

The AppBar component renders a Material UI App Bar (top navigation bar). It supports a title, icon, color theming, and can contain arbitrary child components (buttons, menus, search fields, etc.) via the objects parameter.

The AppBar is typically placed at the top of an application as a header, either standalone or inside a Page component’s header slot.

References:

Example:

>>> pmui.AppBar(title='My App', icon='menu', color='primary')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

color = Selector(default='primary', label='Color', names={}, objects=['default', 'inherit', 'primary', 'secondary', 'transparent']): The color of the app bar.

drawer_toggle = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label='Drawer toggle')

enable_color_on_dark = Boolean(default=False, label='Enable color on dark'): If True, the color prop is applied in dark mode too (by default, Material Design suppresses app bar color in dark mode).
icon = String(allow_None=True, label='Icon'): Icon displayed at the start of the app bar. Typically a menu or navigation icon.
objects = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Objects'): Components rendered inside the app bar toolbar.
position = Selector(default='static', label='Position', names={}, objects=['fixed', 'absolute', 'sticky', 'static', 'relative']): The CSS position of the app bar.
title = String(allow_None=True, label='Title'): Title text displayed in the app bar.
variant = Selector(default='dense', label='Variant', names={}, objects=['dense', 'regular']): The toolbar variant. ‘dense’ produces a compact bar.

class panel.ui.ArrayInput(*, enter_pressed, max_length, size, color, error_state, helper_text, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, max_array_size, description, placeholder, serializer, type, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: TextInput, ArrayInput

Edit NumPy arrays as text, disabling editing above max_array_size.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.LiteralInput: serializer, type

panel.widgets.input.ArrayInput: max_array_size

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: max_length, placeholder, size

panel_material_ui.widgets.input.TextInput: enter_pressed

value = Parameter(allow_None=True, label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
value_input = Parameter(allow_None=True, constant=True, label='Value input', readonly=True): Initial or entered text value updated on every key press.

value = None#

value_input = None#

class panel.ui.Audio(object=None, **params)[source]#

Bases: _MediaBase

The Audio pane displays an audio player given a local or remote audio file, a NumPy Array or Torch Tensor.

The pane also allows access and control over the player state including toggling of playing/paused and loop state, the current time, and the volume.

The audio player supports ogg, mp3, and wav files

If SciPy is installed, 1- or 2-dim Numpy Arrays and 1- or 2-dim Torch Tensors are also supported. The dtype must be one of the following

numpy: np.int16, np.uint16, np.float32, np.float64
torch: torch.short, torch.int16, torch.half, torch.float16, torch.float, torch.float32,

torch.double, torch.float64

The array or Tensor input will be downsampled to 16bit and converted to a wav file by SciPy.

Reference: https://panel.holoviz.org/reference/panes/Audio.html

Example:

>>> Audio('http://ccrma.stanford.edu/~jos/mp3/pno-cs.mp3', name='Audio')

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.media._MediaBase: loop, time, throttle, paused, volume, autoplay, muted

object = ClassSelector(allow_None=True, allow_refs=True, class_=(<class 'str'>, <class 'bytes'>, <class 'pathlib.Path'>, <class '_io.BytesIO'>, <class 'numpy.ndarray'>, <class 'panel.pane.media.TensorLike'>), default='', label='Object'): The audio file either local or remote, a 1- or 2-dim NumPy ndarray or a 1- or 2-dim Torch Tensor or a bytes or BytesIO object.
sample_rate = Integer(default=44100, inclusive_bounds=(True, True), label='Sample rate'): The sample_rate of the audio when given a NumPy array or Torch tensor.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.AutocompleteInput(*, case_sensitive, color, error_state, helper_text, lazy_search, min_characters, placeholder, restrict, search_strategy, size, variant, attached, description, dark_theme, sx, theme_config, use_shadow_dom, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialSingleSelectBase

The AutocompleteInput widget allows searching and selecting a single value from a list of options.

It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the Select, RadioBoxGroup and RadioButtonGroup widgets.

References:

Example:

>>> AutocompleteInput(
...     label='Study', options=['Biology', 'Chemistry', 'Physics'],
... )

Methods

clone(**params)

Makes a copy of the object sharing the same parameters.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.select.MaterialSingleSelectBase: value

case_sensitive = Boolean(default=True, label='Case sensitive'): Enable or disable case sensitivity.
error_state = Boolean(default=False, label='Error state'): Whether to display in error state.
helper_text = String(default='', label='Helper text'): Helper text displayed below the input field.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the autocomplete input.
lazy_search = Boolean(default=False, label='Lazy search'): If True, search queries are sent to the backend for processing. This is useful when options are large or need server-side filtering.
min_characters = Integer(default=2, inclusive_bounds=(True, True), label='Min characters'): The number of characters a user must type before completions are presented.
placeholder = String(default='', label='Placeholder'): Placeholder for empty input field.
restrict = Boolean(default=True, label='Restrict'): Set to False in order to allow users to enter text that is not present in the list of completion strings.
search_strategy = Selector(default='starts_with', label='Search strategy', names={}, objects=['starts_with', 'includes']): Define how to search the list of completion strings. The default option “starts_with” means that the user’s text must match the start of a completion string. Using “includes” means that the user’s text can match any substring of a completion string.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): Size of the input field. Options: - ‘small’: Compact size for dense layouts - ‘medium’: Standard size (default for most use cases) - ‘large’: Larger size for more visibility
value_input = Parameter(constant=True, default='', label='Value input', readonly=True): Initial or entered text value updated on every key press.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined', 'standard']): Variant style of the autocomplete input.

clone(**params) → Self[source]#

Makes a copy of the object sharing the same parameters.

Parameters:

params: Keyword arguments override the parameters on the clone.

Returns:

Cloned Viewable object

class panel.ui.Avatar(content=None, **params)[source]#

Bases: MaterialWidget

The Avatar component displays profile pictures, user initials, or icons in a compact, circular or square format. Avatars are commonly used throughout user interfaces to represent users, brands, or entities in a visually consistent manner.

References:

Example:

>>> Avatar(content="JD", color="#2196f3", variant="square")

Methods

`js_on_click`([args, code])	Allows defining a JS callback to be triggered when the Avatar is clicked.
`on_click`(callback)	Register a callback to be executed when the Avatar is clicked.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: value

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget.
alt_text = String(allow_None=True, label='Alt text'): Alternative text for the image. Shown when the image cannot be loaded and used for accessibility.
clicks = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Clicks'): Number of clicks.
color = Color(allow_None=True, allow_named=True, label='Color'): Background color for text and icon avatars. Accepts any valid CSS color value. Only applies to text/icon avatars, not image avatars.
content = String(default='', label='Content'): The content to display in the avatar. Can be an image URL/path for image avatars, or text content (like initials) for text avatars.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): Size of the avatar component. Options: - ‘small’: 24x24 pixels - ‘medium’: 40x40 pixels - ‘large’: 56x56 pixels
variant = Selector(default='rounded', label='Variant', names={}, objects=['rounded', 'square']): Shape variant of the avatar. Options: - ‘rounded’: Circular shape with rounded corners (default) - ‘square’: Square shape with sharp corners

object = Parameter(allow_None=True, label='Object')

js_on_click(args: dict[str, Any] | None = None, code: str = '') → Callback[source]#

Allows defining a JS callback to be triggered when the Avatar is clicked.

Returns:

callback: Callback: The Callback which can be used to disable the callback.

on_click(callback: Callable[[Event], None]) → Watcher[source]#

Register a callback to be executed when the Avatar is clicked.

Returns:

watcher: param.Parameterized.Watcher: A Watcher that executes the callback when the Avatar is clicked.

width = None#

class panel.ui.Backdrop(*objects, **params)[source]#

Bases: MaterialListLike

The Backdrop component can be used to create a semi-transparent overlay over the application’s UI. It is often used to focus attention on a specific part of the interface, such as during loading states or while a modal dialog is open.

References:

Example:

>>> close = Button(on_click=lambda _: backdrop.param.update(open=False), label='Close')  # type: ignore
>>> backdrop = Backdrop(LoadingIndicator(), close)
>>> button = Button(on_click=lambda _: backdrop.param.update(open=True), label=f'Open {Backdrop.name}')
>>> pn.Column(button, backdrop).servable()

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

open = Boolean(default=False, label='Open'): Whether the backdrop is open.

class panel.ui.Badge(object=None, **params)[source]#

Bases: Wrapper

The Badge generates a small badge to the top-right (by default) of its child element. Badges are commonly used to display notification counts, status indicators, or short labels overlaid on icons, avatars, or buttons.

References:

Example:

>>> Badge(IconButton(icon="mail"), content=4, color="primary")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.wrappers.base.Wrapper: object

content = Parameter(default=0, label='Content'): The content rendered within the badge. Typically an integer count but can be a short string.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the badge.
max = Integer(bounds=(0, None), default=99, inclusive_bounds=(True, True), label='Max'): Maximum count to display. Values above this show as ‘max+’ (e.g. ‘99+’).
offset = XYCoordinates(allow_None=True, label='Offset', length=2): The (x, y) pixel offset of the badge from its anchor point on the object. Positive x shifts the badge right, positive y down.
overlap = Selector(default='rectangular', label='Overlap', names={}, objects=['rectangular', 'circular']): Wrapped shape the badge should overlap.
placement = Selector(default='top-right', label='Placement', names={}, objects=['top-right', 'top-left', 'bottom-right', 'bottom-left']): The placement of the badge relative to the child element.
show_zero = Boolean(default=False, label='Show zero'): Whether to display the badge when content is zero.
variant = Selector(default='standard', label='Variant', names={}, objects=['dot', 'standard']): The variant of the badge. Use ‘dot’ for a small dot indicator without content.

class panel.ui.Bokeh(object=None, **params)[source]#

Bases: Pane

The Bokeh pane allows displaying any displayable Bokeh model inside a Panel app.

Reference: https://panel.holoviz.org/reference/panes/Bokeh.html

Example:

>>> Bokeh(some_bokeh_figure)

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

autodispatch = Boolean(default=True, label='Autodispatch'): Whether to automatically dispatch events inside bokeh on_change and on_event callbacks in the notebook.
theme = ClassSelector(allow_None=True, class_=(<class 'bokeh.themes.theme.Theme'>, <class 'str'>), label='Theme'): Bokeh theme to apply to the plot.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.BooleanStatus(*, color, throttle, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: BooleanIndicator

The BooleanStatus is a boolean indicator providing a visual representation of a boolean status as filled or non-filled circle.

If the value is set to True the indicator will be filled while setting it to False will cause it to be non-filled.

Reference: https://panel.holoviz.org/reference/indicators/BooleanStatus.html

Example:

>>> BooleanStatus(value=True, color='primary', width=100, height=100)

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: margin, disabled

panel.widgets.indicators.Indicator: sizing_mode

panel.widgets.indicators.BooleanIndicator: throttle

value = Boolean(default=False, label='Value'): Whether the indicator is active or not.
height = Integer(allow_None=True, bounds=(0, None), default=20, inclusive_bounds=(True, True), label='Height'): height of the circle.
width = Integer(allow_None=True, bounds=(0, None), default=20, inclusive_bounds=(True, True), label='Width'): Width of the circle.
color = Selector(default='dark', label='Color', names={}, objects=['primary', 'secondary', 'success', 'info', 'danger', 'warning', 'light', 'dark']): The color of the circle, one of ‘primary’, ‘secondary’, ‘success’, ‘info’, ‘danger’, ‘warning’, ‘light’, ‘dark’

class panel.ui.Breadcrumbs(*, color, max_items, separator, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: BreadcrumbsBase

The Breadcrumbs component is used to show the navigation path of a user within an application. It improves usability by allowing users to track their location and navigate back easily.

Breadcrumb items can be strings or objects with properties:

label: The label of the breadcrumb item (required)
icon: The icon of the breadcrumb item (optional)
avatar: The avatar of the breadcrumb item (optional)
href: Link to navigate to when clicking the breadcrumb item (optional)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.Breadcrumbs(items=[
...     {'label': 'Documentation', 'icon': 'article'},
...     {'label': 'Reference Gallery', 'icon': 'category'},
...     {'label': 'Menus', 'icon': 'menu'},
...     {'label': 'Breadcrumbs', 'icon': 'grain'},
... ], active=3)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, width, active, items

panel_material_ui.widgets.menus.BreadcrumbsBase: color, max_items, separator

class panel.ui.BreakpointSwitcher(*, breakpoint, large, media_query, small, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, name)[source]#

Bases: MaterialComponent

The BreakpointSwitcher component allows switching between two component implementations based on the declared breakpoint or media_query.

References:

https://panel-material-ui.holoviz.org/reference/page/BreakpointSwitcher.html

Example:

>>> BreakpointSwitcher(breakpoint='sm', small=..., large=...)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

current = Parameter(allow_None=True, constant=True, label='Current', readonly=True): The current object.
breakpoint = Selector(default='md', label='Breakpoint', names={}, objects=['xs', 'sm', 'md', 'lg', 'xl']): Breakpoint at which switcher toggles between.
media_query = String(allow_None=True, label='Media query'): Media query to use for the breakpoint (takes precedence over breakpoint).
small = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label='Small'): Items rendered in the small breakpoint.
large = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label='Large'): Items rendered in the large breakpoint.

class panel.ui.Button(*, href, target, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ButtonBase, _ClickButton

The Button widget allows triggering events when the button is clicked.

The Button provides a value parameter, which will toggle from False to True while the click event is being processed.

It also provides an additional clicks parameter, that can be watched to subscribe to click events.

References:

Example:

>>> Button(label='Click me', icon='caret-right', button_type='primary')

Methods

on_click(callback)

Register a callback to be executed when the Button is clicked.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: width, variant, clicks, disable_elevation, end_icon, icon, icon_size, size

value = Event(default=False, label='Value'): Toggles from False to True while the event is being processed.
href = String(allow_None=True, label='Href'): The URL to navigate to when the button is clicked.
target = Selector(default='_self', label='Target', names={}, objects=['_blank', '_parent', '_self', '_top']): Where to open the linked document.

on_click(callback: Callable[[Event], None | Awaitable[None]]) → Watcher[source]#

Register a callback to be executed when the Button is clicked.

The callback is given an Event argument declaring the number of clicks

Returns:

watcher: param.Parameterized.Watcher: A Watcher that executes the callback when the button is clicked.

panel.ui.ButtonIcon[source]#: alias of IconButton

class panel.ui.Card(*items: list[Any | tuple[str, Any]], **params: Any)[source]#

Bases: MaterialNamedListLike, PaperMixin

A Card layout allows arranging multiple panel objects in a collapsible, vertical container with a header bar.

References:

Example:

>>> Card(some_widget, some_pane, some_python_object, title='Card')

Methods

select([selector])

Iterates over the Viewable and any potential children in the applying the Selector.

Parameter Definitions

Parameters inherited from:

panel_material_ui.layout.base.PaperMixin: elevation, raised, square, variant

panel.layout.base.NamedListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialNamedListLike: _names, _headers

collapsed = Boolean(default=False, label='Collapsed'): Whether the contents of the Card are collapsed.
collapsible = Boolean(default=True, label='Collapsible'): Whether the Card should be expandable and collapsible.
header = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label='Header'): A Panel component to display in the header bar of the Card. Will override the given title if defined.
header_background = Color(allow_None=True, allow_named=True, label='Header background'): The background color of the Card header.
header_color = Color(allow_None=True, allow_named=True, label='Header color'): The text color of the Card header.
header_css_classes = List(bounds=(0, None), default=[], label='Header css classes'): List of CSS classes to apply to CardHeader component.
hide_header = Boolean(default=False, label='Hide header'): Whether to hide the card header.
outlined = Boolean(default=True, label='Outlined'): Whether the card is outlined.
title = String(default='', label='Title'): A title to be displayed in the Card header, will be overridden by the header if defined.
title_css_classes = List(bounds=(0, None), default=[], label='Title css classes'): List of CSS classes to apply to CardTitle component.
title_variant = String(default='h3', label='Title variant'): The text variant of the Card header title.

select(selector: type | Callable[[Viewable], bool] | None = None) → list[Viewable][source]#

Iterates over the Viewable and any potential children in the applying the Selector.

Parameters:

selector: type or callable or None: The selector allows selecting a subset of Viewables by declaring a type or callable function to filter by.

Returns:

viewables: list(Viewable)

class panel.ui.ChatAreaInput(*, accept, actions, disabled_enter, enable_upload, enter_sends, footer_objects, value_uploaded, views, auto_grow, cols, enter_pressed, max_rows, resizable, rows, max_length, placeholder, size, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, chunk_size, max_file_size, max_total_file_size, uploaded_label, name)[source]#

Bases: TextAreaInput, _FileUploadArea

The ChatAreaInput allows entering any multiline string using a text input box, with the ability to press enter to submit the message.

Unlike TextAreaInput, the ChatAreaInput defaults to auto_grow=True and max_rows=10, and the value is not synced to the server until the enter key is pressed so bind on value_input if you need to access the existing value.

Lines are joined with the newline character n.

References:

Example:

>>> ChatAreaInput(max_rows=10)

Methods

`focus`()	Focus the input element.
`on_action`(name, callback)	Registers a callback that is invoked when an action triggered.
`remove_on_action`(name, callback)	Removes a callback that was registered with on_action.
`sync`()	Syncs currently uploaded files to the server without requiring the user to press enter or click submit.

Parameter Definitions

Parameters inherited from:

panel_material_ui.widgets.input._FileUploadArea: chunk_size, max_file_size, max_total_file_size, uploaded_label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: value, size, value_input

panel_material_ui.widgets.input.TextAreaInput: cols, resizable

loading = Boolean(allow_refs=True, default=False, label='Loading'): If True displays a loading spinner on top of the component.
max_length = Integer(default=50000, inclusive_bounds=(True, True), label='Max length'): Max count of characters in the input field.
placeholder = String(default='Ask anything...', label='Placeholder'): Placeholder for empty input field.
auto_grow = Boolean(default=True, label='Auto grow'): Whether the text area should automatically grow vertically to accommodate the current text.
max_rows = Integer(default=10, inclusive_bounds=(True, True), label='Max rows'): When combined with auto_grow this determines the maximum number of rows the input area can grow.
rows = Integer(default=1, inclusive_bounds=(True, True), label='Rows'): Number of rows in the text input field.
enter_pressed = Event(default=False, label='Enter pressed'): If True, pressing the Enter key sends the message, if False it is sent by pressing the Ctrl+Enter.
accept = String(allow_None=True, label='Accept'): A comma separated string of file extensions (with dots) or MIME types that should be accepted for upload. Examples: ‘.csv,.json,.txt’ or ‘text/csv,application/json’.
actions = Dict(class_=<class 'dict'>, default={}, label='Actions'): A dictionary of actions that can be invoked via the speed dial to the left of input area. The actions should be defined as a dictionary indexed by the name of the action mapping to values that themselves are dictionaries containing an icon. Users can define callbacks by registering callbacks using the on_action method.
disabled_enter = Boolean(default=False, label='Disabled enter'): If True, disables sending the message by pressing the enter_sends key.
enable_upload = Boolean(default=True, label='Enable upload'): If True, enables uploading of files.
enter_sends = Boolean(default=True, label='Enter sends'): If True, pressing the Enter key sends the message, if False it is sent by pressing the Ctrl+Enter.
pending_uploads = Integer(constant=True, default=0, inclusive_bounds=(True, True), label='Pending uploads', readonly=True): The number of files currently queued for upload but not yet transferred. This is updated automatically when files are added or removed in the UI.
value_uploaded = Dict(class_=<class 'dict'>, default={}, label='Value uploaded'): Dictionary containing raw file data keyed by filename after user sends uploads. Each entry contains mime_type, value (bytes), and size.
views = List(bounds=(0, None), default=[], label='Views'): Views generated from uploaded files.
footer_objects = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Footer objects'): A list of panel objects to display in the footer area below the input.

focus()[source]#: Focus the input element.

on_action(name: str, callback: Callable)[source]#

Registers a callback that is invoked when an action triggered.

Parameters:

name: str: The name of the action to register the callback for.
callback: callable: The callback to invoke when the action is triggered.

remove_on_action(name: str, callback: Callable)[source]#

Removes a callback that was registered with on_action.

Parameters:

name: str: The name of the action to register the callback for.
callback: callable: The callback to invoke when the action is triggered.

sync()[source]#

Syncs currently uploaded files to the server without requiring the user to press enter or click submit. This allows programmatic control over when file uploads are processed.

This method is asynchronous - it sends a message to the frontend to initiate the sync and returns immediately. To access the uploaded file data, watch for changes to the value_uploaded parameter.

class panel.ui.ChatFeed(*objects, **params)[source]#

Bases: ChatFeed

A ChatFeed holds a list of ChatMessage objects and provides convenient APIs. to interact with them.

This includes methods to: - Send (append) messages to the chat log. - Stream tokens to the latest ChatMessage in the chat log. - Execute callbacks when a user sends a message. - Undo a number of sent ChatMessage objects. - Clear the chat log of all ChatMessage objects.

References:

Example:

>>> async def say_welcome(contents, user, instance):
>>>    yield "Welcome!"
>>>    yield "Glad you're here!"

>>> chat_feed = ChatFeed(callback=say_welcome, header="Welcome Feed")
>>> chat_feed.send("Hello World!", user="New User", avatar="😊")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.base.ListPanel: scroll

panel.chat.feed.ChatFeed: margin, objects, adaptive, auto_scroll_limit, callback, callback_exception, callback_user, callback_avatar, edit_callback, card_params, collapsible, disabled, message_params, header, help_text, load_buffer, placeholder_text, placeholder_params, placeholder_threshold, post_hook, renderers, scroll_button_threshold, show_activity_dot, view_latest, _placeholder, _callback_state, _prompt_trigger, _callback_trigger, _disabled_stack

dark_theme = Boolean(default=False, label='Dark theme'): Whether to use dark theme. If not specified, will default to Panel’s global theme setting.
theme_config = Dict(allow_None=True, class_=<class 'dict'>, label='Theme config', nested_refs=True): Options to configure the ThemeProvider. See https://mui.com/material-ui/customization/theme-overview/ for more information.
sx = Dict(allow_None=True, class_=<class 'dict'>, label='Sx'): A dictionary of CSS styles to apply to the component. The keys are the CSS class names and the values are the styles. The CSS class names are generated by the component and can be found in the component’s documentation.

class panel.ui.ChatInterface(*, input_params, on_submit, dark_theme, sx, theme_config, _button_data, _buttons, _input_container, _input_layout, _widgets, auto_send_types, avatar, button_properties, reset_on_send, show_button_name, show_button_tooltips, show_clear, show_rerun, show_send, show_stop, show_undo, user, widgets, _callback_state, _callback_trigger, _disabled_stack, _placeholder, _prompt_trigger, adaptive, auto_scroll_limit, callback, callback_avatar, callback_exception, callback_user, card_params, disabled, edit_callback, header, help_text, load_buffer, message_params, placeholder_params, placeholder_text, placeholder_threshold, post_hook, renderers, scroll_button_threshold, show_activity_dot, view_latest, scroll, objects, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, name)[source]#

Bases: ChatFeed, ChatInterface

A chat interface that uses Material UI components.

References:

Example:

>>> ChatInterface().servable()

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.base.ListPanel: scroll

panel.chat.feed.ChatFeed: margin, objects, adaptive, auto_scroll_limit, callback, callback_exception, callback_user, callback_avatar, edit_callback, card_params, collapsible, disabled, message_params, header, help_text, load_buffer, placeholder_text, placeholder_params, placeholder_threshold, post_hook, renderers, scroll_button_threshold, show_activity_dot, view_latest, _placeholder, _callback_state, _prompt_trigger, _callback_trigger, _disabled_stack

panel.chat.interface.ChatInterface: auto_send_types, avatar, reset_on_send, show_send, show_stop, show_rerun, show_undo, show_clear, show_button_name, show_button_tooltips, user, button_properties, _widgets, _input_container, _input_layout, _button_data, _buttons

panel_material_ui.chat.feed.ChatFeed: dark_theme, theme_config, sx

widgets = Parameter(allow_None=True, constant=True, label='Widgets'): Not supported by panel-material-ui ChatInterface.
input_params = Dict(class_=<class 'dict'>, default={}, label='Input params'): Additional parameters to pass to the ChatAreaInput widget. Supported keys include any ChatAreaInput param, e.g. placeholder, enable_upload, max_rows, rows. Updates are applied dynamically after initialization.
on_submit = Callable(allow_None=True, label='On submit'): Callback to invoke when the send button or enter is pressed; should accept an event and instance as args. If unspecified, the default behavior is to send a Column containing the input text and views. This only affects the user-facing input, and does not affect the send method.

class panel.ui.ChatMessage(object=None, **params)[source]#

Bases: MaterialComponent, ChatMessage

Renders another component as a chat message with an associated user and avatar with support for various content types.

This widget provides a structured view of chat messages, including features like:

Displaying user avatars, which can be text, emoji, or images.
Showing the user’s name.
Displaying the message timestamp in a customizable format.
Associating reactions with messages and mapping them to icons.
Rendering various content types including text, images, audio, video, and more.

References:

Example:

>>> ChatMessage(object="Hello world!", user="New User", avatar="😊")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, design, height, min_width, min_height, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.pane.base.PaneBase: margin

panel.chat.message.ChatMessage: max_width, object, avatar_lookup, edited, footer_objects, header_objects, reactions, reaction_icons, timestamp, timestamp_format, timestamp_tz, show_avatar, show_edit_icon, show_user, show_timestamp, show_reaction_icons, show_copy_icon, show_activity_dot, renderers, user

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

css_classes = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'str'>, label='Css classes', nested_refs=True): The CSS classes to apply to the widget.
default_layout = ClassSelector(allow_None=True, class_=<class 'panel.layout.base.Panel'>, default=<class 'panel.layout.base.Row'>, label='Default layout'): Defines the layout the model(s) returned by the pane will be placed in.
avatar = ClassSelector(class_=(<class 'str'>, <class '_io.BytesIO'>, <class 'bytes'>, <class 'panel.pane.image.ImageBase'>, <class 'dict'>), default='', label='Avatar'): The avatar to use for the user. Can be a single character text, an emoji, or anything supported by pn.pane.Image. If not set, checks if the user is available in the default_avatars mapping; else uses the first character of the name.
default_avatars = Dict(class_=<class 'dict'>, default={'system': '⚙️', 'client': '🧑', 'customer': '🧑', 'employee': '🧑', 'human': '🧑', 'person': '🧑', 'user': '🧑', 'agent': '🤖', 'ai': '🤖', 'assistant': '🤖', 'bot': '🤖', 'chatbot': '🤖', 'machine': '🤖', 'robot': '🤖', 'exception': '❌', 'error': '❌', 'help': '❓', 'input': '❗', 'adult': '🧑', 'baby': '👶', 'boy': '👦', 'child': '🧒', 'girl': '👧', 'man': '👨', 'woman': '👩', 'chatgpt': '{dist_path}assets/logo/gpt-3.svg', 'gpt3': '{dist_path}assets/logo/gpt-3.svg', 'gpt4': '{dist_path}assets/logo/gpt-4.svg', 'dalle': '{dist_path}assets/logo/gpt-4.svg', 'openai': '{dist_path}assets/logo/gpt-4.svg', 'huggingface': '🤗', 'calculator': '🧮', 'langchain': '🦜', 'retriever': '📄', 'tool': '🛠️', 'translator': '🌐', 'wolfram': '{dist_path}assets/logo/wolfram.svg', 'wolfram alpha': '{dist_path}assets/logo/wolfram.svg', 'llama': '🦙', 'llama2': '🐪', 'plot': '📊', 'lumen': '{dist_path}assets/logo/lumen.svg', 'holoviews': '{dist_path}assets/logo/holoviews.svg', 'hvplot': '{dist_path}assets/logo/hvplot.svg', 'panel': '{dist_path}images/icon-vector.svg'}, label='Default avatars'): A default mapping of user names to their corresponding avatars to use when the user is specified but the avatar is. You can modify, but not replace the dictionary.
elevation = Integer(default=2, inclusive_bounds=(True, True), label='Elevation'): The elevation of the message.
placement = Selector(default='left', label='Placement', names={}, objects=['left', 'right']): The placement of the message.

_internal_state = ClassSelector(class_=<class 'panel_material_ui.chat.message.MessageState'>, default=MessageState(avatar=None, name='MessageState00116', timestamp=''), label=' internal state')

_object_panel = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label=' object panel')

default_layout[source]#: alias of Row

class panel.ui.ChatReactionIcons(*, active_icons, default_layout, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: CompositeWidget

A widget to display reaction icons that can be clicked on.

Parameters:

valueList: The selected reactions.
optionsDict: A key-value pair of reaction values and their corresponding tabler icon names found on https://tabler.io/icons.
active_iconsDict: The mapping of reactions to their corresponding active icon names; if not set, the active icon name will default to its “filled” version.
Reference: https://panel.holoviz.org/reference/chat/ChatReactionIcons.html
:Example:
>>> ChatReactionIcons(value=[“like”], options={“like”: “thumb-up”, “dislike”: “thumb-down”})

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, width, disabled

value = List(bounds=(0, None), default=[], label='Value'): The active reactions.
css_classes = List(allow_refs=True, bounds=(0, None), default=['reaction-icons'], item_type=<class 'str'>, label='Css classes', nested_refs=True): The CSS classes of the widget.
margin = Margin(allow_None=True, allow_refs=True, default=0, label='Margin'): Allows to create additional space around the component. May be specified as a two-tuple of the form (vertical, horizontal) or a four-tuple (top, right, bottom, left).
active_icons = Dict(class_=<class 'dict'>, default={}, label='Active icons'): The mapping of reactions to their corresponding active icon names. If not set, the active icon name will default to its “filled” version.
options = Dict(class_=<class 'dict'>, default={'favorite': 'heart'}, label='Options'): A key-value pair of reaction values and their corresponding tabler icon names found on https://tabler.io/icons.
default_layout = ClassSelector(class_=<class 'panel.layout.base.Panel'>, default=<class 'panel.layout.base.Column'>, label='Default layout'): The layout to use for the icons. Defaults to Column, which stacks the icons vertically.

default_layout[source]#: alias of Column

class panel.ui.ChatStep(*objects, **params)[source]#

Bases: Card, ChatStep

A component that makes it easy to provide status updates and the ability to stream updates to both the output(s) and the title.

References:

Example:

>>> ChatStep("Hello world!", title="Running calculation...', status="running")

Methods

stream(token[, replace])

Stream a token to the last available string-like object.

Parameter Definitions

Parameters inherited from:

panel_material_ui.layout.base.PaperMixin: elevation, raised, square, variant

panel.viewable.Layoutable: align, aspect_ratio, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, visible

panel.layout.base.ListLike: objects

panel.layout.base.ListPanel: scroll

panel.layout.base.Column: auto_scroll_limit, scroll_button_threshold, scroll_position, view_latest

panel.layout.card.Card: css_classes, active_header_background, button_css_classes

panel.chat.step.ChatStep: collapsed_on_success, context_exception, default_badges, default_title, failed_title, pending_title, running_title, status, success_title

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialNamedListLike: _names, _headers

panel_material_ui.layout.base.Card: collapsed, collapsible, header, header_background, header_color, header_css_classes, hide_header, outlined, title, title_css_classes, title_variant

margin = Margin(allow_None=True, allow_refs=True, default=(5, 0, 0, 0), label='Margin'): The margin of the layout.
sizing_mode = Selector(allow_refs=True, default='stretch_width', label='Sizing mode', names={}, objects=['fixed', 'stretch_width', 'stretch_height', 'stretch_both', 'scale_width', 'scale_height', 'scale_both', None]): How the component should size itself. This is a high-level setting for maintaining width and height of the component. To gain more fine grained control over sizing, use width_policy, height_policy and aspect_ratio instead (those take precedence over sizing_mode). "fixed" Component is not responsive. It will retain its original width and height regardless of any subsequent browser window resize events. "stretch_width" Component will responsively resize to stretch to the available width, without maintaining any aspect ratio. The height of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_height" Component will responsively resize to stretch to the available height, without maintaining any aspect ratio. The width of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_both" Component is completely responsive, independently in width and height, and will occupy all the available horizontal and vertical space, even if this changes the aspect ratio of the component. "scale_width" Component will responsively resize to stretch to the available width, while maintaining the original or provided aspect ratio. "scale_height" Component will responsively resize to stretch to the available height, while maintaining the original or provided aspect ratio. "scale_both" Component will responsively resize to both the available width and height, while maintaining the original or provided aspect ratio.

stream(token: str | None, replace: bool = False)[source]#

Stream a token to the last available string-like object.

Parameters:

tokenstr: The token to stream.
replacebool: Whether to replace the existing text.

Returns:

Viewable: The updated message pane.

class panel.ui.CheckBoxGroup(*, color, inline, label_placement, size, attached, dark_theme, sx, theme_config, use_shadow_dom, description, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _RadioGroup, MaterialMultiSelectBase

The CheckBoxGroup widget allows selecting between a list of options by ticking the corresponding checkboxes.

It falls into the broad category of multi-option selection widgets that provide a compatible API that also include the CheckButtonGroup widget.

References:

Example:

>>> CheckBoxGroup(
...     name='Fruits', value=['Apple', 'Pear'], options=['Apple', 'Banana', 'Pear', 'Strawberry'],
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.select._RadioGroup: width, color, label_placement, size, inline

value = List(allow_None=True, bounds=(0, None), label='Value'): The selected values.

value = None#

class panel.ui.CheckButtonGroup(*, orientation, size, variant, button_style, button_type, color, description_delay, attached, dark_theme, sx, theme_config, use_shadow_dom, description, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ButtonGroup, MaterialMultiSelectBase

The CheckButtonGroup widget allows selecting from a list or dictionary of values using a set of toggle buttons.

It falls into the broad category of multi-option selection widgets that provide a compatible API that also include the CheckBoxGroup widget.

References:

Example:

>>> CheckButtonGroup(
...     label='Regression Models', value=['Lasso', 'Ridge'],
...     options=['Lasso', 'Linear', 'Ridge', 'Polynomial']
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.select.MaterialMultiSelectBase: value

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.select._ButtonGroup: width, orientation, size, variant

class panel.ui.Checkbox(*, color, description_delay, indeterminate, size, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The Checkbox allows toggling a single condition between True/False states by ticking a checkbox.

This widget is interchangeable with the Switch widget.

References:

Example:

>>> Checkbox(label='Works with the tools you know and love', value=True)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

value = Boolean(default=False, label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the checkbox.
description_delay = Integer(default=1000, inclusive_bounds=(True, True), label='Description delay'): Delay (in milliseconds) to display the tooltip after the cursor has hovered over the Button, default is 1000ms.
indeterminate = Boolean(default=False, label='Indeterminate'): Whether the checkbox can be in an indeterminate state. The indeterminate state may only be set in Python.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the checkbox.

width = None#

class panel.ui.Chip(label=None, **params)[source]#

Bases: _ButtonLike, _ClickButton

A Chip can be used to display information, labels, tags, or actions. It can include text, an icon, or a delete button.

References:

Example:

>>> Chip(label="Log Time", icon="clock")

Methods

on_click(callback)

Register a callback to be executed when the Chip is clicked.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: value

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget.
disabled = Boolean(default=False, label='Disabled'): Disables the Chip component, making it opaque and disabling click events.
clicks = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Clicks'): Number of clicks.
icon = String(allow_None=True, label='Icon'): Name of the icon to display in the chip. Should be a valid Material UI icon name (e.g., ‘favorite’, ‘delete’, ‘add’). The icon appears before the chip label.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium']): Size of the chip component. Options: - ‘small’: Compact size for dense layouts - ‘medium’: Standard size (default)
variant = Selector(default='filled', label='Variant', names={}, objects=['filled', 'outlined']): Visual style variant of the chip. Options: - ‘filled’: Solid background color (default) - ‘outlined’: Transparent background with colored border

object = Parameter(allow_None=True, label='Object')

on_click(callback: Callable[[Event], None | Awaitable[None]]) → Watcher[source]#

Register a callback to be executed when the Chip is clicked.

Returns:

watcher: param.Parameterized.Watcher: A Watcher that executes the callback when the Chip is clicked.

width = None#

class panel.ui.CircularProgress(*, bgcolor, color, size, thickness, variant, with_label, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The CircularProgress provides a visual representation as a spinner of the loading status.

References:

Example:

>>> CircularProgress(color='success')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

value = Number(bounds=(0, 100), default=0, inclusive_bounds=(True, True), label='Value'): The value of the loading indicator.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget.
bgcolor = Selector(label='Bgcolor', names={}, objects=[None, 'light', 'dark']): The background color of the loading spinner.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the loading indicator.
size = Integer(default=40, inclusive_bounds=(True, True), label='Size'): The size of the loading spinner.
thickness = Number(default=3.6, inclusive_bounds=(True, True), label='Thickness'): The thickness of the loading spinner.
variant = Selector(default='indeterminate', label='Variant', names={}, objects=['determinate', 'indeterminate']): The variant of the loading indicator.
with_label = Boolean(default=False, label='With label'): Whether to show a label indicating the progress.

width = None#

class panel.ui.Clickable(object=None, **params)[source]#

Bases: Wrapper, _ClickButton

The Clickable wrapper adds click interaction to any child component. It wraps a single child element with a clickable area, providing a clicks counter and an on_click callback mechanism.

Optionally renders a Material UI ripple effect on click.

References:

https://mui.com/material-ui/api/button-base/

Example:

>>> Clickable(Card(...), on_click=lambda e: print("Clicked!"))

Methods

on_click(callback)

Register a callback to be executed when the component is clicked.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height, margin, width

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.wrappers.base.Wrapper: object

value = Event(default=False, label='Value'): Toggles from False to True while the event is being processed.
disabled = Boolean(allow_refs=True, default=False, label='Disabled'): Whether the clickable area is disabled.
clicks = Integer(default=0, inclusive_bounds=(True, True), label='Clicks'): Number of clicks. Increment triggers registered callbacks.
disable_ripple = Boolean(default=False, label='Disable ripple'): Whether to disable the ripple effect on click.

on_click(callback: Callable[[Event], None | Awaitable[None]]) → Watcher[source]#

Register a callback to be executed when the component is clicked.

Returns:

watcher: param.Parameterized.Watcher: A Watcher that executes the callback when clicked.

class panel.ui.CodeEditor(*, annotations, filename, indent, language, on_keyup, print_margin, readonly, soft_tabs, theme, value_input, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: Widget

The CodeEditor widget allows displaying and editing code in the powerful Ace editor.

Reference: https://panel.holoviz.org/reference/widgets/CodeEditor.html

Example:

>>> CodeEditor(value=py_code, language='python', theme='monokai')

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = String(default='', label='Value'): State of the current code in the editor if on_keyup. Otherwise, only upon loss of focus, i.e. clicking outside the editor, or pressing <Ctrl+Enter> or <Cmd+Enter>.
annotations = List(bounds=(0, None), default=[], item_type=<class 'dict'>, label='Annotations'): List of annotations to add to the editor.
filename = String(default='', label='Filename'): Filename from which to deduce language
language = String(default='text', label='Language'): Language of the editor
indent = Integer(default=4, inclusive_bounds=(True, True), label='Indent'): The default indent size.
on_keyup = Boolean(default=True, label='On keyup'): Whether to update the value on every key press or only upon loss of focus / hotkeys.
print_margin = Boolean(default=False, label='Print margin'): Whether to show the a print margin.
readonly = Boolean(default=False, label='Readonly'): Define if editor content can be modified. Alias for disabled.
soft_tabs = Boolean(default=False, label='Soft tabs'): Whether to use spaces instead of tabs.
theme = Selector(default='github_light_default', label='Theme', names={}, objects=['ambiance', 'chaos', 'chrome', 'cloud9_day', 'cloud9_night', 'clouds', 'clouds_midnight', 'cobalt', 'crimson_editor', 'dawn', 'dracula', 'dreamweaver', 'eclipse', 'github', 'github_dark', 'github_light_default', 'gob', 'gruvbox', 'idle_fingers', 'iplastic', 'katzenmilch', 'kr_theme', 'kuroir', 'merbivore', 'merbivore_soft', 'mono_industrial', 'monokai', 'nord_dark', 'one_dark', 'pastel_on_dark', 'solarized_dark', 'solarized_light', 'sqlserver', 'terminal', 'textmate', 'tomorrow', 'tomorrow_night', 'tomorrow_night_blue', 'tomorrow_night_bright', 'tomorrow_night_eighties', 'twilight', 'vibrant_ink', 'xcode']): If no value is provided, it defaults to the current theme set by pn.config.theme, as specified in the CodeEditor.THEME_CONFIGURATION dictionary. If not defined there, it falls back to the default parameter value.
value_input = String(default='', label='Value input'): State of the current code updated on every key press. Identical to value if on_keyup.

class panel.ui.ColorMap(*, error_state, helper_text, attached, description, dark_theme, sx, theme_config, use_shadow_dom, ncols, swatch_height, swatch_width, value_name, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget, ColorMap

Select a colormap from a dictionary of palettes.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

value = Parameter(allow_None=True, label='Value'): The selected colormap.
options = Dict(class_=<class 'dict'>, default={}, label='Options'): Dictionary of colormaps.
ncols = Integer(bounds=(1, None), default=1, inclusive_bounds=(True, True), label='Ncols'): Number of columns of swatches to display.
swatch_height = Integer(bounds=(1, None), default=20, inclusive_bounds=(True, True), label='Swatch height'): Height of the color swatches.
swatch_width = Integer(bounds=(1, None), default=100, inclusive_bounds=(True, True), label='Swatch width'): Width of the color swatches.
value_name = String(allow_None=True, label='Value name'): Name of the selected colormap.
error_state = Boolean(default=False, label='Error state'): Whether to display the widget in an error state.
helper_text = String(default='', label='Helper text'): Helper text displayed below the widget.

class panel.ui.ColorPicker(*, alpha, color, error_state, format, helper_text, size, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The ColorPicker allows selecting a color value using a color picker utility.

References:

Example:

>>> pmui.ColorPicker(name='Color Picker', value='#99ef78')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

value = String(allow_None=True, label='Value'): The current color value.
alpha = Boolean(default=False, label='Alpha'): Whether to display input controls for a color’s alpha (transparency) channel.
error_state = Boolean(default=False, label='Error state'): Whether to display in error state.
helper_text = String(default='', label='Helper text'): Helper text displayed below the color picker field.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The accent color of the color picker when active or focused.
format = Selector(default='hex', label='Format', names={}, objects=['hex', 'rgb', 'rgba', 'hsl', 'hsv']): The format of the color value. - hex: The hex color value. - rgb: The rgb color value. - rgba: The rgba color value. - hsl: The hsl color value. - hsv: The hsv color value.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The visual size of the input field
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined', 'standard']): The visual style variant of the input field

class panel.ui.Column(*objects, **params)[source]#

Bases: MaterialListLike

The Column layout arranges its contents vertically.

Methods

`on_click`(callback)	Register a callback invoked when the scroll-to-latest button is clicked.
`scroll_to`(index)	Scrolls to the child at the provided index.

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

auto_scroll_limit = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Auto scroll limit'): Max pixel distance from the latest object in the Column to activate automatic scrolling upon update. Setting to 0 disables auto-scrolling.
scroll_button_threshold = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Scroll button threshold'): Min pixel distance from the latest object in the Column to display the scroll button. Setting to 0 disables the scroll button.
scroll_position = Integer(default=0, inclusive_bounds=(True, True), label='Scroll position'): Current scroll position of the Column. Setting this value will update the scroll position of the Column. Setting to 0 will scroll to the top.
scroll_index = Integer(allow_None=True, inclusive_bounds=(True, True), label='Scroll index'): Index of the object to scroll to. Setting this value will scroll the Column to the object at the given index.
view_latest = Boolean(default=False, label='View latest'): Whether to scroll to the latest object on init. If not enabled the view will be on the first object.
scroll_button_click = Event(default=False, label='Scroll button click'): Triggered when the scroll-to-latest button is clicked.

on_click(callback: Callable[[Event], None | Awaitable[None]]) → Watcher[source]#: Register a callback invoked when the scroll-to-latest button is clicked.

scroll_to(index: int)[source]#

Scrolls to the child at the provided index.

Parameters:

index: int: Index of the child object to scroll to.

class panel.ui.Container(*objects, **params)[source]#

Bases: MaterialListLike

The Container layout centers your content horizontally. It’s the most basic layout element.

References:

Example:

>>> Container(some_widget, some_pane, some_python_object, title='Container')

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

sizing_mode = Selector(allow_refs=True, default='stretch_width', label='Sizing mode', names={}, objects=['fixed', 'stretch_width', 'stretch_height', 'stretch_both', 'scale_width', 'scale_height', 'scale_both', None]): How the component should size itself. This is a high-level setting for maintaining width and height of the component. To gain more fine grained control over sizing, use width_policy, height_policy and aspect_ratio instead (those take precedence over sizing_mode). "fixed" Component is not responsive. It will retain its original width and height regardless of any subsequent browser window resize events. "stretch_width" Component will responsively resize to stretch to the available width, without maintaining any aspect ratio. The height of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_height" Component will responsively resize to stretch to the available height, without maintaining any aspect ratio. The width of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_both" Component is completely responsive, independently in width and height, and will occupy all the available horizontal and vertical space, even if this changes the aspect ratio of the component. "scale_width" Component will responsively resize to stretch to the available width, while maintaining the original or provided aspect ratio. "scale_height" Component will responsively resize to stretch to the available height, while maintaining the original or provided aspect ratio. "scale_both" Component will responsively resize to both the available width and height, while maintaining the original or provided aspect ratio.
disable_gutters = Boolean(default=False, label='Disable gutters'): If True, the container will not have gutters.
fixed = Boolean(default=False, label='Fixed'): Set the max-width to match the min-width of the current breakpoint. This is useful if you’d prefer to design for a fixed set of sizes instead of trying to accommodate a fully fluid viewport.
width_option = Selector(default='lg', label='Width option', names={}, objects=['xs', 'sm', 'md', 'lg', 'xl', False]): Width option for the container.

class panel.ui.CrossSelector(*, color, definition_order, filter_fn, searchable, size, visual_size, attached, dark_theme, sx, theme_config, use_shadow_dom, description, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialMultiSelectBase

The CrossSelector widget allows selecting multiple values from a list of options.

It falls into the broad category of multi-value, option-selection widgets that provide a compatible API and include the MultiSelect, CrossSelector, CheckBoxGroup and CheckButtonGroup widgets.

References:

Example:

>>> CrossSelector(
...     label='Favourites', value=['Panel', 'hvPlot'],
...     options=['Panel', 'hvPlot', 'HoloViews', 'GeoViews', 'Datashader', 'Param', 'Colorcet'],
...     max_items=2
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.select.MaterialMultiSelectBase: value

width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the cross selector widget.
definition_order = Boolean(default=True, label='Definition order'): Preserve option order when selecting values.
filter_fn = Callable(label='Filter fn'): Function receiving a query and an option label.
searchable = Boolean(default=True, label='Searchable'): Whether the dropdown is searchable
size = Integer(default=10, inclusive_bounds=(True, True), label='Size'): The number of options shown at once (note this is the only way to control the height of this widget)
visual_size = Selector(default='medium', label='Visual size', names={}, objects=['small', 'medium', 'large']): The visual size of the cross selector.

filter_fn(string, flags=0)[source]#: Scan through string looking for a match to the pattern, returning a Match object, or None if no match was found.

width = None#

class panel.ui.DataFrame(object=None, **params)[source]#

Bases: HTML

The DataFrame pane renders pandas, dask and streamz DataFrame types using their custom HTML repr. Other DataFrame-like objects supported by Narwhals, e.g. polars and pyarrow, are rendered by converting them to pandas first, falling back to rendering the table directly if the conversion is not possible, e.g. because pandas or pyarrow are not installed.

In the case of a streamz DataFrame the rendered data will update periodically.

Reference: https://panel.holoviz.org/reference/panes/DataFrame.html

Example:

>>> DataFrame(df, index=False, max_rows=25, width=400)

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.markup.HTML: disable_math, sanitize_html, sanitize_hook

bold_rows = Boolean(default=True, label='Bold rows'): Make the row labels bold in the output.
border = Integer(default=0, inclusive_bounds=(True, True), label='Border'): A border=border attribute is included in the opening <table> tag.
classes = List(bounds=(0, None), default=['panel-df'], label='Classes'): CSS class(es) to apply to the resulting html table.
col_space = ClassSelector(allow_None=True, class_=(<class 'str'>, <class 'int'>, <class 'dict'>), label='Col space'): The minimum width of each column in CSS length units. An int is assumed to be px units.
decimal = String(default='.', label='Decimal'): Character recognized as decimal separator, e.g. ‘,’ in Europe.
escape = Boolean(default=True, label='Escape'): Whether or not to escape the dataframe HTML. For security reasons the default value is True.
float_format = Callable(allow_None=True, label='Float format'): Formatter function to apply to columns’ elements if they are floats. The result of this function must be a unicode string.
formatters = ClassSelector(allow_None=True, class_=(<class 'dict'>, <class 'list'>), label='Formatters'): Formatter functions to apply to columns’ elements by position or name. The result of each function must be a unicode string.
header = Boolean(default=True, label='Header'): Whether to print column labels.
index = Boolean(default=True, label='Index'): Whether to print index (row) labels.
index_names = Boolean(default=True, label='Index names'): Prints the names of the indexes.
justify = Selector(allow_None=True, label='Justify', names={}, objects=['left', 'right', 'center', 'justify', 'justify-all', 'start', 'end', 'inherit', 'match-parent', 'initial', 'unset']): How to justify the column labels.
max_rows = Integer(allow_None=True, inclusive_bounds=(True, True), label='Max rows'): Maximum number of rows to display.
max_cols = Integer(allow_None=True, inclusive_bounds=(True, True), label='Max cols'): Maximum number of columns to display.
na_rep = String(default='NaN', label='Na rep'): String representation of NAN to use.
render_links = Boolean(default=False, label='Render links'): Convert URLs to HTML links.
show_dimensions = Boolean(default=False, label='Show dimensions'): Display DataFrame dimensions (number of rows by number of columns).
sparsify = Boolean(default=True, label='Sparsify'): Set to False for a DataFrame with a hierarchical index to print every multi-index key at each row.
text_align = Selector(label='Text align', names={}, objects=['start', 'end', 'center']): Alignment of non-header cells.
_object = Parameter(allow_None=True, label=' object'): Hidden parameter.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.DatePicker(*, as_numpy_datetime64, clearable, disable_future, disable_past, disabled_dates, enabled_dates, end, format, open_to, size, start, views, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _DatePickerBase

The DatePicker allows selecting a date value using a text box and a date-picking utility.

References:

Example:

>>> DatePicker(
...     value=date(2025,1,1),
...     start=date(2025,1,1), end=date(2025,12,31),
...     name='Date'
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._DatePickerBase: width, size, as_numpy_datetime64, clearable, disabled_dates, disable_future, disable_past, enabled_dates, end, format, open_to, start, views

value = Date(allow_None=True, inclusive_bounds=(True, True), label='Value'): The current value. Can be a datetime object or a string in ISO format.

class panel.ui.DateRangePicker(*, disabled_dates, enabled_dates, end, format, size, start, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialInputWidget

The DateRangePicker allows selecting a date range using a calendar-based picker with two months displayed side by side.

References:

Example:

>>> DateRangePicker(
...     value=(date(2025,1,9), date(2025,1,16)),
...     start=date(2025,1,1), end=date(2025,12,31),
...     name='Date Range'
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

value = DateRange(allow_None=True, inclusive_bounds=(True, True), label='Value', length=2): The selected date range as a tuple of two dates.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), default=300, inclusive_bounds=(True, True), label='Width'): Width of this component. If sizing_mode is set to stretch or scale mode this will merely be used as a suggestion.
disabled_dates = DateList(bounds=(0, None), default=[], label='Disabled dates'): Dates to make unavailable for selection.
enabled_dates = DateList(bounds=(0, None), default=[], label='Enabled dates'): Dates to make available for selection.
end = Date(allow_None=True, inclusive_bounds=(True, True), label='End'): The maximum selectable date.
format = String(default='YYYY-MM-DD', label='Format'): Format of the date when rendered in the input.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The visual size of the date range picker input.
start = Date(allow_None=True, inclusive_bounds=(True, True), label='Start'): The minimum selectable date.
value_start = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value start', readonly=True): The lower value of the selected range.
value_end = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value end', readonly=True): The upper value of the selected range.

class panel.ui.DateRangeSlider(*, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _RangeSliderBase

The DateRangeSlider widget allows selecting a date range using a slider with two handles. Supports datetime.datetime, datetime.date and np.datetime64 ranges.

References:

Example:

>>> import datetime as dt
>>> DateRangeSlider(
...     value=(dt.datetime(2025, 1, 9), dt.datetime(2025, 1, 16)),
...     start=dt.datetime(2025, 1, 1),
...     end=dt.datetime(2025, 1, 31),
...     step=2,
...     name="A tuple of datetimes"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

value = DateRange(allow_None=True, inclusive_bounds=(True, True), label='Value', length=2): The selected range as a tuple of values. Updated when one of the handles is dragged. Supports datetime.datetime, datetime.date, and np.datetime64 ranges.
start = Date(allow_None=True, inclusive_bounds=(True, True), label='Start'): The lower bound.
end = Date(allow_None=True, inclusive_bounds=(True, True), label='End'): The upper bound.
format = String(allow_None=True, label='Format'): Datetime format used for parsing and formatting the date.
step = Number(default=1, inclusive_bounds=(True, True), label='Step'): The step size in days. Default is 1 day.
value_throttled = DateRange(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value throttled', length=2, nested_refs=True, readonly=True): The selected range as a tuple of values. Updated one of the handles is released. Supports datetime.datetime, datetime.date and np.datetime64 ranges
value_start = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value start', readonly=True): The lower value of the selected range.
value_end = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value end', readonly=True): The upper value of the selected range.

end = None#

format = None#

start = None#

value = None#

value_throttled = None#

class panel.ui.DateSlider(*, as_datetime, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ContinuousSlider

The DateSlider widget allows selecting a value within a set of bounds using a slider. Supports datetime.datetime, datetime.date and np.datetime64 values. The step size is fixed at 1 day.

References:

https://panel.holoviz.org/reference/widgets/DateSlider.html

Example:

>>> import datetime as dt
>>> DateSlider(
...     value=dt.datetime(2025, 1, 1),
...     start=dt.datetime(2025, 1, 1),
...     end=dt.datetime(2025, 1, 7),
...     name="A datetime value"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

value = Date(allow_None=True, inclusive_bounds=(True, True), label='Value'): The selected date value of the slider. Updated when the slider handle is dragged. Supports datetime.datetime, datetime.date or np.datetime64 types.
start = Date(allow_None=True, inclusive_bounds=(True, True), label='Start'): The lower bound.
end = Date(allow_None=True, inclusive_bounds=(True, True), label='End'): The upper bound.
format = String(allow_None=True, label='Format'): Datetime format used for parsing and formatting the date.
step = Integer(bounds=(1, None), default=1, inclusive_bounds=(True, True), label='Step'): The step parameter in days.
value_throttled = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value throttled'): The value of the slider. Updated when the slider handle is released.
as_datetime = Boolean(default=False, label='As datetime'): Whether to store the date as a datetime.

end = None#

format = None#

start = None#

value = None#

class panel.ui.DatetimeInput(*, enter_pressed, max_length, size, color, error_state, helper_text, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, end, format, start, description, placeholder, serializer, type, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: TextInput, DatetimeInput

The DatetimeInput allows entering a datetime value using a text input box.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.LiteralInput: serializer, type

panel.widgets.input.DatetimeInput: start, end, format

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: max_length, placeholder, size

panel_material_ui.widgets.input.TextInput: enter_pressed

value = ClassSelector(allow_None=True, class_=(<class 'datetime.datetime'>, <class 'datetime.date'>, <class 'str'>), label='Value'): The current value. Can be a datetime object or a string in ISO format.
value_input = ClassSelector(allow_None=True, class_=(<class 'datetime.datetime'>, <class 'datetime.date'>, <class 'str'>), constant=True, label='Value input', readonly=True): The current value. Can be a datetime object or a string in ISO format.

value = None#

value_input = None#

class panel.ui.DatetimePicker(*, enable_seconds, enable_time, military_time, as_numpy_datetime64, clearable, disable_future, disable_past, disabled_dates, enabled_dates, end, format, open_to, size, start, views, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _DatetimePickerBase

The DatetimePicker allows selecting selecting a datetime value using a textbox and a datetime-picking utility.

References:

Example:

>>> DatetimePicker(
...    value=datetime(2025,1,1,22,0),
...    start=date(2025,1,1), end=date(2025,12,31),
...    military_time=True, name='Date and time'
... )

Also supports string values:

>>> DatetimePicker(
...    value="2025-01-01 22:00:00",
...    military_time=True, name='Date and time'
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._DatePickerBase: width, size, as_numpy_datetime64, clearable, disabled_dates, disable_future, disable_past, enabled_dates

panel_material_ui.widgets.input._DatetimePickerBase: format, open_to, views, enable_seconds, enable_time, military_time

value = Datetime(allow_None=True, inclusive_bounds=(True, True), label='Value'): The current value. Can be a datetime object or a string in ISO format.
end = Datetime(allow_None=True, inclusive_bounds=(True, True), label='End'): The maximum selectable datetime.
start = Datetime(allow_None=True, inclusive_bounds=(True, True), label='Start'): The minimum selectable datetime.

class panel.ui.DatetimeRangeInput(*, end, format, start, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: DatetimeRangeInput

A datetime range composed of two Material datetime inputs.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.widgets.input.DatetimeRangeInput: value, start, end, format

class panel.ui.DatetimeRangePicker(*, enable_seconds, military_time, disabled_dates, enabled_dates, end, format, size, start, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: DateRangePicker

The DatetimeRangePicker allows selecting a datetime range using a calendar-based picker with two months displayed side by side and time inputs for start and end times.

References:

Example:

>>> DatetimeRangePicker(
...     value=(datetime(2025,1,9,8,0), datetime(2025,1,16,17,0)),
...     start=datetime(2025,1,1), end=datetime(2025,12,31),
...     name='Datetime Range'
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input.DateRangePicker: width, disabled_dates, enabled_dates, size

value = DateRange(allow_None=True, inclusive_bounds=(True, True), label='Value', length=2): The selected datetime range as a tuple of two datetimes.
end = Datetime(allow_None=True, inclusive_bounds=(True, True), label='End'): The maximum selectable datetime.
format = String(allow_None=True, label='Format'): Format of the datetime when rendered in the input. If None, will be set automatically based on military_time setting.
start = Datetime(allow_None=True, inclusive_bounds=(True, True), label='Start'): The minimum selectable datetime.
value_start = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value start', readonly=True): The lower value of the selected range.
value_end = Date(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value end', readonly=True): The upper value of the selected range.
enable_seconds = Boolean(default=True, label='Enable seconds'): Enable editing of seconds in the time inputs.
military_time = Boolean(default=True, label='Military time'): Whether to display time in 24 hour format.

format = None#

class panel.ui.DatetimeRangeSlider(*, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: DateRangeSlider

The DatetimeRangeSlider widget allows selecting a datetime range using a slider with two handles. Supports datetime.datetime and np.datetime64 ranges.

References:

Example:

>>> import datetime as dt
>>> DatetimeRangeSlider(
...     value=(dt.datetime(2025, 1, 9), dt.datetime(2025, 1, 16)),
...     start=dt.datetime(2025, 1, 1),
...     end=dt.datetime(2025, 1, 31),
...     step=60*60,
...     label="A tuple of datetimes"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider.DateRangeSlider: value, start, end, format, value_throttled, value_start, value_end

step = Number(default=60, inclusive_bounds=(True, True), label='Step'): The step size in seconds. Default is 1 minute, i.e 60 seconds.

class panel.ui.DatetimeSlider(*, as_datetime, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: DateSlider

The DatetimeSlider widget allows selecting a value within a set of bounds using a slider. Supports datetime.date, datetime.datetime and np.datetime64 values. The step size is fixed at 1 minute.

References:

Example:

>>> import datetime as dt
>>> DatetimeSlider(
...     value=dt.datetime(2025, 1, 1),
...     start=dt.datetime(2025, 1, 1),
...     end=dt.datetime(2025, 1, 7),
...     name="A datetime value"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider.DateSlider: value, start, end, format, value_throttled

step = Number(bounds=(1, None), default=60, inclusive_bounds=(True, True), label='Step'): The step size in seconds. Default is 1 minute, i.e 60 seconds.
as_datetime = Boolean(constant=True, default=True, label='As datetime', readonly=True): Whether to store the date as a datetime.

class panel.ui.Debugger(*, _number_of_errors, _number_of_infos, _number_of_warnings, formatter_args, level, logger_names, only_last, active_header_background, button_css_classes, collapsed, collapsible, header, header_background, header_color, header_css_classes, hide_header, title, title_css_classes, auto_scroll_limit, scroll_button_threshold, scroll_position, view_latest, scroll, objects, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, name)[source]#

Bases: Card

A uneditable Card layout holding a terminal printing out logs from your callbacks. By default, it will only print exceptions. If you want to add your own log, use the panel.callbacks logger within your callbacks: logger = logging.getLogger(‘panel.callbacks’)

Methods

acknowledge_errors
update_log_counts

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.base.ListLike: objects

panel.layout.base.ListPanel: scroll

panel.layout.base.Column: auto_scroll_limit, scroll_button_threshold, scroll_position, view_latest

panel.layout.card.Card: css_classes, active_header_background, button_css_classes, collapsible, collapsed, header, header_background, header_color, header_css_classes, hide_header, title_css_classes, title

_number_of_errors = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label=' number of errors'): Number of logged errors since last acknowledged.
_number_of_warnings = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label=' number of warnings'): Number of logged warnings since last acknowledged.
_number_of_infos = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label=' number of infos'): Number of logged information since last acknowledged.
only_last = Boolean(default=True, label='Only last'): Whether only the last stack is printed or the full.
level = Integer(default=40, inclusive_bounds=(True, True), label='Level'): Logging level to print in the debugger terminal.
formatter_args = Dict(class_=<class 'dict'>, default={'fmt': '%(asctime)s [%(name)s - %(levelname)s]: %(message)s'}, label='Formatter args'): Arguments to pass to the logging formatter. See the standard python logging libraries.
logger_names = List(bounds=(1, None), default=['panel'], item_type=<class 'str'>, label='Logger names'): Loggers which will be prompted in the debugger terminal.

class panel.ui.DeckGL(object=None, **params)[source]#

Bases: ModelPane

The DeckGL pane renders the Deck.gl JSON specification as well as PyDeck plots inside a panel.

Deck.gl is a very powerful WebGL-powered framework for visual exploratory data analysis of large datasets.

Reference: https://panel.holoviz.org/reference/panes/DeckGL.html

Example:

>>> pn.extension('deckgl')
>>> DeckGL(
...    some_deckgl_dict_or_pydeck_object,
...    mapbox_api_key=MAPBOX_KEY, height=600
... )

Attributes:

priority

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

is_pydeck

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

mapbox_api_key = String(allow_None=True, label='Mapbox api key'): The MapBox API key if not supplied by a PyDeck object.
tooltips = ClassSelector(class_=(<class 'bool'>, <class 'dict'>), default=True, label='Tooltips'): Whether to enable tooltips
configuration = String(default='', label='Configuration'): Custom configuration dictionary as json string
click_state = Dict(class_=<class 'dict'>, default={}, label='Click state'): Contains the last click event on the DeckGL plot.
hover_state = Dict(class_=<class 'dict'>, default={}, label='Hover state'): The current hover state of the DeckGL plot.
view_state = Dict(class_=<class 'dict'>, default={}, label='View state'): The current view state of the DeckGL plot.
throttle = Dict(class_=<class 'dict'>, default={'view': 200, 'hover': 200}, label='Throttle'): Throttling timeout (in milliseconds) for view state and hover events sent from the frontend.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.Details(*items: list[Any | tuple[str, Any]], **params: Any)[source]#

Bases: MaterialNamedListLike, PaperMixin

A Details layout allows arranging multiple panel objects in a compact, collapsible container with three expansion states: collapsed, expanded (with scrollable area), and fully expanded.

References:

https://panel-material-ui.holoviz.org/reference/layouts/Details.html

Example:

>>> Details(some_widget, some_pane, some_python_object, title='Details')

Methods

select([selector])

Iterates over the Viewable and any potential children in the applying the Selector.

Parameter Definitions

Parameters inherited from:

panel_material_ui.layout.base.PaperMixin: elevation, raised, square, variant

panel.layout.base.NamedListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialNamedListLike: _names, _headers

collapsed = Boolean(default=True, label='Collapsed'): Whether the contents of the Details are collapsed.
fully_expanded = Boolean(default=False, label='Fully expanded'): Whether the Details are fully expanded (no scrollable area). Only applies when collapsed is False.
header = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label='Header'): A Panel component to display in the header bar of the Details. Will override the given title if defined.
header_background = Color(allow_None=True, allow_named=True, label='Header background'): The background color of the Details header.
header_color = Color(allow_None=True, allow_named=True, label='Header color'): The text color of the Details header.
header_css_classes = List(bounds=(0, None), default=[], label='Header css classes'): List of CSS classes to apply to DetailsHeader component.
hide_header = Boolean(default=False, label='Hide header'): Whether to hide the details header.
outlined = Boolean(default=True, label='Outlined'): Whether the details is outlined.
scrollable_height = Integer(allow_None=True, default=150, inclusive_bounds=(True, True), label='Scrollable height'): Height of the scrollable area before it is fully expanded.
title = String(default='', label='Title'): A title to be displayed in the Details header, will be overridden by the header if defined.
title_css_classes = List(bounds=(0, None), default=[], label='Title css classes'): List of CSS classes to apply to DetailsTitle component.

select(selector: type | Callable[[Viewable], bool] | None = None) → list[Viewable][source]#

Iterates over the Viewable and any potential children in the applying the Selector.

Parameters:

selector: type or callable or None: The selector allows selecting a subset of Viewables by declaring a type or callable function to filter by.

Returns:

viewables: list(Viewable)

class panel.ui.Dial(*, annulus_width, background, bounds, colors, default_color, end_angle, format, label_color, nan_format, needle_color, needle_width, start_angle, tick_size, title_size, unfilled_color, value_size, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: ValueIndicator

A Dial represents a value in some range as a position on an annular dial. It is similar to a Gauge but more minimal visually.

Reference: https://panel.holoviz.org/reference/indicators/Dial.html

Example:

>>> Dial(label='Speed', value=79, format="{value} km/h", bounds=(0, 200), colors=[(0.4, 'green'), (1, 'red')])

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: margin, disabled

panel.widgets.indicators.Indicator: sizing_mode

value = Number(allow_None=True, default=25, inclusive_bounds=(True, True), label='Value'): Value to indicate on the dial a value within the declared bounds.
height = Integer(allow_None=True, bounds=(1, None), default=250, inclusive_bounds=(True, True), label='Height'): The height of the component (in pixels). This can be either fixed or preferred height, depending on height sizing policy.
width = Integer(allow_None=True, bounds=(1, None), default=250, inclusive_bounds=(True, True), label='Width'): The width of the component (in pixels). This can be either fixed or preferred width, depending on width sizing policy.
annulus_width = Number(default=0.2, inclusive_bounds=(True, True), label='Annulus width'): Width of the radial annulus as a fraction of the total.
background = Parameter(allow_None=True, label='Background'): Background color of the component.
bounds = Range(default=(0, 100), inclusive_bounds=(True, True), label='Bounds', length=2): The upper and lower bound of the dial.
colors = List(allow_None=True, bounds=(0, None), item_type=<class 'tuple'>, label='Colors'): Color thresholds for the Dial, specified as a list of tuples of the fractional threshold and the color to switch to.
default_color = String(default='lightblue', label='Default color'): Color of the radial annulus if not color thresholds are supplied.
end_angle = Number(default=25, inclusive_bounds=(True, True), label='End angle'): Angle at which the dial ends.
format = String(default='{value}%', label='Format'): Formatting string for the value indicator and lower/upper bounds.
label_color = String(default='black', label='Label color'): Color for all extraneous labels.
nan_format = String(default='-', label='Nan format'): How to format nan values.
needle_color = String(default='black', label='Needle color'): Color of the Dial needle.
needle_width = Number(default=0.1, inclusive_bounds=(True, True), label='Needle width'): Radial width of the needle.
start_angle = Number(default=-205, inclusive_bounds=(True, True), label='Start angle'): Angle at which the dial starts.
tick_size = String(allow_None=True, label='Tick size'): Font size of the Dial min/max labels.
title_size = String(allow_None=True, label='Title size'): Font size of the Dial title.
unfilled_color = String(default='whitesmoke', label='Unfilled color'): Color of the unfilled region of the Dial.
value_size = String(allow_None=True, label='Value size'): Font size of the Dial value label.

class panel.ui.Dialog(*objects, **params)[source]#

Bases: MaterialListLike

The Dialog can be used to display important content in a modal-like overlay that requires user interaction. It is often used for tasks such as confirmations, forms, or displaying additional information.

References:

Example:

>>> close = Button(on_click=lambda _: dialog.param.update(open=False), label='Close')  # type: ignore
>>> dialog = Dialog("This is a modal", close)
>>> button = Button(on_click=lambda _: dialog.param.update(open=True), label=f'Open {Dialog.name}')
>>> pn.Column(button, dialog).servable()

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

scroll = Selector(default='paper', label='Scroll', names={}, objects=['body', 'paper']): Whether the dialog should scroll the content or the paper.
close_on_click = Boolean(default=False, label='Close on click'): Close when clicking outside the Dialog area.
full_screen = Boolean(default=False, label='Full screen'): Whether the dialog should be full screen.
open = Boolean(default=False, label='Open'): Whether the dialog is open.
title = String(default='', label='Title'): The title of the dialog.
title_variant = String(default='h3', label='Title variant'): The text variant of the Dialog title.
show_close_button = Boolean(default=False, label='Show close button'): Whether to show the close button.
width_option = Selector(default='sm', label='Width option', names={}, objects=['xs', 'sm', 'md', 'lg', 'xl', False]): The width of the dialog.

class panel.ui.DictInput(*, enter_pressed, max_length, size, color, error_state, helper_text, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, description, placeholder, serializer, type, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: LiteralInput

The DictInput allows entering a dictionary value using a text input box.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.LiteralInput: serializer

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: max_length, placeholder, size

panel_material_ui.widgets.input.TextInput: enter_pressed

panel_material_ui.widgets.input.LiteralInput: value_input

value = Parameter(default={}, label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
type = ClassSelector(class_=<class 'type'>, constant=True, default=<class 'dict'>, label='Type', readonly=True): The type of the value.

type#: alias of dict

class panel.ui.DiscretePlayer(*, color, size, variant, attached, description, dark_theme, sx, theme_config, use_shadow_dom, value_throttled, direction, interval, loop_policy, preview_duration, scale_buttons, show_loop_controls, show_value, step, value_align, visible_buttons, visible_loop_options, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _PlayerBase, DiscretePlayer

The DiscretePlayer provides controls to iterate through a list of discrete options. The speed at which the widget plays is defined by the interval (in milliseconds), but it is also possible to skip items using the step parameter.

References:

Example:

>>> DiscretePlayer(
...     label='Discrete Player',
...     options=[2, 4, 8, 16, 32, 64, 128], value=32,
...     loop_policy='loop'
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.player.PlayerBase: direction, loop_policy, preview_duration, show_loop_controls, step, value_align, scale_buttons, visible_buttons, visible_loop_options

panel.widgets.player.DiscretePlayer: value, interval, show_value, value_throttled

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.player._PlayerBase: height, width, color, size, variant

options = ClassSelector(class_=(<class 'dict'>, <class 'list'>), default=[], label='Options'): A list or dictionary of valid options.

class panel.ui.DiscreteSlider(*, formatter, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: IntSlider, SingleSelectBase

The DiscreteSlider widget allows selecting a discrete value using a slider.

References:

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider.IntSlider: format

value = Parameter(allow_None=True, default=0, label='Value'): The selected value of the slider. Updated when the handle is dragged. Must be one of the options.
options = ClassSelector(class_=(<class 'dict'>, <class 'list'>), default=[], label='Options'): A list or dictionary of valid options.
start = Integer(constant=True, default=0, inclusive_bounds=(True, True), label='Start', readonly=True): The starting value of the slider.
end = Integer(constant=True, default=100, inclusive_bounds=(True, True), label='End', readonly=True): The ending value of the slider.
step = Integer(bounds=(1, None), constant=True, default=1, inclusive_bounds=(True, True), label='Step', readonly=True): The step size for the slider.
value_throttled = Parameter(allow_None=True, constant=True, default=0, label='Value throttled'): The value of the slider. Updated when the handle is released.
formatter = String(default='%.3g', label='Formatter'): Format applied to numeric option labels.

class panel.ui.Divider(*objects, **params)[source]#

Bases: MaterialListLike

A Divider draws a horizontal rule (a <hr> tag in HTML) to separate multiple components in a layout.

References:

Example:

>>> Divider(sizing_mode="stretch_width")

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

orientation = Selector(default='horizontal', label='Orientation', names={}, objects=['horizontal', 'vertical']): Orientation of the divider.
variant = Selector(default='fullWidth', label='Variant', names={}, objects=['fullWidth', 'inset', 'middle']): Variant style of the divider.

class panel.ui.Drawer(*objects, **params)[source]#

Bases: MaterialListLike

The Drawer component can be used to display important content in a modal-like overlay that requires user interaction. It is often used for tasks such as confirmations, forms, or displaying additional information.

References:

Example:

>>> drawer = Drawer("This is a drawer")
>>> button = Button(on_click=lambda _: drawer.param.update(open=True), label='Open Drawer')
>>> pn.Column(button, drawer).servable()

Methods

create_toggle([icon, active_icon])

Create a ToggleIcon for the drawer.

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

anchor = Selector(default='left', label='Anchor', names={}, objects=['left', 'right', 'top', 'bottom']): Anchor position for the drawer.
dock_icon = String(allow_None=True, label='Dock icon'): Icon to display in the dock tab (only applies to ‘docked’ variant). When unset, a directional chevron is used.
dock_position = Selector(default='middle', label='Dock position', names={}, objects=['start', 'middle', 'end']): Position of the toggle tab along the drawer edge (only applies to ‘docked’ variant).
inline = Boolean(default=False, label='Inline'): Whether the drawer is positioned inline within its parent container rather than fixed/absolute to the page. When True, the drawer participates in normal flow layout and pushes or shrinks sibling items.
size = Integer(default=250, inclusive_bounds=(True, True), label='Size'): The width (for left/right anchors) or height (for top/bottom anchors) of the drawer.
open = Boolean(default=False, label='Open'): Whether the drawer is open.
variant = Selector(default='temporary', label='Variant', names={}, objects=['docked', 'permanent', 'persistent', 'temporary']): Variant style of the drawer.

create_toggle(icon: str = 'menu', active_icon: str = 'menu_open_icon', **params)[source]#

Create a ToggleIcon for the drawer.

Parameters:

icon: str: The icon to display when the drawer is closed.
active_icon: str: The icon to display when the drawer is open.

Returns:

toggle: ToggleIcon: A ToggleIcon component that can be used to toggle the drawer.

class panel.ui.ECharts(object=None, **params)[source]#

Bases: ModelPane

ECharts panes allow rendering echarts.js dictionaries and pyecharts plots.

Reference: https://panel.holoviz.org/reference/panes/ECharts.html

Example:

>>> pn.extension('echarts')
>>> ECharts(some_echart_dict_or_pyecharts_object, height=480, width=640)

Attributes:

priority

Methods

`applies`(object, **params)	Returns boolean or float indicating whether the Pane can render the object.
`js_on_event`(event, callback[, query])	Register a Javascript event handler which triggers when the specified event is triggered.
`on_event`(event, callback[, query])	Register anevent handler which triggers when the specified event is triggered.

is_pyecharts

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

object = Parameter(allow_None=True, allow_refs=True, label='Object'): The Echarts object being wrapped. Can be an Echarts dictionary or a pyecharts chart
options = Dict(allow_None=True, class_=<class 'dict'>, label='Options'): An optional dict of options passed to Echarts.setOption. Allows to fine-tune the rendering behavior. For example, you might want to use options={ “replaceMerge”: [‘series’] }) when updating the objects with a value containing a smaller number of series.
renderer = Selector(default='canvas', label='Renderer', names={}, objects=['canvas', 'svg']): Whether to render as HTML canvas or SVG
theme = Selector(default='default', label='Theme', names={}, objects=['default', 'light', 'dark']): Theme to apply to plots.

classmethod applies(object: Any, **params) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

js_on_event(event: str, callback: str | CustomJS, query: str | None = None, **args)[source]#

Register a Javascript event handler which triggers when the specified event is triggered. The callback can be a snippet of Javascript code or a bokeh CustomJS object making it possible to manipulate other models in response to an event.

Reference: https://apache.github.io/echarts-handbook/en/concepts/event/

Parameters:

event: str: The name of the event to register a handler on, e.g. ‘click’.
code: str: The event handler to be executed when the event fires.
query: str | None: A query that determines when the event fires.
args: Viewable: A dictionary of Viewables to make available in the namespace of the object.

on_event(event: str, callback: Callable, query: str | None = None)[source]#

Register anevent handler which triggers when the specified event is triggered.

Reference: https://apache.github.io/echarts-handbook/en/concepts/event/

Parameters:

event: str: The name of the event to register a handler on, e.g. ‘click’.
callback: str | CustomJS: The event handler to be executed when the event fires.
query: str | None: A query that determines when the event fires.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.EditableFloatSlider(*, fixed_end, fixed_start, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _EditableContinuousSliderBase, FloatSlider

The EditableFloatSlider widget allows selecting a numeric floating-point value within a set of bounds using a slider and for more precise control offers an editable number input box.

References:

Example:

>>> EditableFloatSlider(
...     value=1.0, start=0.0, end=2.0, step=0.25, label="A float value"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: value, bar_color, direction, tooltips, color, start, end, format, marks, size, track, value_label, value_throttled, inline_layout

panel_material_ui.widgets.slider.FloatSlider: step

fixed_start = Number(allow_None=True, inclusive_bounds=(True, True), label='Fixed start'): A fixed lower bound for the slider and input.
fixed_end = Number(allow_None=True, inclusive_bounds=(True, True), label='Fixed end'): A fixed upper bound for the slider and input.

class panel.ui.EditableIntRangeSlider(*, fixed_end, fixed_start, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _EditableRangeSliderBase, IntRangeSlider

The EditableIntRangeSlider widget allows selecting an integer range using a slider with two handles and for more precise control offers an editable integer input box.

References:

https://panel-material-ui.holoviz.org/reference/widgets/EditableIntRangeSlider.html

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider._RangeSliderBase: value_throttled

panel_material_ui.widgets.slider.IntRangeSlider: start, end, format, step, value_start, value_end

panel_material_ui.widgets.slider._EditableRangeSliderBase: value

fixed_start = Integer(allow_None=True, inclusive_bounds=(True, True), label='Fixed start'): A fixed lower bound for the slider and input.
fixed_end = Integer(allow_None=True, inclusive_bounds=(True, True), label='Fixed end'): A fixed upper bound for the slider and input.

class panel.ui.EditableIntSlider(*, fixed_end, fixed_start, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _EditableContinuousSliderBase, IntSlider

The EditableIntSlider widget allows selecting an integer value within a set of bounds using a slider and for more precise control offers an editable integer input box.

References:

Example:

>>> EditableIntSlider(
...     value=2, start=0, end=5, step=1, label="An integer value"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider.IntSlider: value, start, end, format, step, value_throttled

fixed_start = Integer(allow_None=True, inclusive_bounds=(True, True), label='Fixed start'): A fixed lower bound for the slider and input.
fixed_end = Integer(allow_None=True, inclusive_bounds=(True, True), label='Fixed end'): A fixed upper bound for the slider and input.

class panel.ui.EditableRangeSlider(*, fixed_end, fixed_start, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _EditableRangeSliderBase, RangeSlider

The EditableRangeSlider widget allows selecting a floating-point range using a slider with two handles and for more precise control offers an editable number input box.

References:

https://panel-material-ui.holoviz.org/reference/widgets/EditableFloatRangeSlider.html

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, start, end, format, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider._RangeSliderBase: value_throttled, value_start, value_end

panel_material_ui.widgets.slider.RangeSlider: step

panel_material_ui.widgets.slider._EditableRangeSliderBase: value

fixed_start = Number(allow_None=True, inclusive_bounds=(True, True), label='Fixed start'): A fixed lower bound for the slider and input.
fixed_end = Number(allow_None=True, inclusive_bounds=(True, True), label='Fixed end'): A fixed upper bound for the slider and input.

class panel.ui.Fab(*, href, target, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: Button

The Fab is a floating action button that allows triggering events when the button is clicked.

References:

Example:

>>> Fab(icon='add')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: width, clicks, disable_elevation, end_icon

panel_material_ui.widgets.button.Button: value, href, target

button_style = Selector(label='Button style', names={}, objects=['circular', 'extended']): The variant of the component (alias for variant to match Panel’s Button API).
variant = Selector(default='circular', label='Variant', names={}, objects=['circular', 'extended']): The variant of the button.
icon = String(allow_None=True, default='add', label='Icon'): The icon to display on the button.
icon_size = String(default='1.5em', label='Icon size'): Size of the icon as a string, e.g. 12px or 1em.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the button.

button_style: t.Literal['circular', 'extended'] | None = None#

class panel.ui.Feed(*objects, **params)[source]#

Bases: Column

The Feed layout is a buffered Column optimized for long, dynamic lists.

Methods

scroll_to_latest([scroll_limit])

Scrolls the Feed to the latest entry.

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.Column: auto_scroll_limit, scroll_button_threshold, scroll_position, scroll_index, view_latest, scroll_button_click

scroll = Selector(default='y', label='Scroll', names={}, objects=[False, True, 'both-auto', 'y-auto', 'x-auto', 'both', 'x', 'y']): Whether to add scrollbars if the content overflows the size of the container. If “both-auto”, will only add scrollbars if the content overflows in either directions. If “x-auto” or “y-auto”, will only add scrollbars if the content overflows in the respective direction. If “both”, will always add scrollbars. If “x” or “y”, will always add scrollbars in the respective direction. If False, overflowing content will be clipped. If True, will only add scrollbars in the direction of the container, (e.g. Column: vertical, Row: horizontal).
load_buffer = Integer(bounds=(0, None), default=10, inclusive_bounds=(True, True), label='Load buffer'): The number of objects loaded on each side of the visible objects. When scrolled halfway into the buffer, the feed will automatically load additional objects while unloading objects on the opposite side.
visible_children = List(bounds=(0, None), default=[], item_type=<class 'str'>, label='Visible children'): Internal list of currently visible frontend child model ids.
visible_range = Range(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Visible range', length=2, readonly=True): Read-only upper and lower bounds of the currently visible feed objects. This range is automatically updated based on scrolling.

scroll_to_latest(scroll_limit: float | None = None) → None[source]#

Scrolls the Feed to the latest entry.

Parameters:

scroll_limitfloat, optional: Maximum pixel distance from the latest object in the Feed to trigger scrolling. If the distance exceeds this limit, scrolling will not occur. If this is not set, it will always scroll to the latest while setting this to 0 disables scrolling.

class panel.ui.FileDownload(file=None, **params)[source]#

Bases: _ButtonBase, FileDownload

The FileDownload widget allows a user to download a file.

It works either by sending the file data to the browser on initialization (`embed`=True), or when the button is clicked.

References:

Example:

>>> FileDownload(file='IntroductionToPanel.ipynb', filename='intro.ipynb')

Methods

transfer([download])

Transfers current data to the frontend.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: value

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.misc.FileDownload: auto, callback, data, embed, file, filename, _clicks, _transfers

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: width, variant, clicks, disable_elevation, end_icon, icon, size

icon_size = String(default='1em', label='Icon size'): Size of the icon as a string, e.g. 12px or 1em.
_syncing = Boolean(default=False, label=' syncing'): If auto is False track syncing data state.

transfer(download: bool = False)[source]#

Transfers current data to the frontend.

Parameters:

download: bool: If True, the data will automatically be downloaded once the data is transferred.

class panel.ui.FileDropper(*, accepted_filetypes, chunk_size, layout, max_file_size, max_files, max_total_file_size, mime_type, multiple, previews, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: Widget

The FileDropper allows the user to upload one or more files to the server.

It is similar to the FileInput widget but additionally adds support for chunked uploads, making it possible to upload large files. The UI also supports previews for image files. Unlike FileInput the uploaded files are stored as dictionary of bytes object indexed by the filename.

Reference: https://panel.holoviz.org/reference/widgets/FileDropper.html

Example:

>>> FileDropper(accepted_filetypes=['image/*'], multiple=True)

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, disabled

value = Dict(class_=<class 'dict'>, default={}, label='Value'): A dictionary containing the uploaded file(s) as bytes or string objects indexed by the filename. Files that have a text/* mimetype will automatically be decoded as utf-8.
width = Integer(allow_None=True, bounds=(0, None), default=300, inclusive_bounds=(True, True), label='Width'): Width of this component. If sizing_mode is set to stretch or scale mode this will merely be used as a suggestion.
accepted_filetypes = List(bounds=(0, None), default=[], item_type=<class 'str'>, label='Accepted filetypes'): List of accepted file types. Can be mime types, file extensions or wild cards.For instance [‘image/*’] will accept all images. [‘.png’, ‘image/jpeg’] will only accepts PNGs and JPEGs.
chunk_size = Integer(default=10000000, inclusive_bounds=(True, True), label='Chunk size'): Size in bytes per chunk transferred across the WebSocket.
layout = Selector(label='Layout', names={}, objects=['circle', 'compact', 'integrated']): Compact mode removes padding. Integrated mode renders FilePond as part of a bigger element. Circle mode keeps FilePond’s per-file action buttons and upload progress indicator inside the circular drop area.
max_file_size = String(allow_None=True, label='Max file size'): Maximum size of a file as a string with units given in KB or MB, e.g. 5MB or 750KB.
max_files = Integer(allow_None=True, inclusive_bounds=(True, True), label='Max files'): Maximum number of files that can be uploaded if multiple=True.
max_total_file_size = String(allow_None=True, label='Max total file size'): Maximum size of all uploaded files, as a string with units given in KB or MB, e.g. 5MB or 750KB.
mime_type = Dict(class_=<class 'dict'>, default={}, label='Mime type'): A dictionary containing the mimetypes for each of the uploaded files indexed by their filename.
multiple = Boolean(default=False, label='Multiple'): Whether to allow uploading multiple files.
previews = ListSelector(default=['image', 'pdf'], label='Previews', names={}, objects=['image', 'pdf']): List of previews to enable in the FileDropper. The following previews are available: - image: Adds support for image previews. - pdf: Adds support for PDF previews.

class panel.ui.FileInput(*, chunk_size, max_file_size, max_total_file_size, uploaded_label, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, accept, description, directory, filename, mime_type, multiple, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _FileUploadArea, _ButtonBase, FileInput

The FileInput allows the user to upload one or more files to the server.

It makes the filename, MIME type and (bytes) content available in Python.

References:

Example:

>>> FileInput(accept='.png,.jpeg', multiple=True)

Methods

`clear`()	Clear the file(s) in the FileInput widget
`object`()	Returns the currently uploaded file(s) as a viewable Python object or list of viewable Python objects.
`save`(filename)	Saves the uploaded FileInput data object(s) to file(s) or BytesIO object(s).
`view`(*[, object_if_no_value, layout])	Create a bound Panel component for viewing the uploaded file(s).

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.FileInput: value, accept, directory, filename, mime_type, multiple

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: variant, clicks, disable_elevation, end_icon, icon, icon_size, size

panel_material_ui.widgets.input._FileUploadArea: chunk_size, max_file_size, max_total_file_size, uploaded_label

width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the button in pixels.

clear()[source]#: Clear the file(s) in the FileInput widget

object()[source]#

Returns the currently uploaded file(s) as a viewable Python object or list of viewable Python objects.

For example an uploaded CSV file will return a Pandas DataFrame, an uploaded MP3 file will return the path to a temporary file etc.

save(filename)[source]#

Saves the uploaded FileInput data object(s) to file(s) or BytesIO object(s).

Parameters:

filename (str or list[str]): File path or file-like object

view(*, object_if_no_value=None, layout=None, **kwargs)[source]#

Create a bound Panel component for viewing the uploaded file(s).

This method creates a view of the currently uploaded file(s). It updates when the uploaded file value changes.

Parameters:

object_if_no_valueDisplayble Python object, optional: Object to display when no files are uploaded. If None, an invisible layout will be shown when no files are present.
layoutPanel layout class, optional: The layout class to use for organizing multiple file views. If None, defaults to panel_material_ui.Tabs.
**kwargs: Additional keyword arguments passed to the layout component.

Returns:

Panel bound function: A Panel bind object that reactively updates the file view when the FileInput parameters change.

Examples

>>> file_input = FileInput()
>>> file_view = file_input.view(layout=pmui.Column)
>>> # The view will automatically update when files are uploaded

width = None#

class panel.ui.FileSelector(directory: str | os.PathLike | None = None, fs: AbstractFileSystem | None = None, **params)[source]#

Bases: MaterialWidget, BaseFileSelector

The FileSelector widget allows browsing the filesystem on the server and selecting one or more files in a directory.

The widget renders a Material UI file browser consisting of a navigation toolbar (back, forward, up and reload), a breadcrumb trail and an editable path field, a list of the entries in the current directory and a collapsible summary of the current selection.

By default the directory the widget is initialized with also becomes the root_directory, i.e. the boundary the user cannot navigate above. Since the browser is a filesystem read primitive, always set root_directory explicitly when serving a FileSelector to untrusted users.

References:

Example:

>>> FileSelector(directory='~', file_pattern='*.png')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

directory = String(default='/Users/runner/work/panel/panel', label='Directory'): The directory to explore.
file_pattern = String(default='*', label='File pattern'): A glob-like pattern to filter the files.
only_files = Boolean(default=False, label='Only files'): Whether to only allow selecting files.
refresh_period = Integer(allow_None=True, inclusive_bounds=(True, True), label='Refresh period'): If set to non-None value indicates how frequently to refresh the directory contents in milliseconds.
root_directory = String(allow_None=True, label='Root directory'): The root directory beyond which users cannot navigate. If not set it is pinned to the directory the widget was initialized with.
value = List(bounds=(0, None), default=[], item_type=(<class 'str'>, <class 'pathlib.Path'>), label='Value'): List of selected files.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the checkboxes and links.
show_hidden = Boolean(default=False, label='Show hidden'): Whether to show hidden files and directories (starting with a period).
size = Integer(default=10, inclusive_bounds=(True, True), label='Size'): The approximate number of entries shown at once, which bounds the height of the entry list.
_can_back = Boolean(default=False, label=' can back'): Whether the back button is enabled.
_can_forward = Boolean(default=False, label=' can forward'): Whether the forward button is enabled.
_can_up = Boolean(default=False, label=' can up'): Whether the up button is enabled.
_crumbs = List(bounds=(0, None), default=[], item_type=<class 'dict'>, label=' crumbs'): Breadcrumb trail from the root directory to the current directory.
_items = List(bounds=(0, None), default=[], item_type=<class 'dict'>, label=' items'): The entries in the current directory.

width = None#

class panel.ui.FlexBox(*objects, **params)[source]#

Bases: MaterialListLike

The FlexBox layout arranges its contents in a flex container.

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

align_content = Selector(default='flex-start', label='Align content', names={}, objects=['normal', 'flex-start', 'flex-end', 'center', 'space-between', 'space-around', 'space-evenly', 'stretch', 'start', 'end', 'baseline', 'first baseline', 'last baseline']): Defines how a flex container’s lines align when there is extra space in the cross-axis.
align_items = Selector(default='flex-start', label='Align items', names={}, objects=['stretch', 'flex-start', 'flex-end', 'center', 'baseline', 'first baseline', 'last baseline', 'start', 'end', 'self-start', 'self-end']): Defines the default behavior for how flex items are laid out along the cross axis on the current line.
flex_direction = Selector(default='row', label='Flex direction', names={}, objects=['row', 'row-reverse', 'column', 'column-reverse']): This establishes the main-axis, thus defining the direction flex items are placed in the flex container.
flex_wrap = Selector(default='wrap', label='Flex wrap', names={}, objects=['nowrap', 'wrap', 'wrap-reverse']): Whether and how to wrap items in the flex container.
gap = String(default='', label='Gap'): Defines the spacing between flex items, supporting various units (px, em, rem, %, vw/vh).
justify_content = Selector(default='flex-start', label='Justify content', names={}, objects=['flex-start', 'flex-end', 'center', 'space-between', 'space-around', 'space-evenly', 'start', 'end', 'left', 'right']): Defines the alignment along the main axis.

class panel.ui.FloatInput(*, step, value_throttled, page_step_multiplier, wheel_wait, mode, end, format, placeholder, size, start, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _SpinnerBase, _FloatInputBase

The FloatInput allows selecting an integer value using a spinbox.

It behaves like a slider except that lower and upper bounds are optional and a specific value can be entered. The value can be changed using the keyboard (up, down, page up, page down), mouse wheel and arrow buttons.

References:

Example:

>>> FloatInput(label='Value', value=100, start=0, end=1000, step=10)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._NumericInputBase: format, placeholder, size

panel_material_ui.widgets.input._FloatInputBase: value, start, end, mode

panel_material_ui.widgets.input._SpinnerBase: width, page_step_multiplier, wheel_wait

step = Number(default=0.1, inclusive_bounds=(True, True), label='Step'): The step size.
value_throttled = Number(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value throttled'): The current value. Updates only on <enter> or when the widget looses focus.

class panel.ui.FloatPanel(*objects, name='', **params)[source]#

Bases: ListLike, ReactiveHTML

Float provides a floating panel layout.

Reference: https://panel.holoviz.org/reference/layouts/FloatPanel.html

Example:

>>> import panel as pn
>>> pn.extension("floatpanel")
>>> pn.layout.FloatPanel("**I can float**!", position="center", width=300).servable()

Methods

`clone`(objects, *params)	Makes a copy of the layout sharing the same parameters.
`select`([selector])	Iterates over the Viewable and any potential children in the applying the Selector.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.base.ListLike: objects

config = Dict(class_=<class 'dict'>, default={}, label='Config'): Additional jsPanel configuration with precedence over parameter values.
contained = Boolean(default=True, label='Contained'): Whether the component is contained within parent container or completely free floating.
position = Selector(default='right-top', label='Position', names={}, objects=['center', 'left-top', 'center-top', 'right-top', 'right-center', 'right-bottom', 'center-bottom', 'left-bottom', 'left-center']): The initial position if the container is free-floating.
offsetx = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Offsetx'): Horizontal offset in pixels.
offsety = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Offsety'): Vertical offset in pixels.
theme = String(default='primary', label='Theme'): The theme which can be one of: - Built-ins: ‘default’, ‘primary’, ‘secondary’, ‘info’, ‘success’, ‘warning’, ‘danger’, ‘light’, ‘dark’ and ‘none’ - HEX, RGB and HSL color values like ‘#123456’ Any standardized color name like ‘forestgreen’ and color names from the Material Design Color System like ‘purple900’ - Additionally a theme string may include one of the modifiers ‘filled’, ‘filledlight’, ‘filleddark’ or ‘fillcolor’ separated from the theme color by a space like ‘primary
status = Selector(default='normalized', label='Status', names={}, objects=['normalized', 'maximized', 'minimized', 'smallified', 'smallifiedmax', 'closed']): The current status of the panel.

clone(*objects: t.Any, **params: t.Any) → Self[source]#

Makes a copy of the layout sharing the same parameters.

Parameters:

objects: Objects to add to the cloned layout.
params: Keyword arguments override the parameters on the clone.

Returns:

Cloned layout object

select(selector=None)[source]#

Iterates over the Viewable and any potential children in the applying the Selector.

Parameters:

selector: type or callable or None: The selector allows selecting a subset of Viewables by declaring a type or callable function to filter by.

Returns:

viewables: list(Viewable)

class panel.ui.FloatSlider(*, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ContinuousSlider

The FloatSlider widget allows selecting a floating-point value within a set of bounds using a slider.

References:

Example:

>>> FloatSlider(value=0.5, start=0.0, end=1.0, step=0.1, label="Float value")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: value, bar_color, direction, tooltips, color, start, end, format, marks, size, track, value_label, value_throttled, inline_layout

step = Number(default=0.1, inclusive_bounds=(True, True), label='Step'): The step size.

class panel.ui.GIF(object=None, **params)[source]#

Bases: ImageBase

The GIF pane embeds a .gif image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/GIF.html

Example:

>>> GIF(
...     'https://upload.wikimedia.org/wikipedia/commons/b/b1/Loading_icon.gif',
...     alt_text='A loading spinner',
...     link_url='https://commons.wikimedia.org/wiki/File:Loading_icon.gif',
...     width=500
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

class panel.ui.Gauge(*, annulus_width, bounds, colors, custom_opts, end_angle, format, num_splits, show_labels, show_ticks, start_angle, title_size, tooltip_format, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: ValueIndicator

A Gauge represents a value in some range as a position on speedometer or gauge. It is similar to a Dial but visually a lot busier. Requires the ECharts extension to be loaded.

Reference: https://panel.holoviz.org/reference/indicators/Gauge.html

Example:

>>> pn.extension('echarts')
>>> Gauge(label='Speed', value=79, bounds=(0, 200), colors=[(0.4, 'green'), (1, 'red')])

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: margin, disabled

panel.widgets.indicators.Indicator: sizing_mode

value = Number(allow_None=True, default=25, inclusive_bounds=(True, True), label='Value'): Value to indicate on the gauge a value within the declared bounds.
height = Integer(allow_None=True, bounds=(0, None), default=300, inclusive_bounds=(True, True), label='Height'): The height of the component (in pixels). This can be either fixed or preferred height, depending on height sizing policy.
width = Integer(allow_None=True, bounds=(0, None), default=300, inclusive_bounds=(True, True), label='Width'): The width of the component (in pixels). This can be either fixed or preferred width, depending on width sizing policy.
annulus_width = Integer(default=10, inclusive_bounds=(True, True), label='Annulus width'): Width of the gauge annulus.
bounds = Range(default=(0, 100), inclusive_bounds=(True, True), label='Bounds', length=2): The upper and lower bound of the dial.
colors = List(allow_None=True, bounds=(0, None), item_type=<class 'tuple'>, label='Colors'): Color thresholds for the Gauge, specified as a list of tuples of the fractional threshold and the color to switch to.
custom_opts = Dict(allow_None=True, class_=<class 'dict'>, label='Custom opts'): Additional options to pass to the ECharts Gauge definition.
end_angle = Number(default=-45, inclusive_bounds=(True, True), label='End angle'): Angle at which the gauge ends.
format = String(default='{value}%', label='Format'): Formatting string for the value indicator.
num_splits = Integer(default=10, inclusive_bounds=(True, True), label='Num splits'): Number of splits along the gauge.
show_ticks = Boolean(default=True, label='Show ticks'): Whether to show ticks along the dials.
show_labels = Boolean(default=True, label='Show labels'): Whether to show tick labels along the dials.
start_angle = Number(default=225, inclusive_bounds=(True, True), label='Start angle'): Angle at which the gauge starts.
tooltip_format = String(default='{b} : {c}%', label='Tooltip format'): Formatting string for the hover tooltip.
title_size = Integer(allow_None=True, default=18, inclusive_bounds=(True, True), label='Title size'): Size of title font.

class panel.ui.Grid(*objects, **params)[source]#

Bases: MaterialListLike

The Grid layout is a two-dimensional layout that allows arranging items in a grid.

References:

Example:

>>> Grid(some_widget, some_pane, some_python_object, title='Grid')

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

container = Boolean(default=False, label='Container'): Whether the grid should be a container.
columns = ClassSelector(class_=(<class 'int'>, <class 'dict'>), default=12, label='Columns'): The number of columns to display in the grid.
column_spacing = Number(allow_None=True, inclusive_bounds=(True, True), label='Column spacing'): The spacing between the columns in the grid. Overrides the spacing parameter.
direction = Selector(default='row', label='Direction', names={}, objects=['row', 'column', 'column-reverse', 'row-reverse']): Direction of grid arrangement.
row_spacing = Number(allow_None=True, inclusive_bounds=(True, True), label='Row spacing'): The spacing between the rows in the grid. Overrides the spacing parameter.
size = ClassSelector(allow_None=True, class_=(<class 'int'>, <class 'str'>, <class 'dict'>), label='Size'): The size of the grid. Overrides the columns parameter.
spacing = Number(default=0, inclusive_bounds=(True, True), label='Spacing'): The spacing between the columns and rows in the grid.

class panel.ui.GridBox(*objects: Any, **params: Any)[source]#

Bases: ListPanel

The GridBox is a list-like layout (unlike GridSpec) that wraps objects into a grid according to the specified nrows and ncols parameters.

It has a list-like API with methods to append, extend, clear, insert, pop, remove and __setitem__, which makes it possible to interactively update and modify the layout.

Reference: https://panel.holoviz.org/reference/layouts/GridBox.html

Example:

>>> pn.GridBox(
...    python_object_1, python_object_2, ...,
...    python_object_24, ncols=6
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.base.ListLike: objects

panel.layout.base.ListPanel: scroll

nrows = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Nrows'): Number of rows to reflow the layout into.
ncols = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Ncols'): Number of columns to reflow the layout into.

class panel.ui.GridSpec(*, mode, ncols, nrows, objects, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, name)[source]#

Bases: Panel

The GridSpec is an array like layout that allows arranging multiple Panel objects in a grid using a simple API to assign objects to individual grid cells or to a grid span.

Other layout containers function like lists, but a GridSpec has an API similar to a 2D array, making it possible to use 2D assignment to populate, index, and slice the grid.

See GridStack for a similar layout that allows the user to resize and drag the cells.

Reference: https://panel.holoviz.org/reference/layouts/GridSpec.html

Example:

>>> import panel as pn
>>> gspec = pn.GridSpec(width=800, height=600)
>>> gspec[:,   0  ] = pn.Spacer(styles=dict(background='red'))
>>> gspec[0,   1:3] = pn.Spacer(styles=dict(background='green'))
>>> gspec[1,   2:4] = pn.Spacer(styles=dict(background='orange'))
>>> gspec[2,   1:4] = pn.Spacer(styles=dict(background='blue'))
>>> gspec[0:1, 3:4] = pn.Spacer(styles=dict(background='purple'))
>>> gspec

Attributes:

grid

Methods

clone(**params)

Makes a copy of the GridSpec sharing the same parameters.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

objects = ChildDict(class_=<class 'dict'>, default={}, label='Objects'): The dictionary of child objects that make up the grid.
mode = Selector(default='warn', label='Mode', names={}, objects=['warn', 'error', 'override']): Whether to warn, error or simply override on overlapping assignment.
ncols = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Ncols'): Limits the number of columns that can be assigned.
nrows = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Nrows'): Limits the number of rows that can be assigned.

clone(**params)[source]#

Makes a copy of the GridSpec sharing the same parameters.

Parameters:

params: Keyword arguments override the parameters on the clone.

Returns:

Cloned GridSpec object

class panel.ui.GridStack(*, allow_drag, allow_resize, state, mode, ncols, nrows, objects, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, name)[source]#

Bases: ReactiveHTML, GridSpec

The GridStack layout allows arranging multiple Panel objects in a grid using a simple API to assign objects to individual grid cells or to a grid span.

Other layout containers function like lists, but a GridSpec has an API similar to a 2D array, making it possible to use 2D assignment to populate, index, and slice the grid.

Reference: https://panel.holoviz.org/reference/layouts/GridStack.html

Example:

>>> pn.extension('gridstack')
>>> gstack = GridStack(sizing_mode='stretch_both')
>>> gstack[ : , 0: 3] = pn.Spacer(styles=dict(background='red'))
>>> gstack[0:2, 3: 9] = pn.Spacer(styles=dict(background='green'))
>>> gstack[2:4, 6:12] = pn.Spacer(styles=dict(background='orange'))
>>> gstack[4:6, 3:12] = pn.Spacer(styles=dict(background='blue'))
>>> gstack[0:2, 9:12] = pn.Spacer(styles=dict(background='purple'))

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.grid.GridSpec: objects, mode, ncols, nrows

height = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Height'): The height of the component (in pixels). This can be either fixed or preferred height, depending on height sizing policy.
width = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): The width of the component (in pixels). This can be either fixed or preferred width, depending on width sizing policy.
allow_resize = Boolean(default=True, label='Allow resize'): Allow resizing the grid cells.
allow_drag = Boolean(default=True, label='Allow drag'): Allow dragging the grid cells.
state = List(bounds=(0, None), default=[], item_type=<class 'dict'>, label='State'): Current state of the grid (updated as items are resized and dragged).

class panel.ui.HSpacer(refs=None, **params)[source]#

Bases: Spacer

The HSpacer layout provides responsive horizontal spacing.

Using this component we can space objects equidistantly in a layout and allow the empty space to shrink when the browser is resized.

How-to: https://panel.holoviz.org/how_to/layout/spacing.html#spacer-components

Example:

>>> pn.Row(
...     pn.layout.HSpacer(), 'Item 1',
...     pn.layout.HSpacer(), 'Item 2',
...     pn.layout.HSpacer()
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, visible

panel.viewable.Viewable: loading

sizing_mode = Parameter(constant=True, default='stretch_width', label='Sizing mode', readonly=True): How the component should size itself. This is a high-level setting for maintaining width and height of the component. To gain more fine grained control over sizing, use width_policy, height_policy and aspect_ratio instead (those take precedence over sizing_mode). "fixed" Component is not responsive. It will retain its original width and height regardless of any subsequent browser window resize events. "stretch_width" Component will responsively resize to stretch to the available width, without maintaining any aspect ratio. The height of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_height" Component will responsively resize to stretch to the available height, without maintaining any aspect ratio. The width of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_both" Component is completely responsive, independently in width and height, and will occupy all the available horizontal and vertical space, even if this changes the aspect ratio of the component. "scale_width" Component will responsively resize to stretch to the available width, while maintaining the original or provided aspect ratio. "scale_height" Component will responsively resize to stretch to the available height, while maintaining the original or provided aspect ratio. "scale_both" Component will responsively resize to both the available width and height, while maintaining the original or provided aspect ratio.

class panel.ui.HTML(object=None, **params)[source]#

Bases: HTMLBasePane

HTML panes renders HTML strings and objects with a _repr_html_ method.

The height and width can optionally be specified, to allow room for whatever is being wrapped.

Reference: https://panel.holoviz.org/reference/panes/HTML.html

Example:

>>> HTML(
...     "<h1>This is a HTML pane</h1>",
...     styles={'background-color': '#F6F6F6'}
... )

Attributes:

priority

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

disable_math = Boolean(default=True, label='Disable math'): Whether to disable support for MathJax math rendering for strings escaped with $$ delimiters.
sanitize_html = Boolean(default=False, label='Sanitize html'): Whether to sanitize HTML sent to the frontend.
sanitize_hook = Callable(label='Sanitize hook'): Sanitization callback to apply if sanitize_html=True.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.HoloViews(object=None, **params)[source]#

Bases: Pane

HoloViews panes render any HoloViews object using the currently selected backend (‘bokeh’ (default), ‘matplotlib’ or ‘plotly’).

To be able to use the plotly backend you must add plotly to pn.extension.

Reference: https://panel.holoviz.org/reference/panes/HoloViews.html

Example:

>>> HoloViews(some_holoviews_object)

Methods

`applies`(object)	Returns boolean or float indicating whether the Pane can render the object.
`jslink`(target[, code, args, bidirectional])	Links properties on the this Reactive object to those on the target Reactive object in JS code.

widgets_from_dimensions

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

backend = Selector(label='Backend', names={}, objects=['bokeh', 'matplotlib', 'plotly']): The HoloViews backend used to render the plot (if None defaults to the currently selected renderer).
center = Boolean(default=False, label='Center'): Whether to center the plot.
default_widgets = Dict(class_=<class 'dict'>, constant=True, default={'date': <class 'panel_material_ui.widgets.input.DatetimeInput'>, 'discrete': <class 'panel_material_ui.widgets.select.Select'>, 'discrete_numeric': <class 'panel_material_ui.widgets.slider.DiscreteSlider'>, 'float': (<class 'panel_material_ui.widgets.slider.FloatSlider'>, <class 'panel_material_ui.widgets.slider.EditableFloatSlider'>), 'int': (<class 'panel_material_ui.widgets.slider.IntSlider'>, <class 'panel_material_ui.widgets.slider.EditableIntSlider'>), 'scrubber': <class 'panel_material_ui.widgets.player.Player'>}, label='Default widgets'): Mapping that determines which widgets are used by default when constructing interactive controls for HoloViews dimensions. Keys and expected values: - 'date': For datetime ranges. - 'discrete': For categorical values. - 'discrete_numeric': For discrete, numeric values. - 'float': For continuous floating-point ranges. - 'int': For integer ranges. - 'scrubber': For stepping through frame sequences. Note that float and int widgets may be given a tuple to select between the static case (i.e. a HoloMap) and dynamic case (i.e. a DynamicMap).
format = Selector(default='png', label='Format', names={}, objects=['png', 'svg']): The format to render Matplotlib plots with.
linked_axes = Boolean(default=True, label='Linked axes'): Whether to link the axes of bokeh plots inside this pane across a panel layout.
renderer = Parameter(allow_None=True, label='Renderer'): Explicit renderer instance to use for rendering the HoloViews plot. Overrides the backend.
theme = ClassSelector(allow_None=True, class_=(<class 'bokeh.themes.theme.Theme'>, <class 'str'>), label='Theme'): Bokeh theme to apply to the HoloViews plot.
widget_location = Selector(default='right_top', label='Widget location', names={}, objects=['left', 'bottom', 'right', 'top', 'top_left', 'top_right', 'bottom_left', 'bottom_right', 'left_top', 'left_bottom', 'right_top', 'right_bottom']): The layout of the plot and the widgets. The value refers to the position of the widgets relative to the plot.
widget_layout = Selector(constant=True, default=<class 'panel.layout.base.WidgetBox'>, label='Widget layout', names={}, objects=[<class 'panel.layout.base.WidgetBox'>, <class 'panel.layout.base.Row'>, <class 'panel.layout.base.Column'>]): The layout object to display the widgets in.
widget_type = Selector(default='individual', label='Widget type', names={}, objects=['individual', 'scrubber']): Whether to generate individual widgets for each dimension or on global scrubber.
widgets = Dict(class_=<class 'dict'>, default={}, label='Widgets'): A mapping from dimension name to a widget instance which will be used to override the default widgets.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

jslink(target, code=None, args=None, bidirectional=False, **links)[source]#

Links properties on the this Reactive object to those on the target Reactive object in JS code.

Supports two modes, either specify a mapping between the source and target model properties as keywords or provide a dictionary of JS code snippets which maps from the source parameter to a JS code snippet which is executed when the property changes.

Parameters:

target: panel.viewable.Viewable | bokeh.model.Model | holoviews.core.dimension.Dimensioned: The target to link the value to.
code: dict: Custom code which will be executed when the widget value changes.
args: dict: A mapping of objects to make available to the JS callback
bidirectional: boolean: Whether to link source and target bi-directionally
links: dict: A mapping between properties on the source model and the target model property to link it to.

Returns:

link: GenericLink: The GenericLink which can be used unlink the widget and the target model.

widget_layout[source]#: alias of WidgetBox

class panel.ui.ICO(object=None, **params)[source]#

Bases: ImageBase

The ICO pane embeds an .ico image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/ICO.html

Example:

>>> ICO(
...     some_url,
...     alt_text='An .ico file',
...     link_url='https://en.wikipedia.org/wiki/ICO_(file_format)',
...     width=50
...

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

class panel.ui.IPyLeaflet(object=None, **params)[source]#

Bases: IPyWidget

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.ipywidget.IPyWidget: object

sizing_mode = Selector(default='stretch_width', label='Sizing mode', names={}, objects=['fixed', 'stretch_width', 'stretch_height', 'stretch_both', 'scale_width', 'scale_height', 'scale_both', None]): How the component should size itself. This is a high-level setting for maintaining width and height of the component. To gain more fine grained control over sizing, use width_policy, height_policy and aspect_ratio instead (those take precedence over sizing_mode). "fixed" Component is not responsive. It will retain its original width and height regardless of any subsequent browser window resize events. "stretch_width" Component will responsively resize to stretch to the available width, without maintaining any aspect ratio. The height of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_height" Component will responsively resize to stretch to the available height, without maintaining any aspect ratio. The width of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_both" Component is completely responsive, independently in width and height, and will occupy all the available horizontal and vertical space, even if this changes the aspect ratio of the component. "scale_width" Component will responsively resize to stretch to the available width, while maintaining the original or provided aspect ratio. "scale_height" Component will responsively resize to stretch to the available height, while maintaining the original or provided aspect ratio. "scale_both" Component will responsively resize to both the available width and height, while maintaining the original or provided aspect ratio.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.IPyWidget(object=None, **params)[source]#

Bases: Pane

The IPyWidget pane renders any ipywidgets model both in the notebook and in a deployed server.

When rendering ipywidgets on the server you must add ipywidgets to pn.extension. You must not do this in Jupyterlab as this may render Jupyterlab unusable.

Reference: https://panel.holoviz.org/reference/panes/IPyWidget.html

Example:

>>> IPyWidget(some_ipywidget)

Attributes:

object

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

object = Parameter(allow_None=True, label='Object'): The IPywidget being wrapped, which will be converted to a Bokeh model.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.IconButton(*, edge, href, target, toggle_duration, active_icon, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ClickableIcon, _ButtonBase

The IconButton widget facilitates event triggering upon button clicks.

This widget displays a default icon initially. Upon being clicked, an active_icon appears for a specified toggle_duration.

For instance, the IconButton can be effectively utilized to implement a feature akin to ChatGPT’s copy-to-clipboard button.

The button incorporates a value attribute, which alternates between False and True as the click event is processed.

Furthermore, it includes an clicks attribute, enabling subscription to click events for further actions or monitoring.

References:

Example:

>>> button_icon = IconButton(
...     icon='favorite',
...     active_icon='check',
...     description='Copy',
...     toggle_duration=2000
... )

Methods

`js_on_click`([args, code])	Allows defining a JS callback to be triggered when the button is clicked.
`jscallback`([args])	Allows defining a Javascript (JS) callback to be triggered when a property changes on the source object.
`on_click`(callback)	Register a callback to be executed when the button is clicked.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: width, variant, disable_elevation, end_icon

panel_material_ui.widgets.icon._ClickableIcon: active_icon, icon, icon_size, size

value = Event(default=False, label='Value'): Toggles from False to True while the event is being processed.
clicks = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Clicks'): The number of times the button has been clicked.
edge = Selector(default=False, label='Edge', names={}, objects=['start', 'end', False]): Whether the icon should be on the start or end of the button.
href = String(allow_None=True, label='Href'): The URL to navigate to when the button is clicked.
target = Selector(default='_self', label='Target', names={}, objects=['_blank', '_parent', '_self', '_top']): Where to open the linked document.
toggle_duration = Integer(default=75, inclusive_bounds=(True, True), label='Toggle duration'): The number of milliseconds the active_icon should be shown for and how long the button should be disabled for.

js_on_click(args: dict[str, Any] | None = None, code: str = '') → Callback[source]#

Allows defining a JS callback to be triggered when the button is clicked.

Parameters:

args: dict: A mapping of objects to make available to the JS callback
code: str: The Javascript code to execute when the button is clicked.

Returns:

callback: Callback: The Callback which can be used to disable the callback.

jscallback(args: dict[str, Any] | None = None, **callbacks: str) → Callback[source]#

Allows defining a Javascript (JS) callback to be triggered when a property changes on the source object. The keyword arguments define the properties that trigger a callback and the JS code that gets executed.

Parameters:

args: dict: A mapping of objects to make available to the JS callback
**callbacks: dict: A mapping between properties on the source model and the code to execute when that property changes

Returns:

callback: Callback: The Callback which can be used to disable the callback.

on_click(callback: Callable[[Event], None]) → Watcher[source]#

Register a callback to be executed when the button is clicked.

The callback is given an Event argument declaring the number of clicks.

Returns:

watcher: param.Parameterized.Watcher: A Watcher that executes the callback when the MenuButton is clicked.

class panel.ui.Image(object=None, **params)[source]#

Bases: ImageBase

The Image pane embeds any known image format in a panel if provided a local path, bytes or remote image link.

Example:

>>> Image(
...     'https://panel.holoviz.org/_static/logo_horizontal.png',
...     alt_text='The Panel Logo',
...     link_url='https://panel.holoviz.org/index.html',
...     width=500
... )

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.IntInput(*, step, value_throttled, page_step_multiplier, wheel_wait, mode, end, format, placeholder, size, start, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _SpinnerBase, _IntInputBase

The IntInput allows selecting an integer value using a spinbox.

It behaves like a slider except that lower and upper bounds are optional and a specific value can be entered. The value can be changed using the keyboard (up, down, page up, page down), mouse wheel and arrow buttons.

References:

Example:

>>> IntInput(name='Value', value=100, start=0, end=1000, step=10)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._NumericInputBase: format, placeholder, size

panel_material_ui.widgets.input._IntInputBase: value, start, end, mode

panel_material_ui.widgets.input._SpinnerBase: width, page_step_multiplier, wheel_wait

step = Integer(default=1, inclusive_bounds=(True, True), label='Step'): The step size.
value_throttled = Integer(allow_None=True, constant=True, inclusive_bounds=(True, True), label='Value throttled'): The current value. Updates only on <enter> or when the widget looses focus.

class panel.ui.IntRangeSlider(*, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _RangeSliderBase

The IntRangeSlider widget allows selecting an integer range using a slider with two handles.

References:

Example:

>>> IntRangeSlider(
...     value=(2, 4), start=0, end=10, step=2, label="A tuple of integers"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider._RangeSliderBase: value, value_throttled

start = Integer(default=0, inclusive_bounds=(True, True), label='Start'): The starting value of the slider.
end = Integer(default=1, inclusive_bounds=(True, True), label='End'): The ending value of the slider.
format = ClassSelector(class_=(<class 'str'>, <class 'bokeh.models.formatters.TickFormatter'>), default='0,0', label='Format'): A custom format string or Bokeh TickFormatter.
step = Integer(default=1, inclusive_bounds=(True, True), label='Step'): The step size for the slider.
value_start = Integer(constant=True, default=0, inclusive_bounds=(True, True), label='Value start', readonly=True): The lower value of the selected range.
value_end = Integer(constant=True, default=1, inclusive_bounds=(True, True), label='Value end', readonly=True): The upper value of the selected range.

class panel.ui.IntSlider(*, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ContinuousSlider

The IntSlider widget allows selecting an integer value within a set of bounds using a slider.

References:

Example:

>>> IntSlider(value=5, start=0, end=10, step=1, label="Integer Value")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, marks, size, track, value_label, inline_layout

value = Integer(default=0, inclusive_bounds=(True, True), label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
start = Integer(default=0, inclusive_bounds=(True, True), label='Start'): The starting value of the slider.
end = Integer(default=1, inclusive_bounds=(True, True), label='End'): The ending value of the slider.
format = ClassSelector(class_=(<class 'str'>, <class 'bokeh.models.formatters.TickFormatter'>), default='0,0', label='Format'): A custom format string or Bokeh TickFormatter.
step = Integer(bounds=(1, None), default=1, inclusive_bounds=(True, True), label='Step'): The step size for the slider.
value_throttled = Integer(constant=True, default=0, inclusive_bounds=(True, True), label='Value throttled'): Throttled value for the slider.

class panel.ui.Interactive(object=None, **params)[source]#

Bases: Pane

Attributes:

object
priority

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

object = Parameter(allow_None=True, label='Object'): The object being wrapped, which will be converted to a Bokeh model.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.JPG(object=None, **params)[source]#

Bases: ImageBase

The JPG pane embeds a .jpg or .jpeg image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/JPG.html

Example:

>>> JPG(
...     'https://www.gstatic.com/webp/gallery/4.sm.jpg',
...     alt_text='A nice tree',
...     link_url='https://en.wikipedia.org/wiki/JPEG',
...     width=500
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

class panel.ui.JSON(object=None, **params)[source]#

Bases: HTMLBasePane

The JSON pane allows rendering arbitrary JSON strings, dicts and other json serializable objects in a panel.

Reference: https://panel.holoviz.org/reference/panes/JSON.html

Example:

>>> JSON(json_obj, theme='light', height=300, width=500)

Attributes:

priority

Methods

applies(object, **params)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

depth = Integer(bounds=(-1, None), default=1, inclusive_bounds=(True, True), label='Depth'): Depth to which the JSON tree will be expanded on initialization.
encoder = ClassSelector(allow_None=True, class_=<class 'json.encoder.JSONEncoder'>, label='Encoder'): Custom JSONEncoder class used to serialize objects to JSON string.
hover_preview = Boolean(default=False, label='Hover preview'): Whether to display a hover preview for collapsed nodes.
theme = Selector(default='light', label='Theme', names={}, objects=['light', 'dark']): If no value is provided, it defaults to the current theme set by pn.config.theme, as specified in the JSON.THEME_CONFIGURATION dictionary. If not defined there, it falls back to the default parameter value.

classmethod applies(object: Any, **params) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.JSONEditor(**params: Any)[source]#

Bases: Widget

The JSONEditor provides a visual editor for JSON-serializable datastructures, e.g. Python dictionaries and lists, with functionality for different editing modes, inserting objects and validation using JSON Schema.

Reference: https://panel.holoviz.org/reference/widgets/JSONEditor.html

Example:

>>> JSONEditor(value={
...     'dict'  : {'key': 'value'},
...     'float' : 3.14,
...     'int'   : 1,
...     'list'  : [1, 2, 3],
...     'string': 'A string',
... }, mode='code')

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = Parameter(default={}, label='Value'): JSON data to be edited.
menu = Boolean(default=True, label='Menu'): Adds main menu bar - Contains format, sort, transform, search etc. functionality. true by default. Applicable in all types of mode.
mode = Selector(default='tree', label='Mode', names={}, objects=['tree', 'view', 'form', 'text', 'preview']): Sets the editor mode. In ‘view’ mode, the data and datastructure is read-only. In ‘form’ mode, only the value can be changed, the data structure is read-only. Mode ‘code’ requires the Ace editor to be loaded on the page. Mode ‘text’ shows the data as plain text. The ‘preview’ mode can handle large JSON documents up to 500 MiB. It shows a preview of the data, and allows to transform, sort, filter, format, or compact the data.
search = Boolean(default=True, label='Search'): Enables a search box in the upper right corner of the JSONEditor. true by default. Only applicable when mode is ‘tree’, ‘view’, or ‘form’.
selection = List(bounds=(0, None), default=[], item_type=<class 'str'>, label='Selection'): Current selection.
schema = Dict(allow_None=True, class_=<class 'dict'>, label='Schema'): Validate the JSON object against a JSON schema. A JSON schema describes the structure that a JSON object must have, like required properties or the type that a value must have. See http://json-schema.org/ for more information.
templates = List(bounds=(0, None), default=[], item_type=<class 'dict'>, label='Templates'): Array of templates that will appear in the context menu, Each template is a json object precreated that can be added as a object value to any node in your document.

class panel.ui.LaTeX(object=None, **params)[source]#

Bases: ModelPane

The LaTeX pane allows rendering LaTeX equations. It uses either KaTeX or MathJax depending on the defined renderer.

By default it will use the renderer loaded in the extension (e.g. pn.extension(‘katex’)), defaulting to KaTeX if both are loaded.

Reference: https://panel.holoviz.org/reference/panes/LaTeX.html

Example:

>>> pn.extension('katex')
>>> LaTeX(
...     'The LaTeX pane supports two delimiters: $LaTeX$ and \(LaTeX\)',
...     styles={'font-size': '18pt'}, width=800
... )

Attributes:

priority

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

renderer = Selector(allow_None=True, label='Renderer', names={}, objects=['katex', 'mathjax']): The JS renderer used to render the LaTeX expression. Defaults to katex.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.LinearGauge(*, bounds, colors, default_color, format, horizontal, nan_format, needle_color, show_boundaries, tick_size, title_size, unfilled_color, value_size, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: ValueIndicator

A LinearGauge represents a value in some range as a position on an linear scale. It is similar to a Dial/Gauge but visually more compact.

Reference: https://panel.holoviz.org/reference/indicators/LinearGauge.html

Example:

>>> LinearGauge(value=30, default_color='red', bounds=(0, 100))

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: margin, disabled

panel.widgets.indicators.Indicator: sizing_mode

value = Number(allow_None=True, default=25, inclusive_bounds=(True, True), label='Value'): Value to indicate on the dial a value within the declared bounds.
height = Integer(allow_None=True, bounds=(1, None), default=300, inclusive_bounds=(True, True), label='Height'): The height of the component (in pixels). This can be either fixed or preferred height, depending on height sizing policy.
width = Integer(allow_None=True, bounds=(1, None), default=125, inclusive_bounds=(True, True), label='Width'): The width of the component (in pixels). This can be either fixed or preferred width, depending on width sizing policy.
bounds = Range(default=(0, 100), inclusive_bounds=(True, True), label='Bounds', length=2): The upper and lower bound of the gauge.
default_color = String(default='lightblue', label='Default color'): Color of the radial annulus if not color thresholds are supplied.
colors = Parameter(allow_None=True, label='Colors'): Color thresholds for the gauge, specified as a list of tuples of the fractional threshold and the color to switch to.
format = String(default='{value:.2f}%', label='Format'): Formatting string for the value indicator and lower/upper bounds.
horizontal = Boolean(default=False, label='Horizontal'): Whether to display the linear gauge horizontally.
nan_format = String(default='-', label='Nan format'): How to format nan values.
needle_color = String(default='black', label='Needle color'): Color of the gauge needle.
show_boundaries = Boolean(default=False, label='Show boundaries'): Whether to show the boundaries between colored regions.
unfilled_color = String(default='whitesmoke', label='Unfilled color'): Color of the unfilled region of the LinearGauge.
title_size = String(allow_None=True, label='Title size'): Font size of the gauge title.
tick_size = String(allow_None=True, label='Tick size'): Font size of the gauge tick labels.
value_size = String(allow_None=True, label='Value size'): Font size of the gauge value label.

class panel.ui.LinearProgress(*, active, color, max, value_buffer, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The LinearProgress widget displays the progress towards some target based on the current value and the max value.

References:

Example:

>>> LinearProgress(value=20, color="primary")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

value = Number(bounds=(-1, None), default=-1, inclusive_bounds=(True, True), label='Value'): The value of the progress bar.
active = Boolean(default=True, label='Active'): Whether to animate the bar when in indeterminate mode.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the progress bar.
max = Number(bounds=(0, None), default=100, inclusive_bounds=(False, True), label='Max'): Maximum progress value.
value_buffer = Number(bounds=(-1, None), default=-1, inclusive_bounds=(True, True), label='Value buffer'): The buffer of the progress bar (if variant=”buffer”).
variant = Selector(default='determinate', label='Variant', names={}, objects=['determinate', 'indeterminate', 'buffer', 'query']): The variant of the progress bar.

class panel.ui.ListInput(*, enter_pressed, max_length, size, color, error_state, helper_text, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, description, placeholder, serializer, type, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: LiteralInput

The ListInput allows entering a list value using a text input box.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.LiteralInput: serializer

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: max_length, placeholder, size

panel_material_ui.widgets.input.TextInput: enter_pressed

panel_material_ui.widgets.input.LiteralInput: value_input

value = Parameter(default=[], label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
type = ClassSelector(class_=<class 'type'>, constant=True, default=<class 'list'>, label='Type', readonly=True): The type of the value.

type#: alias of list

class panel.ui.LiteralInput(*, enter_pressed, max_length, size, color, error_state, helper_text, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, description, placeholder, serializer, type, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: TextInput, LiteralInput

The LiteralInput allows entering any string using a text input box.

References:

https://panel.holoviz.org/reference/widgets/LiteralInput.html

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.LiteralInput: serializer, type

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: max_length, placeholder, size

panel_material_ui.widgets.input.TextInput: enter_pressed

value = Parameter(allow_None=True, default='', label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
value_input = Parameter(allow_None=True, constant=True, default='', label='Value input', readonly=True): Initial or entered text value updated on every key press.

panel.ui.LoadingSpinner[source]#: alias of CircularProgress

class panel.ui.Markdown(object=None, **params)[source]#

Bases: HTMLBasePane

The Markdown pane allows rendering arbitrary markdown strings in a panel.

It renders strings containing valid Markdown as well as objects with a _repr_markdown_ method, and may define custom CSS styles.

Reference: https://panel.holoviz.org/reference/panes/Markdown.html

Example:

>>> Markdown("# This is a header")

Attributes:

priority

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

dedent = Boolean(default=True, label='Dedent'): Whether to dedent common whitespace across all lines.
disable_anchors = Boolean(default=False, label='Disable anchors'): Whether to disable automatically adding anchors to headings.
disable_math = Boolean(default=False, label='Disable math'): Whether to disable support for MathJax math rendering for strings escaped with $$ delimiters.
extensions = List(bounds=(0, None), default=['extra', 'smarty', 'codehilite'], label='Extensions', nested_refs=True): Markdown extension to apply when transforming markup. Does not apply if renderer is set to ‘markdown-it’ or ‘myst’.
hard_line_break = Boolean(default=False, label='Hard line break'): Whether simple new lines are rendered as hard line breaks. False by default to conform with the original Markdown spec. Not supported by the ‘myst’ renderer.
plugins = List(bounds=(0, None), default=[], label='Plugins', nested_refs=True): Additional markdown-it-py plugins to use.
renderer = Selector(default='markdown-it', label='Renderer', names={}, objects=['markdown-it', 'myst', 'markdown']): Markdown renderer implementation.
renderer_options = Dict(class_=<class 'dict'>, default={}, label='Renderer options', nested_refs=True): Options to pass to the markdown renderer.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.MaterialDesign(theme=None, **params)[source]#

Bases: Material

Parameter Definitions

Parameters inherited from:

panel.theme.base.Design: theme

class panel.ui.MaterialUIDesign(theme=None, **params)[source]#

Bases: MaterialDesign

Panel’s Material UI design defaults.

Parameter Definitions

Parameters inherited from:

panel.theme.base.Design: theme

class panel.ui.Matplotlib(object=None, **params)[source]#

Bases: Image, IPyWidget

The Matplotlib pane allows displaying any displayable Matplotlib figure inside a Panel app.

It will render the plot to PNG at the declared DPI and then embed it.
If you find the figure to be clipped on the edges, you can set tight=True

to automatically resize objects to fit within the pane. - If you have installed ipympl you will also be able to use the interactive backend.

Reference: https://panel.holoviz.org/reference/panes/Matplotlib.html

Example:

>>> Matplotlib(some_matplotlib_figure, dpi=144)

Attributes:

filetype
object

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

object = Parameter(allow_None=True, allow_refs=True, label='Object'): The Matplotlib Figure being wrapped, which will be rendered as a Bokeh model.
dpi = Integer(bounds=(1, None), default=144, inclusive_bounds=(True, True), label='Dpi'): Scales the dpi of the matplotlib figure.
encode = Boolean(default=False, label='Encode'): Whether to encode SVG out as base64.
format = Selector(default='png', label='Format', names={}, objects=['png', 'svg']): The format to render the plot as if the plot is not interactive.
high_dpi = Boolean(default=True, label='High dpi'): Whether to optimize output for high-dpi displays.
interactive = Boolean(constant=True, default=False, label='Interactive'): Whether to render interactive matplotlib plot with ipympl.
tight = Boolean(default=False, label='Tight'): Automatically adjust the figure size to fit the subplots and other artist elements.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.MenuBar(*, color, size, variant, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: NestedMenuBase

The MenuBar component provides a horizontal application menu bar, similar to those found in desktop applications (File, Edit, View, Help, etc.). It supports nested submenus, keyboard shortcut hints, icons, checkboxes, radio groups, item groups, and dividers.

The top-level items list defines the menu triggers (buttons) in the bar. Each top-level item should have:

label (str, required): The button text.
icon (str, optional): Icon displayed before the label.
disabled (bool, optional): Whether the menu is disabled.
items (list[dict], required): The dropdown items for this menu.

Each dropdown item can be:

A regular item: {‘label’: ‘Save’, ‘icon’: ‘save’, ‘hint’: ‘Ctrl+S’}
A divider: None or {‘label’: ‘—‘}
A submenu: {‘label’: ‘Share’, ‘icon’: ‘share’, ‘items’: […]}
A group header: {‘label’: ‘Alignment’, ‘group’: True, ‘items’: […]}
A checkbox item: {‘label’: ‘Show Toolbar’, ‘checkbox’: True}
A radio item: {‘label’: ‘Light’, ‘radio’: ‘light’}

Radio items within a group share state: selecting one deselects the others.

References:

Example:

>>> pmui.MenuBar(items=[
...     {'label': 'File', 'items': [
...         {'label': 'New', 'icon': 'note_add', 'hint': 'Ctrl+N'},
...         {'label': 'Open', 'icon': 'folder_open', 'hint': 'Ctrl+O'},
...         {'label': 'Save', 'icon': 'save', 'hint': 'Ctrl+S'},
...         None,
...         {'label': 'Exit', 'icon': 'close'},
...     ]},
...     {'label': 'Edit', 'items': [
...         {'label': 'Undo', 'icon': 'undo', 'hint': 'Ctrl+Z'},
...         {'label': 'Redo', 'icon': 'redo', 'hint': 'Ctrl+Y'},
...     ]},
... ])

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, items

panel_material_ui.widgets.menus.NestedMenuBase: active

width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): The width of the menu bar.
color = Selector(default='default', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the menu bar buttons.
size = Selector(default='small', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the menu bar buttons.
variant = Selector(default='elevation', label='Variant', names={}, objects=['elevation', 'outlined']): The visual variant of the menu bar container.

width = None#

class panel.ui.MenuButton(*, active, items, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MenuBase, _ButtonBase

The MenuButton component is a button component that allows selecting from a list of items.

MenuButton items can be strings or objects with properties:

label: The label of the menu button item (required)
icon: The icon of the menu button item (optional)
color: The color of the menu button item (optional)
href: The URL to navigate to when the menu button item is clicked (optional)
target: The target to open the URL in (optional)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.MenuButton(items=[
...     {'label': 'Open', 'icon': 'description'},
...     {'label': 'Save', 'icon': 'save'},
...     {'label': 'Exit', 'icon': 'close'},
... ], label='File', icon='storage')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: variant, clicks, end_icon, icon, icon_size

panel_material_ui.widgets.menus.MenuBase: value, width, active, items

margin = Margin(allow_None=True, allow_refs=True, default=(5, 10), label='Margin'): Margin around the widget.
disable_elevation = Boolean(default=False, label='Disable elevation'): Removes the menu’s box-shadow for a flat appearance.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the menu button.

class panel.ui.MenuList(*, collapsed, color, dense, highlight, removable, expanded, level_indent, show_children, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: TreeLikeBase

The MenuList component is used to display a structured group of items, such as menus, navigation links, or settings.

List items can be strings or objects with properties:

label: The label of the list item (required)
secondary: The secondary text of the list item (optional)
icon: The icon of the list item (optional)
avatar: The avatar of the list item (optional)
color: The color of the list item (optional)
actions: Actions to display on the list item (optional)
items: Nested items (optional)
selectable: Whether the list item is selectable (optional)
href: The URL to navigate to when the list item is clicked (optional)
target: The target to open the URL in (optional)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.MenuList(items=[
...     {'label': 'Home', 'icon': 'home', 'secondary': 'Overview page'},
...     {'label': 'Gallery', 'icon': 'image', 'secondary': 'Visual overview'},
...     {'label': 'API', 'icon': 'code', 'secondary': 'API Reference'},
...     {'label': 'About', 'icon': 'info'},
... ], active=3)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, width, items

panel_material_ui.widgets.menus.NestedMenuBase: active

panel_material_ui.widgets.menus.TreeLikeBase: expanded, level_indent, show_children

color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the selected list item.
collapsed = Boolean(default=False, label='Collapsed'): Whether to collapse the tree to show only the icons and no child items.
dense = Boolean(default=True, label='Dense'): Whether to show the list items in a dense format.
highlight = Boolean(default=True, label='Highlight'): Whether to highlight the currently selected menu item.
removable = Boolean(default=False, label='Removable'): Whether to allow deleting items.

class panel.ui.MenuToggle(*, persistent, toggle_icon, toggled, active, items, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MenuBase, _ButtonBase

The MenuToggle component is a menu button where individual items can be toggled on/off.

Unlike MenuButton, MenuToggle allows each menu item to have a toggle state with different icons for active/inactive states (e.g., filled/unfilled heart for favorites).

MenuToggle items can be strings or objects with properties:

label: The label of the menu toggle item (required)
icon: The icon when item is not toggled (optional)
active_icon: The icon when item is toggled (optional)
toggled: Whether the item is currently toggled (optional, default: false)
color: The color of the menu toggle item (optional)
active_color: The color when toggled (optional)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.MenuToggle(items=[
...     {'label': 'Favorite', 'icon': 'favorite_border', 'active_icon': 'favorite', 'toggled': False},
...     {'label': 'Bookmark', 'icon': 'bookmark_border', 'active_icon': 'bookmark', 'toggled': True},
...     {'label': 'Star', 'icon': 'star_border', 'active_icon': 'star', 'toggled': False},
... ], label='Actions', icon='more_vert')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: variant, clicks, disable_elevation, end_icon, icon, icon_size

panel_material_ui.widgets.menus.MenuBase: value, width, active, items

margin = Margin(allow_None=True, allow_refs=True, default=5, label='Margin'): Margin around the widget.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the menu toggle.
toggle_icon = String(allow_None=True, label='Toggle icon'): Icon to display when menu is open (if different from base icon).
toggled = List(bounds=(0, None), default=[], label='Toggled'): List of indices of currently toggled items.
persistent = Boolean(default=True, label='Persistent'): Whether the menu stays open after toggling an item.

class panel.ui.Modal(*objects: Any, **params: Any)[source]#

Bases: ListPanel

Create a modal dialog that can be opened and closed.

Methods

`create_button`(action, **kwargs)	Create a button to show, hide or toggle the modal.
`show`()	Starts a Bokeh server and displays the Viewable in a new tab.

hide
toggle

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.layout.base.ListLike: objects

panel.layout.base.ListPanel: scroll

open = Boolean(default=False, label='Open'): Whether to open the modal.
show_close_button = Boolean(default=True, label='Show close button'): Whether to show a close button in the modal.
background_close = Boolean(default=True, label='Background close'): Whether to enable closing the modal when clicking the background.

create_button(action: Literal['show', 'hide', 'toggle'], **kwargs)[source]#: Create a button to show, hide or toggle the modal.

show()[source]#

Starts a Bokeh server and displays the Viewable in a new tab.

Parameters:

titlestr | None: A string title to give the Document (if served as an app)
port: int (optional, default=0): Allows specifying a specific port
addressstr: The address the server should listen on for HTTP requests.
websocket_origin: str or list(str) (optional): A list of hosts that can connect to the websocket. This is typically required when embedding a server app in an external web site. If None, “localhost” is used.
threaded: boolean (optional, default=False): Whether to launch the Server on a separate thread, allowing interactive use.
verbose: boolean (optional, default=True): Whether to print the address and port
openboolean (optional, default=True): Whether to open the server in a new browser tab
locationboolean or panel.io.location.Location: Whether to create a Location component to observe and set the URL location.

Returns:

server: bokeh.server.Server or panel.io.server.StoppableThread: Returns the Bokeh server instance or the thread the server was launched on (if threaded=True)

class panel.ui.MuiDarkTheme(*, base_css, bokeh_theme, css, name)[source]#

Bases: MaterialDarkTheme

Parameter Definitions

Parameters inherited from:

panel.theme.base.DarkTheme: base_css

panel.theme.material.MaterialThemeMixin: css

bokeh_theme = ClassSelector(class_=(<class 'bokeh.themes.theme.Theme'>, <class 'str'>), default=<bokeh.themes.theme.Theme object at 0x112474110>, label='Bokeh theme'): A Bokeh Theme class that declares properties to apply to Bokeh models. This is necessary to ensure that plots and other canvas based components are styled appropriately.

class panel.ui.MuiDefaultTheme(*, base_css, bokeh_theme, css, name)[source]#

Bases: MaterialDefaultTheme

Parameter Definitions

Parameters inherited from:

panel.theme.base.DefaultTheme: base_css

panel.theme.material.MaterialThemeMixin: css

bokeh_theme = ClassSelector(class_=(<class 'bokeh.themes.theme.Theme'>, <class 'str'>), default=<bokeh.themes.theme.Theme object at 0x1127d9190>, label='Bokeh theme'): A Bokeh Theme class that declares properties to apply to Bokeh models. This is necessary to ensure that plots and other canvas based components are styled appropriately.

class panel.ui.MultiChoice(*, chip, delete_button, option_limit, placeholder, search_option_limit, solid, bookmarks, disabled_options, dropdown_height, dropdown_open, filter_on_search, filter_str, searchable, value_label, color, error_state, helper_text, max_items, size, variant, visual_size, attached, dark_theme, sx, theme_config, use_shadow_dom, description, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _SelectDropdownBase, MultiSelect

The MultiChoice widget allows selecting multiple values from a list of options.

It falls into the broad category of multi-value, option-selection widgets that provide a compatible API and include the MultiSelect, CrossSelector, CheckBoxGroup and CheckButtonGroup widgets.

The MultiChoice widget provides a much more compact UI than MultiSelect.

References:

Example:

>>> MultiChoice(
...     label='Favourites', value=['Panel', 'hvPlot'],
...     options=['Panel', 'hvPlot', 'HoloViews', 'GeoViews', 'Datashader', 'Param', 'Colorcet'],
...     max_items=2
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.select.MultiSelect: value, color, error_state, helper_text, max_items, size, visual_size, variant

panel_material_ui.widgets.select._SelectDropdownBase: bookmarks, disabled_options, filter_str, filter_on_search, dropdown_height, dropdown_open, searchable, value_label

chip = Boolean(default=True, label='Chip'): Whether to display a chip for each selected option
delete_button = Boolean(default=True, label='Delete button'): Whether to display a button to delete a selected option.
option_limit = Integer(allow_None=True, bounds=(1, None), inclusive_bounds=(True, True), label='Option limit'): Maximum number of options to display at once.
search_option_limit = Integer(allow_None=True, bounds=(1, None), inclusive_bounds=(True, True), label='Search option limit'): Maximum number of options to display at once if search string is entered.
placeholder = String(default='', label='Placeholder'): String displayed when no selection has been made.
solid = Boolean(default=True, label='Solid'): Whether to display chips with solid or outlined style.

class panel.ui.MultiPill(*, color, disabled_options, max_items, size, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, description, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialMultiSelectBase

The MultiPill widget allows selecting multiple values from a list of options rendered as clickable pills.

It falls into the broad category of multi-value, option-selection widgets that provide a compatible API and include the MultiSelect, MultiChoice, CheckBoxGroup and CheckButtonGroup widgets.

References:

Example:

>>> MultiPill(label="Favourites", value=["Panel", "hvPlot"],
...     options=["Panel", "hvPlot", "HoloViews", "GeoViews"])

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.select.MaterialMultiSelectBase: value

color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of selected pills.
disabled_options = List(bounds=(0, None), default=[], label='Disabled options', nested_refs=True): Optional list of options that are disabled, i.e. unusable and un-clickable. If options is a dictionary the list items have to correspond to the values in the options dictionary.
max_items = Integer(allow_None=True, bounds=(1, None), inclusive_bounds=(True, True), label='Max items'): Maximum number of options that can be selected.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): Size of the pills.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined']): Variant style of the pills.

class panel.ui.MultiSelect(*, color, error_state, helper_text, max_items, size, variant, visual_size, attached, dark_theme, sx, theme_config, use_shadow_dom, description, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialMultiSelectBase

The MultiSelect widget allows selecting multiple values from a list of options.

It falls into the broad category of multi-value, option-selection widgets that provide a compatible API and include the MultiSelect, CrossSelector, CheckBoxGroup and CheckButtonGroup widgets.

References:

>>> pmui.MultiSelect(label='MultiSelect', value=['Apple', 'Pear'],
...     options=['Apple', 'Banana', 'Pear', 'Strawberry'], size=8)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

value = List(allow_None=True, bounds=(0, None), default=[], label='Value'): The selected values.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): Color of the multi-select component.
error_state = Boolean(default=False, label='Error state'): Whether to display in error state.
helper_text = String(default='', label='Helper text'): Helper text displayed below the select field.
max_items = Integer(allow_None=True, bounds=(1, None), inclusive_bounds=(True, True), label='Max items'): Maximum number of options that can be selected.
size = Integer(allow_None=True, inclusive_bounds=(True, True), label='Size'): The number of options to display at once. Controls the visible height of the list area.
visual_size = Selector(default='medium', label='Visual size', names={}, objects=['small', 'medium', 'large']): The visual size of the multi-select control.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined', 'standard']): Variant style of the multi-select component.

class panel.ui.NestedBreadcrumbs(*, auto_descend, path, color, max_items, separator, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: NestedMenuBase, BreadcrumbsBase

The NestedBreadcrumbs component provides breadcrumb-style navigation for hierarchical data. It extends standard breadcrumbs by allowing each non-root segment to open a sibling selector menu via a chevron, enabling users to navigate between branches at any level.

Nested breadcrumbs help users visualize their position in a nested structure and move both upward (via breadcrumb clicks) and sideways (via sibling menus).

Breadcrumb items are defined as objects with the following properties:

label: The label of the breadcrumb item (required)
icon: The icon of the breadcrumb item (optional)
avatar: The avatar of the breadcrumb item (optional)
href: Link to navigate to when clicking the breadcrumb item (optional)
target: Link target (e.g. “_blank”) (optional)
items: List of nested child items (optional)
selectable: Whether the item can be selected in sibling menus (optional, defaults to True)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.NestedBreadcrumbs(items=[
...     {
...         'label': 'Projects', 'icon': 'folder', 'items': [
...             {'label': 'A', 'icon': 'category', 'items': [
...                 {'label': 'A1', 'icon': 'grain'},
...                 {'label': 'A2', 'icon': 'grain'},
...             ]},
...             {'label': 'B', 'icon': 'category', 'items': [
...                 {'label': 'B1', 'icon': 'grain'},
...             ]},
...         ]
...     }
... ], active=(0,))

Attributes:

active

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, width, items

panel_material_ui.widgets.menus.BreadcrumbsBase: color, max_items, separator

active = ClassSelector(allow_None=True, class_=(<class 'int'>, <class 'tuple'>), label='Active'): The index of the currently selected item. Can be a tuple of indices for nested items.
auto_descend = Boolean(default=True, label='Auto descend'): Whether to automatically descend through the first child of each selected item when rendering the breadcrumb path. When True (default), the component will automatically extend the visible path by following first-child items below the current selection. When False, the last breadcrumb segment will instead display a “Select…” placeholder with a chevron menu, allowing the user to pick a child manually.
path = ClassSelector(allow_None=True, class_=<class 'tuple'>, label='Path'): The tuple containing indices of the currently rendered path.

class panel.ui.NestedSelect(*, _levels, _max_depth, _widgets, layout, levels, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: NestedSelect

The NestedSelect widget is composed of multiple widgets, where subsequent select options depend on the parent’s value.

References:

Example:

>>> NestedSelect(
...     options={
...         "gfs": {"tmp": [1000, 500], "pcp": [1000]},
...         "name": {"tmp": [1000, 925, 850, 700, 500], "pcp": [1000]},
...     },
...     levels=["model", "var", "level"],
... )

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width

panel.widgets.select.NestedSelect: value, disabled, layout, levels, options, _widgets, _max_depth, _levels

class panel.ui.NotificationArea(*, types, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, js_events, max_notifications, notifications, position, name)[source]#

Bases: MaterialComponent, NotificationAreaBase

Methods

`demo`(**params)	Generates a layout which allows demoing the component.
`send`(message[, duration, type, background, icon])	Sends a notification to the frontend.

clear

Parameter Definitions

Parameters inherited from:

panel.io.notifications.NotificationAreaBase: js_events, max_notifications, position

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

notifications = List(bounds=(0, None), default=[], item_type=(<class 'panel_material_ui.notifications.MuiNotification'>, <class 'dict'>), label='Notifications'): List of notifications currently displayed in the notification area. Each item is a MuiNotification or a dictionary representing a notification.
types = List(bounds=(0, None), default=[], label='Types'): Custom notification types. Each type is a dictionary with the following keys: - ‘type’: The type of the notification. - ‘background’: The background color of the notification. - ‘icon’: The icon of the notification.

classmethod demo(**params)[source]#: Generates a layout which allows demoing the component.

send(message, duration=3000, type='default', background=None, icon=None)[source]#: Sends a notification to the frontend.

class panel.ui.Number(*, colors, default_color, font_size, format, nan_format, title_size, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: ValueIndicator

The Number indicator renders the value as text optionally colored according to the colors thresholds.

Reference: https://panel.holoviz.org/reference/indicators/Number.html

Example:

>>> Number(label='Rate', value=72, format='{value}%', colors=[(80, 'green'), (100, 'red')]

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.widgets.indicators.Indicator: sizing_mode

panel.widgets.indicators.ValueIndicator: value

default_color = String(default='currentcolor', label='Default color'): The color of the Number indicator if no colors are provided
colors = List(allow_None=True, bounds=(0, None), item_type=<class 'tuple'>, label='Colors'): Color thresholds for the Number indicator, specified as a tuple of the absolute thresholds and the color to switch to.
format = String(default='{value}', label='Format'): A formatter string which accepts a {value}.
font_size = String(default='54pt', label='Font size'): The size of number itself.
nan_format = String(default='-', label='Nan format'): How to format nan values.
title_size = String(default='18pt', label='Title size'): The size of the title given by the label.

class panel.ui.NumberInput(*, page_step_multiplier, wheel_wait, end, format, placeholder, size, start, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _SpinnerBase

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._NumericInputBase: value, format, placeholder, size, start, end

panel_material_ui.widgets.input._SpinnerBase: width, page_step_multiplier, wheel_wait

class panel.ui.PDF(object=None, **params)[source]#

Bases: FileBase

The PDF pane embeds a .pdf image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/PDF.html

Example:

>>> PDF(
...     'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf',
...     width=300, height=410
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

start_page = Integer(default=1, inclusive_bounds=(True, True), label='Start page'): Start page of the pdf, by default the first page.

class panel.ui.PNG(object=None, **params)[source]#

Bases: ImageBase

The PNG pane embeds a .png image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/PNG.html

Example:

>>> PNG(
...     'https://panel.holoviz.org/_static/logo_horizontal.png',
...     alt_text='The Panel Logo',
...     link_url='https://panel.holoviz.org/index.html',
...     width=500
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

class panel.ui.Page(*, _custom_theme, app_bar_width, busy_indicator, config, contextbar, contextbar_open, contextbar_resizable, contextbar_variant, contextbar_width, favicon, header, logo, main, main_width, meta, sidebar, sidebar_open, sidebar_resizable, sidebar_variant, sidebar_width, site_url, template, theme_toggle, title, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, name)[source]#

Bases: MaterialComponent, ResourceComponent

The Page component is the equivalent of a Template in Panel.

Unlike a Template the Page component is implemented entirely in Javascript, making it possible to dynamically update components.

References:

https://panel-material-ui.holoviz.org/reference/page/Page.html

Example:

>>> Page(main=['# Content'], title='My App')

Methods

`get_root`([doc, comm, preprocess])	Returns the root model and applies pre-processing hooks
`resolve_resources`([cdn, extras])	Resolves the resources required for this component.
`save`(filename[, title, resources, template, ...])	Saves Panel objects to file.
`server_doc`([doc, title, location])	Returns a serveable bokeh Document with the panel attached

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

app_bar_width = ClassSelector(allow_None=True, class_=(<class 'int'>, <class 'str'>, <class 'dict'>), label='App bar width'): Maximum width of the app bar (header) content. When set, the toolbar content is clamped to this width and centered, aligning it with a clamped main area. Accepts a number (interpreted as pixels), a CSS length string (e.g. ‘70ch’, ‘60rem’, ‘90%’), or a dict mapping Material UI breakpoints to widths (e.g. {‘xs’: ‘100%’, ‘md’: 720, ‘lg’: 960}), where each value applies at that breakpoint and up. Defaults to None (full width); when unset it follows main_width so the header stays aligned with the main content.
busy = Boolean(constant=True, default=False, label='Busy', readonly=True): Whether the page is busy.
busy_indicator = Selector(default='linear', label='Busy indicator', names={}, objects=['circular', 'linear', None]): The type of busy indicator to show.
config = ClassSelector(class_=<class 'panel.config._base_config'>, constant=True, default=_base_config(css_files=[], js_files={}, js_modules={}, name='_base_config00117', raw_css=[]), label='Config'): Configuration object declaring custom CSS and JS files to load specifically for this template.
contextbar = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Contextbar'): Items rendered in the contextbar.
contextbar_open = Boolean(default=False, label='Contextbar open'): Whether the contextbar is open or closed.
contextbar_resizable = Boolean(default=False, label='Contextbar resizable'): Whether the contextbar can be resized by dragging.
contextbar_variant = Selector(default='temporary', label='Contextbar variant', names={}, objects=['persistent', 'temporary', 'permanent', 'auto']): Whether the contextbar is persistent, a temporary drawer, a permanent drawer, or automatically switches between the two based on screen size.
contextbar_width = Integer(default=250, inclusive_bounds=(True, True), label='Contextbar width'): Width of the contextbar
favicon = ClassSelector(allow_None=True, class_=(<class 'str'>, <class 'pathlib.Path'>), label='Favicon'): The favicon of the page.
header = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Header'): Items rendered in the header.
main = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Main'): Items rendered in the main area.
main_width = ClassSelector(allow_None=True, class_=(<class 'int'>, <class 'str'>, <class 'dict'>), label='Main width'): Maximum width of the main content area. When set, the main content is clamped to this width and centered to improve readability. Accepts a number (interpreted as pixels), a CSS length string (e.g. ‘70ch’, ‘60rem’, ‘90%’), or a dict mapping Material UI breakpoints to widths (e.g. {‘xs’: ‘100%’, ‘md’: 720, ‘lg’: 960}), where each value applies at that breakpoint and up. Defaults to None (full width).
meta = ClassSelector(allow_None=True, class_=<class 'panel_material_ui.template.base.Meta'>, label='Meta'): Meta tags and other HTML head elements.
logo = ClassSelector(allow_None=True, class_=(<class 'str'>, <class 'pathlib.Path'>, <class 'dict'>), label='Logo'): Logo to render in the header. Can be a string, a pathlib.Path, or a dictionary with breakpoints as keys, e.g. {‘sm’: ‘logo_mobile.png’, ‘md’: ‘logo.png’} or themes as keys, e.g. {‘dark’: ‘logo_dark.png’, ‘light’: ‘logo.png’}.
sidebar = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Sidebar'): Items rendered in the sidebar.
sidebar_open = Boolean(default=True, label='Sidebar open'): Whether the sidebar is open or closed.
sidebar_resizable = Boolean(default=True, label='Sidebar resizable'): Whether the sidebar can be resized by dragging.
sidebar_variant = Selector(default='auto', label='Sidebar variant', names={}, objects=['persistent', 'temporary', 'permanent', 'auto']): Whether the sidebar is persistent, a temporary drawer, a permanent drawer, or automatically switches between the two based on screen size.
sidebar_width = Integer(default=320, inclusive_bounds=(True, True), label='Sidebar width'): Width of the sidebar
site_url = String(default='/', label='Site url'): URL of the site and logo. Default is ‘/’.
template = ClassSelector(allow_None=True, class_=(<class 'str'>, <class 'pathlib.Path'>, <class 'jinja2.environment.Template'>), label='Template'): Overrides the default jinja2 template. Template can be provided as a string, Path or jinja2.Template instance.
theme_toggle = Boolean(default=True, label='Theme toggle'): Whether to show a theme toggle button.
title = String(default='', label='Title'): Title of the application.

_custom_theme = List(bounds=(0, None), default=[], label=' custom theme')

get_root(doc: Document | None = None, comm: Comm | None = None, preprocess: bool = True) → Model[source]#

Returns the root model and applies pre-processing hooks

Parameters:

doc: bokeh.Document: Bokeh document the bokeh model will be attached to.
comm: pyviz_comms.Comm: Optional pyviz_comms when working in notebook
preprocess: boolean (default=True): Whether to run preprocessing hooks

Returns:

Returns the bokeh model corresponding to this panel object

resolve_resources(cdn: bool | t.Literal['auto'] = 'auto', extras: dict[str, dict[str, str]] | None = None) → ResourcesType[source]#

Resolves the resources required for this component.

Parameters:

cdn: bool | Literal[‘auto’]: Whether to load resources from CDN or local server. If set to ‘auto’ value will be automatically determine based on global settings.
extras: dict[str, dict[str, str]] | None: Additional resources to add to the bundle. Valid resource types include js, js_modules and css.

Returns:

Dictionary containing JS and CSS resources.

Saves Panel objects to file.

Parameters:

filename: str or file-like object: Filename to save the plot to
title: string: Optional title for the plot
resources: bokeh resources: One of the valid bokeh.resources (e.g. CDN or INLINE)
template:: passed to underlying io.save
template_variables:: passed to underlying io.save
embed: bool: Whether the state space should be embedded in the saved file.
max_states: int: The maximum number of states to embed
max_opts: int: The maximum number of states for a single widget
embed_json: boolean (default=True): Whether to export the data to json files
json_prefix: str (default=’’): Prefix for the auto-generated json directory
save_path: str (default=’./’): The path to save json files to
load_path: str (default=None): The path or URL the json files will be loaded from.
progress: boolean (default=True): Whether to report progress
embed_states: dict (default={}): A dictionary specifying the widget values to embed for each widget
as_png: boolean (default=None): To save as a .png. If None save_png will be true if filename is string and ends with png.

server_doc(doc: Document | None = None, title: str | None = None, location: bool | LocationAreaBase | None = True) → Document[source]#

Returns a serveable bokeh Document with the panel attached

Parameters:

docbokeh.Document (optional): The bokeh Document to attach the panel to as a root, defaults to bokeh.io.curdoc()
titlestr: A string title to give the Document
locationboolean or panel.io.location.Location: Whether to create a Location component to observe and set the URL location.

Returns:

docbokeh.Document: The bokeh document the panel was attached to

class panel.ui.Pagination(*, boundary_count, color, count, shape, show_first_button, show_last_button, sibling_count, size, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The Pagination component allows selecting from a list of pages.

References:

Example:

>>> pmui.Pagination(count=100)

Methods

paginate(objects, layout, page_size, **params)

Paginate the items based on the current page and page size.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

value = Integer(allow_None=True, inclusive_bounds=(True, True), label='Value'): The current zero-indexed page number.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): The width of the pagination.
boundary_count = Integer(bounds=(0, None), default=1, inclusive_bounds=(True, True), label='Boundary count'): The number of boundary pages to show.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the pagination.
count = Integer(bounds=(0, None), default=1, inclusive_bounds=(True, True), label='Count'): The total number of pages.
shape = Selector(default='circular', label='Shape', names={}, objects=['circular', 'rounded']): The shape of the pagination.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the pagination.
sibling_count = Integer(bounds=(0, None), default=1, inclusive_bounds=(True, True), label='Sibling count'): The number of sibling pages to show.
show_first_button = Boolean(default=False, label='Show first button'): Whether to show the first button.
show_last_button = Boolean(default=False, label='Show last button'): Whether to show the last button.
variant = Selector(default='text', label='Variant', names={}, objects=['outlined', 'text']): The variant of the pagination.

classmethod paginate(objects: list, layout: type[ListLike] = <class 'panel.layout.base.Column'>, page_size: int = 10, **params)[source]#

Paginate the items based on the current page and page size.

Parameters:

objects: list: The list of objects to paginate.
layout: type[LayoutBase]: The layout to use for the paginated items.
page_size: int: The number of items to display per page.
params: dict: Additional parameters to pass to the layout.

Returns:

layout: The layout with the paginated items.

width = None#

class panel.ui.Paper(*objects, **params)[source]#

Bases: MaterialListLike, PaperMixin

Paper implements a container for displaying content on an elevated surface.

References:

Example:

>>> Paper(name="Paper", objects=[1, 2, 3], elevation=10, width=200, height=200)

Parameter Definitions

Parameters inherited from:

panel_material_ui.layout.base.PaperMixin: elevation, raised, square, variant

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialListLike: scroll

margin = Margin(allow_None=True, allow_refs=True, default=0, label='Margin'): The margin of the layout.
direction = Selector(default='column', label='Direction', names={}, objects=['row', 'column', 'column-reverse', 'row-reverse']): Direction of content arrangement in the paper.

class panel.ui.ParamFunction(object=None, **params)[source]#

Bases: ParamRef

ParamFunction panes wrap functions decorated with the param.depends decorator and rerenders the output when any of the function’s dependencies change. This allows building reactive components into a Panel which depend on other parameters, e.g. tying the value of a widget to some other output.

Methods

applies(object, **kwargs)

Returns boolean or float indicating whether the Pane can render the object.

eval

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.base.ReplacementPane: object, inplace, _pane

panel.param.ParamRef: defer_load, generator_mode, lazy, loading_indicator

classmethod applies(object: Any, **kwargs) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.ParamMethod(object=None, **params)[source]#

Bases: ParamRef

ParamMethod panes wrap methods on parameterized classes and rerenders the plot when any of the method’s parameters change. By default ParamMethod will watch all parameters on the class owning the method or can be restricted to certain parameters by annotating the method using the param.depends decorator. The method may return any object which itself can be rendered as a Pane.

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

eval

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.base.ReplacementPane: object, inplace, _pane

panel.param.ParamRef: defer_load, generator_mode, lazy, loading_indicator

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.ParamRef(object=None, **params)[source]#

Bases: ReplacementPane

ParamRef wraps any valid parameter reference and resolves it dynamically, re-rendering the output. If enabled it will attempt to update the previously rendered component inplace.

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

eval

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.base.ReplacementPane: object, inplace, _pane

defer_load = Boolean(allow_None=True, label='Defer load'): Whether to defer load until after the page is rendered. Can be set as parameter or by setting panel.config.defer_load.
generator_mode = Selector(default='replace', label='Generator mode', names={}, objects=['append', 'replace']): Whether generators should ‘append’ to or ‘replace’ existing output.
lazy = Boolean(default=False, label='Lazy'): Whether to lazily evaluate the contents of the object only when it is required for rendering.
loading_indicator = Boolean(default=False, label='Loading indicator'): Whether to show a loading indicator while the pane is updating. Can be set as parameter or by setting panel.config.loading_indicator.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.PasswordInput(*, enter_pressed, max_length, placeholder, size, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _TextInputBase

The PasswordInput widget allows entering any string using an obfuscated text input box.

References:

Example:

>>> PasswordInput(label='Password', placeholder='Enter your password here ...')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: value, max_length, placeholder, size, value_input

enter_pressed = Event(default=False, label='Enter pressed'): Event when the enter key has been pressed.

class panel.ui.Perspective(object=None, **params)[source]#

Bases: ModelPane, ReactiveData

The Perspective pane provides an interactive visualization component for large, real-time datasets built on the Perspective project.

Reference: https://panel.holoviz.org/reference/panes/Perspective.html

Example:

>>> Perspective(df, plugin='hypergrid', theme='pro-dark')

Attributes:

object
priority

Methods

`applies`(object)	Returns boolean or float indicating whether the Pane can render the object.
`on_click`(callback)	Register a callback to be executed when any row is clicked.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.reactive.SyncableData: selection

panel.pane.base.PaneBase: margin, default_layout

min_width = Integer(allow_None=True, bounds=(0, None), default=420, inclusive_bounds=(True, True), label='Min width'): Minimal width of the component (in pixels) if width is adjustable.
object = Parameter(allow_None=True, allow_refs=True, label='Object'): The plot data declared as a dictionary of arrays or a DataFrame.
aggregates = Dict(allow_None=True, class_=<class 'dict'>, label='Aggregates', nested_refs=True): How to aggregate. For example {“x”: “distinct count”}
columns = List(allow_None=True, bounds=(0, None), item_type=(<class 'str'>, <class 'int'>), label='Columns', nested_refs=True): A list of source columns to show as columns. For example [“x”, “y”]
columns_config = Dict(allow_None=True, class_=<class 'dict'>, label='Columns config', nested_refs=True): Column configuration allowing specification of formatters, coloring and a variety of other attributes for each column.
editable = Boolean(allow_None=True, default=True, label='Editable'): Whether items are editable.
expressions = ClassSelector(allow_None=True, class_=(<class 'dict'>, <class 'list'>), label='Expressions', nested_refs=True): A list of expressions computing new columns from existing columns. For example [“”x”+”index””]
split_by = List(allow_None=True, bounds=(0, None), item_type=(<class 'str'>, <class 'int'>), label='Split by', nested_refs=True): A list of source columns to pivot by. For example [“x”, “y”]
filters = List(allow_None=True, bounds=(0, None), item_type=(<class 'tuple'>, <class 'list'>), label='Filters', nested_refs=True): How to filter. For example [[“x”, “<”, 3],[“y”, “contains”, “abc”]]
group_by = List(allow_None=True, bounds=(0, None), item_type=(<class 'str'>, <class 'int'>), label='Group by'): A list of source columns to group by. For example [“x”, “y”]
selectable = Boolean(allow_None=True, default=True, label='Selectable'): Whether items are selectable.
sort = List(allow_None=True, bounds=(0, None), item_type=(<class 'str'>, <class 'int'>, <class 'tuple'>, <class 'list'>), label='Sort'): How to sort. For example[[“x”,”desc”]]
plugin = Selector(default='datagrid', label='Plugin', names={}, objects=['hypergrid', 'datagrid', 'd3_y_bar', 'd3_x_bar', 'd3_xy_line', 'd3_y_line', 'd3_y_area', 'd3_y_scatter', 'd3_xy_scatter', 'd3_treemap', 'd3_sunburst', 'd3_heatmap', 'd3_candlestick', 'd3_ohlc']): The name of a plugin to display the data. For example hypergrid or d3_xy_scatter.
plugin_config = Dict(class_=<class 'dict'>, default={}, label='Plugin config', nested_refs=True): Configuration for the PerspectiveViewerPlugin.
settings = Boolean(default=True, label='Settings'): Whether to show the settings menu.
theme = Selector(default='pro', label='Theme', names={}, objects=['material', 'material-dark', 'monokai', 'solarized', 'solarized-dark', 'vaporwave', 'pro', 'pro-dark']): The style of the PerspectiveViewer. For example pro-dark
title = String(allow_None=True, label='Title'): Title for the Perspective viewer.

classmethod applies(object)[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

on_click(callback: Callable[[PerspectiveClickEvent], None])[source]#

Register a callback to be executed when any row is clicked. The callback is given a PerspectiveClickEvent declaring the config, column names, and row values of the row that was clicked.

Parameters:

callback: (callable): The callback to run on edit events.

priority: t.ClassVar[float | bool | None] = None#

class panel.ui.Pill(*, color, disabled_options, size, variant, attached, description, dark_theme, sx, theme_config, use_shadow_dom, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialSingleSelectBase

The Pill widget allows selecting a single value from a list of options rendered as clickable pills.

It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the Select, AutocompleteInput, RadioBoxGroup and RadioButtonGroup widgets.

References:

Example:

>>> Pill(label="Study", options=["Biology", "Chemistry", "Physics"])

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.select.MaterialSingleSelectBase: value

color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the selected pill.
disabled_options = List(bounds=(0, None), default=[], label='Disabled options', nested_refs=True): Optional list of options that are disabled, i.e. unusable and un-clickable. If options is a dictionary the list items have to correspond to the values in the options dictionary.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): Size of the pills.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined']): Variant style of the pills.

class panel.ui.Placeholder(object=None, **params)[source]#

Bases: ReplacementPane

The Placeholder pane serves as a placeholder for other Panel components. It can be used to display a message while a computation is running, for example.

Reference: https://panel.holoviz.org/reference/panes/Placeholder.html

Example:

>>> with Placeholder("⏳ Idle"):
...     placeholder.object = "🏃 Running..."

Methods

update(object)

Updates the object on the Placeholder.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.base.ReplacementPane: object, inplace, _pane

update(object)[source]#

Updates the object on the Placeholder.

Parameters:

object: The object to update the Placeholder with.

class panel.ui.Player(*, color, size, variant, attached, description, dark_theme, sx, theme_config, use_shadow_dom, end, start, value_throttled, direction, interval, loop_policy, preview_duration, scale_buttons, show_loop_controls, show_value, step, value_align, visible_buttons, visible_loop_options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _PlayerBase, Player

The Player provides controls to play and skip through a number of frames defined by explicit start and end values. The speed at which the widget plays is defined by the interval (in milliseconds), but it is also possible to skip frames using the step parameter.

References:

Example:

>>> Player(label='Frame', start=0, end=100, value=32, loop_policy='loop')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.player.PlayerBase: direction, interval, loop_policy, preview_duration, show_loop_controls, show_value, step, value_align, scale_buttons, visible_buttons, visible_loop_options

panel.widgets.player.Player: value, start, end, value_throttled

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.player._PlayerBase: height, width, color, size, variant

class panel.ui.Plotly(object=None, **params)[source]#

Bases: ModelPane

The Plotly pane renders Plotly plots inside a panel.

Note that

the Panel extension has to be loaded with plotly as an argument to

ensure that Plotly.js is initialized. - it supports click, hover and selection events. - it optimizes the plot rendering by using binary serialization for any array data found on the Plotly object.

Reference: https://panel.holoviz.org/reference/panes/Plotly.html

Example:

>>> pn.extension('plotly')
>>> Plotly(some_plotly_figure, width=500, height=500)

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

click_data = Dict(allow_None=True, class_=<class 'dict'>, label='Click data'): Click event data from plotly_click event.
doubleclick_data = Dict(allow_None=True, class_=<class 'dict'>, label='Doubleclick data'): Click event data from plotly_doubleclick event.
clickannotation_data = Dict(allow_None=True, class_=<class 'dict'>, label='Clickannotation data'): Clickannotation event data from plotly_clickannotation event.
config = Dict(allow_None=True, class_=<class 'dict'>, label='Config', nested_refs=True): Plotly configuration options. See https://plotly.com/javascript/configuration-options/
hover_data = Dict(allow_None=True, class_=<class 'dict'>, label='Hover data'): Hover event data from plotly_hover and plotly_unhover events.
link_figure = Boolean(default=True, label='Link figure'): Attach callbacks to the Plotly figure to update output when it is modified in place.
relayout_data = Dict(allow_None=True, class_=<class 'dict'>, label='Relayout data', nested_refs=True): Relayout event data from plotly_relayout event
restyle_data = List(bounds=(0, None), default=[], label='Restyle data', nested_refs=True): Restyle event data from plotly_restyle event
selected_data = Dict(allow_None=True, class_=<class 'dict'>, label='Selected data', nested_refs=True): Selected event data from plotly_selected and plotly_deselect events.
viewport = Dict(allow_None=True, class_=<class 'dict'>, label='Viewport', nested_refs=True): Current viewport state, i.e. the x- and y-axis limits of the displayed plot. Updated on plotly_relayout, plotly_relayouting and plotly_restyle events.
viewport_update_policy = Selector(default='mouseup', label='Viewport update policy', names={}, objects=['mouseup', 'continuous', 'throttle']): Policy by which the viewport parameter is updated during user interactions. * “mouseup”: updates are synchronized when mouse button is released after panning * “continuous”: updates are synchronized continually while panning * “throttle”: updates are synchronized while panning, at intervals determined by the viewport_update_throttle parameter
viewport_update_throttle = Integer(bounds=(0, None), default=200, inclusive_bounds=(True, True), label='Viewport update throttle'): Time interval in milliseconds at which viewport updates are synchronized when viewport_update_policy is “throttle”.
_render_count = Integer(default=0, inclusive_bounds=(True, True), label=' render count'): Number of renders, increment to trigger re-render

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.Popup(*objects, **params)[source]#

Bases: MaterialListLike

The Popup component displays content in an anchored overlay that requires user interaction. It is commonly used for contextual menus, confirmations, forms, or any UI element that should appear relative to another component or screen position.

Reference: https://mui.com/material-ui/react-menu/

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

anchor_origin = Dict(class_=<class 'dict'>, default={'horizontal': 'right', 'vertical': 'bottom'}, label='Anchor origin')

anchor_position = XYCoordinates(allow_None=True, label='Anchor position', length=2)

close_on_click = Boolean(default=True, label='Close on click'): Close when clicking outside the Popup area.
enforce_focus = Boolean(default=True, label='Enforce focus'): Whether to enforce focus on the Popup while it is open.
hide_backdrop = Boolean(default=False, label='Hide backdrop'): Whether to hide the backdrop when the Popup is open.
elevation = Integer(bounds=(0, None), default=1, inclusive_bounds=(True, True), label='Elevation'): Elevation of the paper surface.
open = Boolean(default=False, label='Open'): Whether the pop-up is open.

transform_origin = Dict(allow_None=True, class_=<class 'dict'>, label='Transform origin')

panel.ui.Progress[source]#: alias of LinearProgress

class panel.ui.RGGPlot(object=None, **params)[source]#

Bases: PNG

An RGGPlot pane renders an r2py-based ggplot2 figure to png and wraps the base64-encoded data in a bokeh Div model.

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

height = Integer(allow_None=True, bounds=(0, None), default=400, inclusive_bounds=(True, True), label='Height'): The height of the component (in pixels). This can be either fixed or preferred height, depending on height sizing policy.
width = Integer(allow_None=True, bounds=(0, None), default=400, inclusive_bounds=(True, True), label='Width'): The width of the component (in pixels). This can be either fixed or preferred width, depending on width sizing policy.
dpi = Integer(bounds=(1, None), default=144, inclusive_bounds=(True, True), label='Dpi'): Scales the dpi of the ggplot figure.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.RadioBoxGroup(*, color, inline, label_placement, size, attached, description, dark_theme, sx, theme_config, use_shadow_dom, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _RadioGroup, MaterialSingleSelectBase

The RadioBoxGroup widget allows selecting a value from a list of options.

It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the AutocompleteInput, Select and RadioButtonGroup widgets.

References:

Example:

>>> RadioBoxGroup(
...     label='Study', options=['Biology', 'Chemistry', 'Physics'],
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.select._RadioGroup: width, color, label_placement, size, inline

value = Parameter(allow_None=True, label='Value'): The selected value.

class panel.ui.RadioButtonGroup(*, orientation, size, variant, button_style, button_type, color, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ButtonGroup, MaterialSingleSelectBase

The RadioButtonGroup widget allows selecting from a list or dictionary of values using a set of toggle buttons.

It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the AutocompleteInput, Select, and RadioBoxGroup widgets.

References:

Example:

>>> RadioButtonGroup(
...     label='Plotting library', options=['Matplotlib', 'Bokeh', 'Plotly'],
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.select._ButtonGroup: width, orientation, size, variant

value = Parameter(allow_None=True, label='Value'): The selected value.

class panel.ui.RangeSlider(*, color, end, format, inline_layout, marks, size, start, step, track, value_label, value_throttled, attached, description, dark_theme, sx, theme_config, use_shadow_dom, bar_color, direction, orientation, show_value, tooltips, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _RangeSliderBase

The RangeSlider widget allows selecting a floating-point range using a slider with two handles.

References:

Example:

>>> RangeSlider(
...     value=(1.0, 1.5), start=0.0, end=2.0, step=0.25, label="A tuple of floats"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.slider._SliderBase: orientation, show_value

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.slider._ContinuousSlider: bar_color, direction, tooltips, color, start, end, format, marks, size, track, value_label, inline_layout

panel_material_ui.widgets.slider._RangeSliderBase: value, value_throttled, value_start, value_end

step = Number(default=0.1, inclusive_bounds=(True, True), label='Step'): The step size of the slider.

class panel.ui.Rating(*, color, empty_icon, end, icon, only_selected, precision, readonly, size, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The Rating slider widget allows users to select a rating value of their own.

References:

https://mui.com/material-ui/react-rating/

Example:

>>> Rating(value=3, size="large", name="Rate the product")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

value = Number(allow_None=True, bounds=(0, 5), default=0, inclusive_bounds=(True, True), label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): Width of the widget.
color = Selector(label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the ratings.
end = Integer(bounds=(1, None), default=5, inclusive_bounds=(True, True), label='End'): The maximum value for the rating.
empty_icon = String(allow_None=True, label='Empty icon'): The icon to render for a non-selected rating.
icon = String(default='star', label='Icon'): The icon to render for a selected rating.
only_selected = Boolean(default=False, label='Only selected'): Whether to highlight only the select value
precision = Number(bounds=(0, 1.0), default=1.0, inclusive_bounds=(True, True), label='Precision'): The precision of the rating value. If set to 0.5, the rating can be set to 0, 0.5, 1, 1.5, …, up to the end value.
readonly = Boolean(default=False, label='Readonly'): Whether the rating is read-only. If True, the user cannot change the rating.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): Size of the rating icons.

width = None#

class panel.ui.ReactiveExpr(object=None, **params)[source]#

Bases: Pane

ReactiveExpr generates a UI for param.rx objects by rendering the widgets and outputs.

Attributes:

object
widgets

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

object = Parameter(allow_None=True, label='Object'): The object being wrapped, which will be converted to a Bokeh model.
center = Boolean(default=False, label='Center'): Whether to center the output.
show_widgets = Boolean(default=True, label='Show widgets'): Whether to display the widget inputs.
widget_layout = ClassSelector(class_=<class 'panel.layout.base.ListLike'>, constant=True, default=<class 'panel.layout.base.WidgetBox'>, label='Widget layout'): The layout object to display the widgets in.
widget_location = Selector(default='left_top', label='Widget location', names={}, objects=['left', 'right', 'top', 'bottom', 'top_left', 'top_right', 'bottom_left', 'bottom_right', 'left_top', 'right_top', 'right_bottom']): The location of the widgets relative to the output of the reactive expression.

classmethod applies(object)[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

widget_layout[source]#: alias of WidgetBox

class panel.ui.Reacton(object=None, **params)[source]#

Bases: IPyWidget

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.ipywidget.IPyWidget: object

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.Row(*objects, **params)[source]#

Bases: MaterialListLike

The Row layout arranges its contents horizontally.

Parameter Definitions

Parameters inherited from:

panel.layout.base.ListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialListLike: scroll

class panel.ui.SVG(object=None, **params)[source]#

Bases: ImageBase

The SVG pane embeds a .svg image file in a panel if provided a local path, or will link to a remote image if provided a URL.

Reference: https://panel.holoviz.org/reference/panes/SVG.html

Example:

>>> SVG(
...     'https://upload.wikimedia.org/wikipedia/commons/6/6b/Bitmap_VS_SVG.svg',
...     alt_text='A gif vs svg comparison',
...     link_url='https://en.wikipedia.org/wiki/SVG',
...     width=300, height=400
... )

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.image.FileBase: embed

panel.pane.image.ImageBase: alt_text, caption, fixed_aspect, link_url, target

encode = Boolean(default=True, label='Encode'): Whether to enable base64 encoding of the SVG, base64 encoded SVGs do not support links.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.Select(*, color, error_state, helper_text, variant, groups, size, bookmarks, disabled_options, dropdown_height, dropdown_open, filter_on_search, filter_str, searchable, value_label, attached, description, dark_theme, sx, theme_config, use_shadow_dom, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialSingleSelectBase, Select, _SelectDropdownBase

The Select widget allows selecting a value from a list.

It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the AutocompleteInput, RadioBoxGroup and RadioButtonGroup widgets.

References:

Example:

>>> Select(label='Study', options=['Biology', 'Chemistry', 'Physics'])

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.select.SelectBase: options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.select._SelectDropdownBase: bookmarks, filter_str, filter_on_search, dropdown_height, dropdown_open, searchable, value_label

panel.widgets.select.Select: width, description, disabled_options

panel_material_ui.widgets.select.MaterialSingleSelectBase: value

groups = Dict(allow_None=True, class_=<class 'dict'>, label='Groups', nested_refs=True): Dictionary whose keys are used to visually group the options and whose values are either a list or a dictionary of options to select from. Mutually exclusive with options and valid only if size is 1.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): Declares how many options are displayed at the same time. If set to 1 displays options as dropdown otherwise displays scrollable area.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the select widget.
error_state = Boolean(default=False, label='Error state'): Whether to display in error state.
helper_text = String(default='', label='Helper text'): Helper text displayed below the select field.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined', 'standard']): The variant style of the select widget.

class panel.ui.Skeleton(object=None, **params)[source]#

Bases: Wrapper

The Skeleton wraps a child component and displays an animated placeholder in its place while loading. When active is True the skeleton is shown; when False the child is rendered normally.

References:

Example:

>>> Skeleton(Card(...), active=True, variant="rounded")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.wrappers.base.Wrapper: object

active = Boolean(default=False, label='Active'): Whether to show the child content. When False the skeleton placeholder is rendered; when True the child is displayed normally.
animation = Selector(default='pulse', label='Animation', names={}, objects=['pulse', 'wave', None]): The animation effect for the skeleton. Use None to disable.
variant = Selector(default='rounded', label='Variant', names={}, objects=['text', 'circular', 'rectangular', 'rounded']): Shape variant of the skeleton placeholder.

class panel.ui.Spacer(refs=None, **params)[source]#

Bases: Reactive

The Spacer layout is a very versatile component which makes it easy to put fixed or responsive spacing between objects.

Like all other components spacers support both absolute and responsive sizing modes.

How-to: https://panel.holoviz.org/how_to/layout/spacing.html#spacer-components

Example:

>>> pn.Row(
...    1, pn.Spacer(width=200),
...    2, pn.Spacer(width=100),
...    3
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

class panel.ui.SpeechToText(*, _grammars, abort, audio_started, button_hide, button_not_started, button_started, button_type, color, continuous, grammars, interim_results, lang, max_alternatives, results, service_uri, sound_started, speech_started, start, started, stop, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: Widget

The SpeechToText widget controls the speech recognition service of the browser.

It wraps the HTML5 SpeechRecognition API. See https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition

Reference: https://panel.holoviz.org/reference/widgets/SpeechToText.html

Example:

>>> SpeechToText(color="light")

This functionality is experimental and only supported by Chrome and a few other browsers. Checkout https://caniuse.com/speech-recognition for a up to date list of browsers supporting the SpeechRecognition Api. Or alternatively https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition#Browser_compatibility

On some browsers, like Chrome, using Speech Recognition on a web page involves a server-based recognition engine. Your audio is sent to a web service for recognition processing, so it won’t work offline. Whether this is secure and confidential enough for your use case is up to you to evaluate.

Attributes:

results_as_html: Returns the results formatted as html
results_deserialized: Returns the results as a List of RecognitionResults

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = String(constant=True, default=''): The transcipt of the highest confidence RecognitionAlternative of the last RecognitionResult. Please note we strip the transcript for leading spaces.
abort = Event(default=False, label='Abort'): Stops the speech recognition service from listening to incoming audio, and doesn’t attempt to return a RecognitionResult.
start = Event(default=False, label='Start'): Starts the speech recognition service listening to incoming audio with intent to recognize grammars associated with the current SpeechRecognition.
stop = Event(default=False, label='Stop'): Stops the speech recognition service from listening to incoming audio, and attempts to return a RecognitionResult using the audio captured so far.
lang = Selector(allow_None=True, default='', names={}, objects=['', 'af-ZA', 'ar-AE', 'ar-BH', 'ar-DZ', 'ar-EG', 'ar-IL', 'ar-IQ', 'ar-JO', 'ar-KW', 'ar-LB', 'ar-MA', 'ar-OM', 'ar-PS', 'ar-QA', 'ar-SA', 'ar-TN', 'bg-BG', 'ca-ES', 'cmn-Hans-CN', 'cmn-Hans-HK', 'cmn-Hant-TW', 'cs-CZ', 'da-DK', 'de-DE', 'el-GR', 'en-AU', 'en-CA', 'en-GB', 'en-IE', 'en-IN', 'en-NZ', 'en-PH', 'en-US', 'en-ZA', 'es-AR', 'es-BO', 'es-CL', 'es-CO', 'es-CR', 'es-DO', 'es-EC', 'es-ES', 'es-GT', 'es-HN', 'es-MX', 'es-NI', 'es-PA', 'es-PE', 'es-PR', 'es-PY', 'es-SV', 'es-US', 'es-UY', 'es-VE', 'eu-ES', 'fa-IR', 'fi-FI', 'fil-PH', 'fr-FR', 'gl-ES', 'he-IL', 'hi-IN', 'hr_HR', 'hu-HU', 'id-ID', 'is-IS', 'it-CH', 'it-IT', 'ja-JP', 'ko-KR', 'lt-LT', 'ms-MY', 'nb-NO', 'nl-NL', 'pl-PL', 'pt-BR', 'pt-PT', 'ro-RO', 'ru-RU', 'sk-SK', 'sl-SI', 'sr-RS', 'sv-SE', 'th-TH', 'tr-TR', 'uk-UA', 'vi-VN', 'yue-Hant-HK', 'zu-ZA']): The language of the current SpeechRecognition in BCP 47 format. For example ‘en-US’. If not specified, this defaults to the HTML lang attribute value, or the user agent’s language setting if that isn’t set either.
continuous = Boolean(default=False, label='Continuous'): Controls whether continuous results are returned for each recognition, or only a single result. Defaults to False
interim_results = Boolean(default=False, label='Interim results'): Controls whether interim results should be returned (True) or not (False.) Interim results are results that are not yet final (e.g. the RecognitionResult.is_final property is False).
max_alternatives = Integer(bounds=(1, 5), default=1, inclusive_bounds=(True, True), label='Max alternatives'): Sets the maximum number of RecognitionAlternatives provided per result. A number between 1 and 5. The default value is 1.
service_uri = String(default='', label='Service uri'): Specifies the location of the speech recognition service used by the current SpeechRecognition to handle the actual recognition. The default is the user agent’s default speech service.
grammars = ClassSelector(allow_None=True, class_=<class 'panel.widgets.speech_to_text.GrammarList'>, label='Grammars'): A GrammarList object that represents the grammars that will be understood by the current SpeechRecognition service
button_hide = Boolean(default=False): If True no button is shown. If False a toggle Start/ Stop button is shown.
button_type = Selector(default='light', label='Button type', names={}, objects=['default', 'primary', 'success', 'warning', 'danger', 'light', 'light', 'dark']): The button styling. The same value is exposed as color.
color = Selector(default='light', label='Color', names={}, objects=['default', 'primary', 'success', 'warning', 'danger', 'light', 'light', 'dark']): Semantic color of the button; alias for button_type.
button_not_started = String(default=''): The text to show on the button when the SpeechRecognition service is NOT started. If ‘’ a muted microphone icon is shown.
button_started = String(default=''): The text to show on the button when the SpeechRecognition service is started. If ‘’ a muted microphone icon is shown.
started = Boolean(constant=True, default=False, label='Started'): Returns True if the Speech Recognition Service is started and False otherwise.
audio_started = Boolean(constant=True, default=False, label='Audio started'): Returns True if the Audio is started and False otherwise.
sound_started = Boolean(constant=True, default=False, label='Sound started'): Returns True if the Sound is started and False otherwise.
speech_started = Boolean(constant=True, default=False, label='Speech started'): Returns True if the the User has started speaking and False otherwise.
results = List(bounds=(0, None), constant=True, default=[], item_type=<class 'dict'>, label='Results'): The results as a list of Dictionaries.
_grammars = List(bounds=(0, None), constant=True, default=[], item_type=<class 'dict'>, label=' grammars'): List used to transfer the serialized grammars from server to browser.

property results_as_html: str#

Returns the results formatted as html

Convenience method for ease of use

property results_deserialized#: Returns the results as a List of RecognitionResults

class panel.ui.SpeedDial(*, color, direction, icon, open_icon, persistent_tooltips, size, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MenuBase

The SpeedDial component is a menu component that allows selecting from a list of items.

SpeedDial items can be strings or objects with properties:

label: The label of the speed dial item (required)
icon: The icon of the speed dial item (optional)
avatar: The avatar of the speed dial item (optional)
color: The color of the speed dial item (optional)

References:

Example:

>>> pmui.SpeedDial(items=[
...     {'label': 'Camera', 'icon': 'camera'},
...     {'label': 'Photos', 'icon': 'photo'},
...     {'label': 'Documents', 'icon': 'article'},
... ], active=2, margin=(50, 20))

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, width, active, items

color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the menu.
direction = Selector(default='right', label='Direction', names={}, objects=['right', 'left', 'up', 'down']): The direction of the menu.
icon = String(allow_None=True, label='Icon'): The icon to display when the menu is closed.
open_icon = String(allow_None=True, label='Open icon'): The icon to display when the menu is open.
persistent_tooltips = Boolean(default=False, label='Persistent tooltips'): Whether to show persistent tooltips next to the menu items.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the dial.

class panel.ui.SplitButton(*, mode, active, items, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MenuBase, _ButtonBase

The SplitButton component combines a button with a dropdown menu, allowing users to quickly access a primary action and related alternatives.

This component supports two modes:

`split`: The main button performs a default action, while the dropdown lets users trigger related but independent actions.
`select`: Users select an option from the dropdown, and the main button triggers the selected action when clicked.

Each menu item can be a string or a dictionary with the following keys:

`label` (str, required): The text displayed for the menu item.
`icon` (str, optional): An icon to display next to the label.
`href` (str, optional): A URL to open when the menu item is clicked.
`target` (str, optional): Where to open the linked URL (e.g., _blank).
`tooltip` (str, optional): Tooltip text shown on hover.

The SplitButton is ideal for workflows where a primary action is most common, but users may occasionally need to choose an alternative.

References:

Example:

>>> pmui.SplitButton(items=[
...     {'label': 'Open'},
...     {'label': 'Save'},
... ], label='Save')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: variant, clicks, disable_elevation, end_icon, icon, icon_size, size

panel_material_ui.widgets.menus.MenuBase: value, width, active, items

margin = Margin(allow_None=True, allow_refs=True, default=5, label='Margin'): Margin around the widget.
mode = Selector(default='split', label='Mode', names={}, objects=['split', 'select']): Allows toggling button behavior between split mode (button click and menu click actions raise events) and select mode (only button click raise events).

class panel.ui.StaticText(**params: Any)[source]#

Bases: Widget

The StaticText widget displays a text value, but does not allow editing it.

Reference: https://panel.holoviz.org/reference/widgets/StaticText.html

Example:

>>> StaticText(name='Model', value='animagen2')

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = Parameter(allow_None=True, label='Value'): The current value to be displayed.

class panel.ui.StepperMenu(*, alternative_label, back_text, color, connector, indicator, next_text, non_linear, orientation, position, variant, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MenuBase

The StepperMenu displays progress through a sequence of numbered steps and emits the active step as users navigate. It is a menu-style indicator: it is driven by a declarative list of items and reports the selection via the active and value parameters.

Two variants are available via variant: the default standard variant renders a labelled horizontal strip of steps, while the compact variant renders a minimal mobile-style bar with a dots, progress, or text indicator and back/next navigation.

Step items can be strings or dictionaries with the following properties:

label: The label of the step (required)
icon: Icon name or inline SVG shown for pending steps (optional)
active_icon: Icon shown when the step is active or completed; falls back to the filled version of icon when not provided (optional)
completed: Whether the step is marked complete (optional)
error: Whether the step is in an error state (optional)
optional: Whether to show an “Optional” caption under the label (optional)
disabled: Whether the step is disabled (optional)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.StepperMenu(items=[
...     {'label': 'Account', 'icon': 'person', 'completed': True},
...     {'label': 'Shipping', 'icon': 'local_shipping'},
...     {'label': 'Review', 'icon': 'check', 'optional': True},
... ], active=1)

Methods

`back`()	Return to the previous step.
`next`()	Advance to the next step.
`reset`()	Reset to the first step.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, width, items

active = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Active'): The index of the currently active step.
alternative_label = Boolean(default=False, label='Alternative label'): Whether to place the step label below the step icon. Only applies to the ‘standard’ variant.
back_text = String(default='Back', label='Back text'): Label for the back navigation button. Only applies to the ‘compact’ variant.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the active and completed steps.
connector = Boolean(default=True, label='Connector'): Whether to display the connector line between steps. Only applies to the ‘standard’ variant.
indicator = Selector(default='dots', label='Indicator', names={}, objects=['dots', 'progress', 'text']): The type of progress indicator to display. Only applies to the ‘compact’ variant.
next_text = String(default='Next', label='Next text'): Label for the next navigation button. Only applies to the ‘compact’ variant.
non_linear = Boolean(default=False, label='Non linear'): Whether steps can be clicked to navigate non-linearly. Only applies to the ‘standard’ variant.
orientation = Selector(default='horizontal', label='Orientation', names={}, objects=['horizontal', 'vertical']): The orientation of the stepper. Use ‘vertical’ to stack the steps from top to bottom (e.g. in a narrow sidebar). Only applies to the ‘standard’ variant.
position = Selector(default='static', label='Position', names={}, objects=['bottom', 'static', 'top']): The positioning of the bar. Only applies to the ‘compact’ variant.
variant = Selector(default='standard', label='Variant', names={}, objects=['standard', 'compact']): The stepper variant. ‘standard’ renders a labelled horizontal strip; ‘compact’ renders a minimal mobile-style bar with an indicator and navigation buttons.

back()[source]#: Return to the previous step.

next()[source]#: Advance to the next step.

reset()[source]#: Reset to the first step.

class panel.ui.Str(object=None, **params)[source]#

Bases: HTMLBasePane

The Str pane allows rendering arbitrary text and objects in a panel.

Unlike Markdown and HTML, a Str is interpreted as a raw string without applying any markup and is displayed in a fixed-width font by default.

The pane will render any text, and if given an object will display the object’s Python repr.

Reference: https://panel.holoviz.org/reference/panes/Str.html

Example:

>>> Str(
...    'This raw string will not be formatted, except for the applied style.',
...    styles={'font-size': '12pt'}
... )

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

classmethod applies(object: Any) → bool[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.Streamz(object=None, **params)[source]#

Bases: ReplacementPane

The Streamz pane renders streamz Stream objects emitting arbitrary objects, unlike the DataFrame pane which specifically handles streamz DataFrame and Series objects and exposes various formatting objects.

Reference: https://panel.holoviz.org/reference/panes/Streamz.html

Example:

>>> Streamz(some_streamz_stream_object, always_watch=True)

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.base.ReplacementPane: object, inplace, _pane

always_watch = Boolean(default=False, label='Always watch'): Whether to watch even when not displayed.
rate_limit = Number(bounds=(0, None), default=0.1, inclusive_bounds=(True, True), label='Rate limit'): The minimum interval between events.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.String(*, default_color, font_size, title_size, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: ValueIndicator

The String indicator renders a string with a title.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.widgets.indicators.Indicator: sizing_mode

value = String(allow_None=True, label='Value'): The string to display
default_color = String(default='currentcolor', label='Default color'): The color of the indicator if no colors are provided
font_size = String(default='54pt', label='Font size'): The size of number itself.
title_size = String(default='18pt', label='Title size'): The size of the title given by the label.

class panel.ui.Swipe(*objects, **params)[source]#

Bases: ListLike, ReactiveHTML

The Swipe layout enables you to quickly compare two panels laid out on top of each other with a part of the before panel shown on one side of a slider and a part of the after panel shown on the other side.

Attributes:

after
before

Methods

`clone`(objects, *params)	Makes a copy of the layout sharing the same parameters.
`select`([selector])	Iterates over the Viewable and any potential children in the applying the Selector.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

objects = Children(bounds=(0, None), default=[], item_type=<class 'panel.viewable.Viewable'>, label='Objects'): The list of child objects that make up the layout.
slider_width = Integer(bounds=(0, 25), default=5, inclusive_bounds=(True, True), label='Slider width'): The width of the slider in pixels
slider_color = Color(allow_named=True, default='black', label='Slider color'): The color of the slider
start = Integer(bounds=(0, 100), default=0, inclusive_bounds=(True, True), label='Start'): Limits the minimum percentage the swipe handler can be moved to.
end = Integer(bounds=(0, 100), default=100, inclusive_bounds=(True, True), label='End'): Limits the maximum percentage the swipe handler can be moved to.
value = Integer(bounds=(0, 100), default=50, inclusive_bounds=(True, True), label='Value'): The percentage of the after panel to show.

_before = Parameter(allow_None=True, label=' before')

_after = Parameter(allow_None=True, label=' after')

clone(*objects: t.Any, **params: t.Any) → Self[source]#

Makes a copy of the layout sharing the same parameters.

Parameters:

objects: Objects to add to the cloned layout.
params: Keyword arguments override the parameters on the clone.

Returns:

Cloned layout object

select(selector=None)[source]#

Iterates over the Viewable and any potential children in the applying the Selector.

Parameters:

selector: type or callable or None: The selector allows selecting a subset of Viewables by declaring a type or callable function to filter by.

Returns:

viewables: list(Viewable)

class panel.ui.Switch(*, color, description_delay, edge, size, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

The Switch allows toggling a single condition between True/False states by ticking a checkbox.

This widget is interchangeable with the Checkbox widget.

References:

Example:

>>> Switch(label='Works with the tools you know and love', value=True)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

value = Boolean(default=False, label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
width = Boolean(allow_None=True, allow_refs=True, label='Width'): Width of the widget.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the switch.
description_delay = Integer(default=1000, inclusive_bounds=(True, True), label='Description delay'): Delay (in milliseconds) to display the tooltip after the cursor has hovered over the Button, default is 1000ms.
edge = Selector(default=False, label='Edge', names={}, objects=['start', 'end', False]): The edge position for the switch.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The size of the switch.

width = None#

class panel.ui.TabMenu(*, centered, color, icon_position, scroll_buttons, variant, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MenuBase

The TabMenu component is used to display a group of tabs that allow users to switch between different views or sections of content. It provides a clean, organized way to navigate between related items.

Tab items can be strings or objects with properties:

label: The label of the tab item (required)
icon: The icon of the tab item (optional)
avatar: The avatar of the tab item (optional)
href: Link to navigate to when clicking the tab item (optional)
target: Link target (e.g. “_blank”) (optional)
tooltip: The tooltip text shown on hover (optional)

References:

Example:

>>> pmui.TabMenu(items=[
...     {'label': 'Home', 'icon': 'home'},
...     {'label': 'Gallery', 'icon': 'image'},
...     {'label': 'Settings', 'icon': 'settings'},
... ], active=0)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: value, margin, width, active, items

centered = Boolean(default=False, label='Centered'): Whether the tabs should be centered.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the tabs.
icon_position = Selector(default='start', label='Icon position', names={}, objects=['start', 'top', 'end', 'bottom']): The position of the icon relative to the tab label.
scroll_buttons = Selector(default='auto', label='Scroll buttons', names={}, objects=['auto', 'true', 'false']): Determine behavior of scroll buttons when tabs are set to scroll. - “auto” will only present them when not all the items are visible. - “true” will always present them. - “false” will never present them.
variant = Selector(default='standard', label='Variant', names={}, objects=['standard', 'scrollable', 'fullWidth']): The variant to use for the tabs.

class panel.ui.Tabs(*objects, **params)[source]#

Bases: MaterialNamedListLike

The Tabs layout allows switching between multiple objects by clicking on the corresponding tab header.

Tab labels may be defined explicitly as part of a tuple or will be inferred from the name parameter of the tab’s contents.

Like Accordion, Tabs has a list-like API with methods to append, extend, clear, insert, pop, remove and __setitem__, which make it possible to interactively update and modify the tabs.

References:

Example:

>>> Tabs(("Tab 1", "Tab 1 objects"), ("Tab 2", "Card 2 objects"))

Parameter Definitions

Parameters inherited from:

panel.layout.base.NamedListLike: objects

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.layout.base.MaterialLayout: margin

panel_material_ui.layout.base.MaterialNamedListLike: _names, _headers

active = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Active'): Index of the currently displayed objects.
closable = Boolean(default=False, label='Closable'): Whether to display an icon to allow closing and thereby removing a tab.
centered = Boolean(default=False, label='Centered'): Whether the tabs should be centered.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): Color of the tabs component.
disabled = List(bounds=(0, None), default=[], item_type=<class 'int'>, label='Disabled'): List of indexes of disabled tabs.
dynamic = Boolean(default=False, label='Dynamic'): Whether the tab contents should be rendered dynamically, i.e. only when the tab is active.
tabs_location = ObjectSelector(default='above', label='Tabs location', names={}, objects=['above', 'below', 'left', 'right']): The location of the tabs relative to the tab contents.
wrapped = Boolean(default=False, label='Wrapped'): Whether the tab labels should be wrapped.

class panel.ui.Tabulator(value=None, **params)[source]#

Bases: BaseTable

The Tabulator widget wraps the [Tabulator js](http://tabulator.info/) table to provide a full-featured, very powerful interactive table.

Reference: https://panel.holoviz.org/reference/widgets/Tabulator.html

Example:

>>> Tabulator(df, theme='site', pagination='remote', page_size=25)

Attributes:

current_view: Returns the current view of the table after filtering and sorting are applied.

Methods

`download`([filename])	Triggers downloading of the table as a CSV or JSON.
`download_menu`([text_kwargs, button_kwargs])	Returns a menu containing a TextInput and Button widget to set the filename and trigger a client-side download of the data.
`on_click`(callback[, column])	Register a callback to be executed when any cell is clicked.
`on_edit`(callback)	Register a callback to be executed when a cell is edited.
`stream`(stream_value[, rollover, ...])	Streams (appends) the stream_value provided to the existing value in an efficient manner.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.widgets.tables.BaseTable: value, aggregators, editables, editors, formatters, hierarchical, show_index, sorters, text_align, titles, widths

selection = _ListValidateWithCallable(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'int'>, label='Selection'): The currently selected rows of the table. It validates its values against ‘selectable_rows’ if used.
row_height = Integer(allow_refs=True, default=30, inclusive_bounds=(True, True), label='Row height'): The height of each table row.
buttons = Dict(allow_refs=True, class_=<class 'dict'>, default={}, label='Buttons', nested_refs=True): Dictionary mapping from column name to a HTML element to use as the button icon.
container_popup = Boolean(allow_refs=True, default=True, label='Container popup'): If True, popups will appear within the table container, otherwise popups will be appended to the body element of the DOM.
expanded = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'int'>, label='Expanded', nested_refs=True): List of expanded rows, only applicable if a row_content function has been defined.
embed_content = Boolean(allow_refs=True, default=False, label='Embed content'): Whether to embed the row_content or render it dynamically when a row is expanded.
filters = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'dict'>, label='Filters'): List of client-side filters declared as dictionaries containing ‘field’, ‘type’ and ‘value’ keys.
frozen_columns = ClassSelector(allow_refs=True, class_=(<class 'list'>, <class 'dict'>), default=[], label='Frozen columns', nested_refs=True): One of: - List indicating the columns to freeze. The column(s) may be selected by name or index. - Dict indicating columns to freeze as keys and their freeze location as values, freeze location is either ‘right’ or ‘left’.
frozen_rows = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'int'>, label='Frozen rows', nested_refs=True): List indicating the rows to freeze. If set, the first N rows will be frozen, which prevents them from scrolling out of frame; if set to a negative value the last N rows will be frozen.
groups = Dict(allow_refs=True, class_=<class 'dict'>, default={}, label='Groups', nested_refs=True): Dictionary mapping defining the groups.
groupby = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'str'>, label='Groupby', nested_refs=True): Groups rows in the table by one or more columns.
header_align = ClassSelector(allow_refs=True, class_=(<class 'dict'>, <class 'str'>), default={}, label='Header align', nested_refs=True): A mapping from column name to alignment or a fixed column alignment, which should be one of ‘left’, ‘center’, ‘right’.
header_filters = ClassSelector(allow_None=True, allow_refs=True, class_=(<class 'bool'>, <class 'dict'>), label='Header filters', nested_refs=True): Whether to enable filters in the header or dictionary configuring filters for each column.
header_tooltips = Dict(allow_refs=True, class_=<class 'dict'>, default={}, label='Header tooltips'): Dictionary mapping from column name to a tooltip to show when hovering over the column header.
hidden_columns = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'str'>, label='Hidden columns', nested_refs=True): List of columns to hide.
movable_columns = Boolean(allow_refs=True, default=False, label='Movable columns'): Whether columns can be reordered by dragging their headers.
layout = Selector(allow_refs=True, default='fit_data_table', label='Layout', names={}, objects=['fit_data', 'fit_data_fill', 'fit_data_stretch', 'fit_data_table', 'fit_columns']): Describes the column layout mode with one of the following options ‘fit_columns’, ‘fit_data’, ‘fit_data_stretch’, ‘fit_data_fill’, ‘fit_data_table’.
initial_page_size = Integer(allow_refs=True, bounds=(1, None), default=20, inclusive_bounds=(True, True), label='Initial page size'): Initial page size if page_size is None and therefore automatically set.
pagination = Selector(allow_None=True, allow_refs=True, label='Pagination', names={}, objects=['local', 'remote']): Defines the pagination mode of the Tabulator. - None No pagination is applied, all rows are rendered. - ‘local’ (client-side) Pagination is applied locally, i.e. the entire DataFrame is loaded and then paginated. - ‘remote’ (server-side) Pagination is applied remotely, i.e. only the current page is loaded from the server.
page = Integer(allow_refs=True, default=1, inclusive_bounds=(True, True), label='Page'): Currently selected page (indexed starting at 1), if pagination is enabled.
page_size = Integer(allow_None=True, allow_refs=True, bounds=(1, None), inclusive_bounds=(True, True), label='Page size'): Number of rows to render per page, if pagination is enabled.
row_content = Callable(allow_None=True, label='Row content'): A function which is given the DataFrame row and should return a Panel object to render as additional detail below the row. The function may also be asynchronous.
selectable = ClassSelector(allow_refs=True, class_=(<class 'bool'>, <class 'str'>, <class 'int'>), default=True, label='Selectable'): Defines the selection mode of the Tabulator. - True Selects rows on click. To select multiple use Ctrl-select, to select a range use Shift-select - False Disables selection - ‘checkbox’ Adds a column of checkboxes to toggle selections - ‘checkbox-single’ Same as ‘checkbox’ but header does not allow select/deselect all - ‘toggle’ Selection toggles when clicked - int The maximum number of selectable rows.
selectable_rows = Callable(allow_None=True, allow_refs=True, label='Selectable rows'): A function which given a DataFrame should return a list of rows by integer index, which are selectable.
sortable = ClassSelector(allow_refs=True, class_=(<class 'bool'>, <class 'dict'>), default=True, label='Sortable'): Whether the columns in the table should be sortable. Can either be specified as a simple boolean toggling the behavior on and off or as a dictionary specifying the option per column.
theme = Selector(allow_refs=True, default='simple', label='Theme', names={}, objects=['default', 'site', 'simple', 'midnight', 'modern', 'bootstrap', 'bootstrap4', 'materialize', 'bulma', 'semantic-ui', 'fast', 'bootstrap5']): Tabulator CSS theme to apply to table.
theme_classes = List(allow_refs=True, bounds=(0, None), default=[], item_type=<class 'str'>, label='Theme classes', nested_refs=True): List of extra CSS classes to apply to the Tabulator element to customize the theme.
title_formatters = Dict(allow_refs=True, class_=<class 'dict'>, default={}, label='Title formatters', nested_refs=True): Tabulator formatter specification to use for a particular column header title.

property current_view: pd.DataFrame#: Returns the current view of the table after filtering and sorting are applied.

download(filename: str = 'table.csv')[source]#

Triggers downloading of the table as a CSV or JSON.

Parameters:

filename: str: The filename to save the table as.

download_menu(text_kwargs={}, button_kwargs={})[source]#

Returns a menu containing a TextInput and Button widget to set the filename and trigger a client-side download of the data.

Parameters:

text_kwargs: dict: Keyword arguments passed to the TextInput constructor
button_kwargs: dict: Keyword arguments passed to the Button constructor

Returns:

filename: TextInput: The TextInput widget setting a filename.
button: Button: The Button that triggers a download.

on_click(callback: Callable[[CellClickEvent], None], column: str | None = None)[source]#

Register a callback to be executed when any cell is clicked. The callback is given a CellClickEvent declaring the column and row of the cell that was clicked.

Parameters:

callback: (callable): The callback to run on edit events.
column: (str): Optional argument restricting the callback to a specific column.

on_edit(callback: Callable[[TableEditEvent], None])[source]#

Register a callback to be executed when a cell is edited. Whenever a cell is edited on_edit callbacks are called with a TableEditEvent as the first argument containing the column, row and value of the edited cell.

Parameters:

callback: (callable): The callback to run on edit events.

stream(stream_value, rollover=None, reset_index=True, follow=True)[source]#

Streams (appends) the stream_value provided to the existing value in an efficient manner.

Parameters:

stream_value: (pd.DataFrame | pd.Series | Dict): The new value(s) to append to the existing value.
rollover: int: A maximum column size, above which data from the start of the column begins to be discarded. If None, then columns will continue to grow unbounded.
reset_index: (bool, default=True): If True and the stream_value is a DataFrame, then its index is reset. Helps to keep the index unique and named index

Raises:

ValueError: Raised if the stream_value is not a supported type.

Examples

Stream a Series to a DataFrame >>> value = pd.DataFrame({“x”: [1, 2], “y”: [“a”, “b”]}) >>> tabulator = Tabulator(value=value) >>> stream_value = pd.Series({“x”: 4, “y”: “d”}) >>> tabulator.stream(stream_value) >>> tabulator.value.to_dict(“list”) {‘x’: [1, 2, 4], ‘y’: [‘a’, ‘b’, ‘d’]}

Stream a Dataframe to a Dataframe >>> value = pd.DataFrame({“x”: [1, 2], “y”: [“a”, “b”]}) >>> tabulator = Tabulator(value=value) >>> stream_value = pd.DataFrame({“x”: [3, 4], “y”: [“c”, “d”]}) >>> tabulator.stream(stream_value) >>> tabulator.value.to_dict(“list”) {‘x’: [1, 2, 3, 4], ‘y’: [‘a’, ‘b’, ‘c’, ‘d’]}

Stream a Dictionary row to a DataFrame >>> value = pd.DataFrame({“x”: [1, 2], “y”: [“a”, “b”]}) >>> tabulator = Tabulator(value=value) >>> stream_value = {“x”: 4, “y”: “d”} >>> tabulator.stream(stream_value) >>> tabulator.value.to_dict(“list”) {‘x’: [1, 2, 4], ‘y’: [‘a’, ‘b’, ‘d’]}

Stream a Dictionary of Columns to a Dataframe >>> value = pd.DataFrame({“x”: [1, 2], “y”: [“a”, “b”]}) >>> tabulator = Tabulator(value=value) >>> stream_value = {“x”: [3, 4], “y”: [“c”, “d”]} >>> tabulator.stream(stream_value) >>> tabulator.value.to_dict(“list”) {‘x’: [1, 2, 3, 4], ‘y’: [‘a’, ‘b’, ‘c’, ‘d’]}

class panel.ui.Terminal(output=None, **params)[source]#

Bases: Widget

The Terminal widget renders a live terminal in the browser using the xterm.js library making it possible to display logs or even provide an interactive terminal in a Panel application.

Reference: https://panel.holoviz.org/reference/widgets/Terminal.html

Example:

>>> Terminal(
...     "Welcome to the Panel Terminal!", options={"cursorBlink": True}
... )

Attributes:

clear
closed
subprocess: The subprocess enables running commands like ‘ls’, [‘ls’, ‘-l’], ‘bash’, ‘python’ and ‘ipython’ in the terminal.

Methods

fileno
flush
getvalue
read
readable
readlines
seekable
writable
write
writelines

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = String(constant=True, default='', readonly=True): User input received from the Terminal. Sent one character at the time.
clear = Action(allow_None=True, constant=True, label='Clear'): Clears the Terminal.
options = Dict(class_=<class 'dict'>, default={}, label='Options'): Initial Options for the Terminal Constructor. cf. https://xtermjs.org/docs/api/terminal/interfaces/iterminaloptions/
output = String(default='', label='Output'): System output written to the Terminal
ncols = Integer(constant=True, default=0, inclusive_bounds=(True, True), label='Ncols', readonly=True): The number of columns in the terminal.
nrows = Integer(constant=True, default=0, inclusive_bounds=(True, True), label='Nrows', readonly=True): The number of rows in the terminal.
write_to_console = Boolean(default=False, label='Write to console'): Whether or not to write to the server console.
_clears = Integer(default=0, inclusive_bounds=(True, True), label=' clears'): Sends a signal to clear the terminal

_output = String(default='', label=' output')

property subprocess#: The subprocess enables running commands like ‘ls’, [‘ls’, ‘-l’], ‘bash’, ‘python’ and ‘ipython’ in the terminal.

class panel.ui.TextAreaInput(*, auto_grow, cols, enter_pressed, max_rows, resizable, rows, max_length, placeholder, size, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _TextInputBase

The TextAreaInput allows entering any multiline string using a text input box.

Lines are joined with the newline character `

`.

References:

https://panel-material-ui.holoviz.org/reference/widgets/TextAreaInput.html

https://panel.holoviz.org/reference/widgets/TextAreaInput.html

https://mui.com/material-ui/react-text-field/

Example:
>>> TextAreaInput(
...     label='Description', placeholder='Enter your description here...'
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: value, max_length, placeholder, size, value_input

auto_grow = Boolean(default=False, label='Auto grow'): Whether the text area should automatically grow vertically to accommodate the current text.
cols = Integer(default=20, inclusive_bounds=(True, True), label='Cols'): Number of columns in the text input field.
max_rows = Integer(allow_None=True, inclusive_bounds=(True, True), label='Max rows'): When combined with auto_grow this determines the maximum number of rows the input area can grow.
rows = Integer(default=2, inclusive_bounds=(True, True), label='Rows'): Number of rows in the text input field.
resizable = ObjectSelector(label='Resizable', names={}, objects=['both', 'width', 'height', False]): Whether the layout is interactively resizable, and if so in which dimensions: width, height, or both. Can only be set during initialization.
enter_pressed = Event(default=False, label='Enter pressed'): Event when Shift+Enter has been pressed.

class panel.ui.TextEditor(**params: Any)[source]#

Bases: Widget

The TextEditor widget provides a WYSIWYG (what-you-see-is-what-you-get) rich text editor which outputs HTML.

The editor is built on top of the [Quill.js](https://quilljs.com/) library.

Reference: https://panel.holoviz.org/reference/widgets/TextEditor.html

Example:

>>> TextEditor(placeholder='Enter some text')

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width

value = String(default='', label='Value'): State of the current text in the editor if on_keyup. Otherwise, only upon loss of focus, i.e. clicking outside the editor, or pressing <Ctrl+Enter> or <Cmd+Enter>.
disabled = Boolean(default=False, label='Disabled'): Whether the editor is disabled.
mode = Selector(default='toolbar', label='Mode', names={}, objects=['bubble', 'toolbar']): Whether to display a toolbar or a bubble menu on highlight.
on_keyup = Boolean(default=True, label='On keyup'): Whether to update the value on every key press or only upon loss of focus / hotkeys.
toolbar = ClassSelector(class_=(<class 'list'>, <class 'bool'>), default=True, label='Toolbar'): Toolbar configuration either as a boolean toggle or a configuration specified as a list.
placeholder = String(default='', label='Placeholder'): Placeholder output when the editor is empty.
selection = Dict(class_=<class 'dict'>, default={}, label='Selection'): The current text selection in the editor, as {"text": "..."} when the user has a non-empty selection, else {}. Updates live as the selection changes.
value_input = String(default='', label='Value input'): State of the current text updated on every key press. Identical to value if on_keyup.

class panel.ui.TextInput(*, enter_pressed, max_length, placeholder, size, color, error_state, helper_text, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _TextInputBase

The TextInput widget allows entering any string using a text input box.

References:

Example:

>>> TextInput(label='Name', placeholder='Enter your name here ...')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: value, max_length, placeholder, size, value_input

enter_pressed = Event(default=False, label='Enter pressed'): Event when the enter key has been pressed.

class panel.ui.TextToSpeech(*, _voices, auto_speak, cancel, pause, resume, speak, lang, pitch, rate, voice, volume, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: Utterance, Widget

The TextToSpeech widget wraps the HTML5 SpeechSynthesis API

See https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis

Reference: https://panel.holoviz.org/reference/widgets/TextToSpeech.html

Example:

>>> TextToSpeech(label="Speech Synthesis", value="Data apps are nice")

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.widgets.text_to_speech.Utterance: value, lang, pitch, rate, voice, volume

auto_speak = Boolean(default=True, label='Auto speak'): Whether or not to automatically speak when the value changes.
cancel = Event(default=False, label='Cancel'): Removes all utterances from the utterance queue.
pause = Event(default=False, label='Pause'): Puts the TextToSpeak object into a paused state.
resume = Event(default=False, label='Resume'): Puts the TextToSpeak object into a non-paused state: resumes it if it was already paused.
paused = Boolean(constant=True, default=False, label='Paused', readonly=True): A Boolean that returns true if the TextToSpeak object is in a paused state.
pending = Boolean(constant=True, default=False, label='Pending', readonly=True): A Boolean that returns true if the utterance queue contains as-yet-unspoken utterances.
speak = Event(default=False, label='Speak'): Speak. I.e. send a new Utterance to the browser
speaking = Boolean(constant=True, default=False, label='Speaking', readonly=True): A Boolean that returns true if an utterance is currently in the process of being spoken — even if TextToSpeak is in a paused state.
voices = List(bounds=(0, None), constant=True, default=[], item_type=<class 'panel.widgets.text_to_speech.Voice'>, label='Voices', readonly=True): Returns a list of Voice objects representing all the available voices on the current device.

_voices = List(bounds=(0, None), default=[], item_type=<class 'panel.widgets.text_to_speech.Voice'>, label=' voices')

class panel.ui.Textual(object=None, **params)[source]#

Bases: Pane

The Textual pane provides a wrapper around a Textual App component, rendering it inside a Terminal and running it on the existing Panel event loop, i.e. either on the server or the notebook asyncio.EventLoop.

Reference: https://panel.holoviz.org/reference/panes/Textual.html

Example:

>>> Textual(app)

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

classmethod applies(object)[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.ThemeToggle(*, color, theme, variant, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: MaterialWidget

A toggle button to switch between light and dark themes.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

value = Boolean(allow_None=True, label='Value'): Whether the theme toggle is on or off.
width = Integer(allow_None=True, allow_refs=True, bounds=(0, None), inclusive_bounds=(True, True), label='Width'): The width of the theme toggle.
color = Selector(default='primary', label='Color', names={}, objects=['primary', 'secondary']): The color of the theme toggle.
theme = Selector(constant=True, label='Theme', names={}, objects=['dark', 'default']): The current theme.
variant = Selector(default='icon', label='Variant', names={}, objects=['icon', 'switch']): Whether to render just an icon or a toggle

width = None#

class panel.ui.TimePicker(*, color, end, error_state, format, helper_text, mode, size, start, variant, clock, hour_increment, minute_increment, second_increment, seconds, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _TimeCommon

The TimePicker allows selecting a time value using a text box and a time-picking utility.

References:

Example:

>>> TimePicker(
...     value=time(12, 59, 31), start="09:00:00", end="18:00:00", label="Time"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input._TimeCommon: clock, hour_increment, minute_increment, second_increment, seconds

value = ClassSelector(allow_None=True, class_=(<class 'datetime.time'>, <class 'str'>), label='Value'): The current value
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the time picker.
error_state = Boolean(default=False, label='Error state'): Whether to display in error state.
helper_text = String(default='', label='Helper text'): Helper text displayed below the input field.
start = ClassSelector(allow_None=True, class_=(<class 'datetime.time'>, <class 'str'>), label='Start'): Inclusive lower bound of the allowed time selection
end = ClassSelector(allow_None=True, class_=(<class 'datetime.time'>, <class 'str'>), label='End'): Inclusive upper bound of the allowed time selection
format = String(allow_None=True, label='Format'): Format to display the time. Use ‘HH:mm:ss’ to include seconds. For 12-hour clock, use ‘hh:mm a’. See dayjs formatting options. If None, will be automatically set based on clock and seconds settings. +—-+————————————+————+ | H | Hours | 0 to 23 | | HH | Hours, 2-digits | 00 to 23 | | h | Hours, 12-hour clock | 1 to 12 | | hh | Hours, 12-hour clock, 2-digits | 1 to 12 | | m | Minutes | 0 to 59 | | mm | Minutes | 00 to 59 | | s | Seconds | 0, 1 to 59 | | ss | Seconds | 00 to 59 | | a | am/pm, lower-case | am or pm | | A | AM/PM, upper-cas | AM or PM | +—-+————————————+————+
mode = Selector(default='auto', label='Mode', names={}, objects=['digital', 'analog', 'auto']): Whether to render a digital or analog clock. By default automatically switches between digital clock on desktop to analog clock on mobile.
size = Selector(default='medium', label='Size', names={}, objects=['small', 'medium', 'large']): The visual size of the time picker input.
variant = Selector(default='outlined', label='Variant', names={}, objects=['filled', 'outlined', 'standard']): The variant style of the time picker.

class panel.ui.Toggle(*, clicks, disable_elevation, end_icon, icon, icon_size, size, description_delay, attached, description, dark_theme, sx, theme_config, use_shadow_dom, button_style, button_type, color, variant, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ButtonBase

The Toggle widget allows toggling a single condition between True/False states.

References:

Example:

>>> Toggle(label='Enable feature')

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, disabled

panel_material_ui.widgets.button._ButtonLike: description, button_style, button_type, color, description_delay

panel_material_ui.widgets.button._ButtonBase: width, variant, clicks, disable_elevation, end_icon, icon, size

value = Boolean(default=False, label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
icon_size = String(default='1.8em', label='Icon size'): Size of the icon as a string, e.g. 12px or 1em.

class panel.ui.ToggleGroup(*, options, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: SingleSelectBase

This class is a factory of ToggleGroup widgets.

A ToggleGroup is a group of widgets which can be switched ‘on’ or ‘off’.

Two types of widgets are available through the widget_type argument :

‘button’ (default)
‘box’

Two different behaviors are available through behavior argument:

‘check’ (default)boolean
Any number of widgets can be selected. In this case value is a ‘list’ of objects.
‘radio’boolean
One and only one widget is switched on. In this case value is an ‘object’.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.widgets.select.SelectBase: options

panel.widgets.select.SingleSelectBase: value

class panel.ui.ToggleIcon(*, color, description_delay, active_icon, icon, icon_size, size, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: _ClickableIcon

The ToggleIcon widget allows toggling a single condition between True/False states. This widget is interchangeable with the Checkbox and Switch widget.

This widget incorporates a value attribute, which alternates between False and True.

References:

Example:

>>> ToggleIcon(
...     icon="thumb-up", active_icon="thumb-down", size="small", description="Like"
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, attached, description, disabled

panel_material_ui.widgets.icon._ClickableIcon: value, active_icon, icon, icon_size, size

width = Boolean(allow_None=True, allow_refs=True, label='Width'): Width of the widget.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): The color of the icon.
description_delay = Integer(default=1000, inclusive_bounds=(True, True), label='Description delay'): Delay (in milliseconds) to display the tooltip after the cursor has hovered over the Button, default is 1000ms.

width = None#

class panel.ui.Tooltip(object=None, **params)[source]#

Bases: Wrapper

The Tooltip displays informative text when users hover over, focus on, or tap a child element. It wraps a single child component and shows a configurable tooltip label.

References:

Example:

>>> Tooltip(Button(label="Delete"), title="Remove this item")

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.wrappers.base.Wrapper: object

arrow = Boolean(default=False, label='Arrow'): Whether the tooltip has an arrow indicating the element it refers to.
describe_child = Boolean(default=False, label='Describe child'): Whether the tooltip acts as an accessible description rather than a label. Use when the child already has a visible label and the tooltip provides supplementary information.
enter_delay = Integer(bounds=(0, None), default=100, inclusive_bounds=(True, True), label='Enter delay'): The number of milliseconds to wait before showing the tooltip. This can help avoid tooltips appearing on quick mouse passes.
follow_cursor = Boolean(default=False, label='Follow cursor'): Whether the tooltip follows the cursor position.
leave_delay = Integer(bounds=(0, None), default=0, inclusive_bounds=(True, True), label='Leave delay'): The number of milliseconds to wait before hiding the tooltip.
open = Boolean(allow_None=True, label='Open'): Explicitly control whether the tooltip is open. When None, the tooltip is managed automatically on hover/focus. Set to True or False for programmatic control.
placement = Selector(default='right', label='Placement', names={}, objects=['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']): The placement of the tooltip relative to the child element.
title = String(default='', label='Title'): The text to display inside the tooltip.

class panel.ui.TooltipIcon(**params: Any)[source]#

Bases: Widget

The TooltipIcon displays a small ? icon. When you hover over the ? icon, the value will display.

Use the TooltipIcon to provide

helpful information to users without taking up a lot of screen space
tooltips next to Panel widgets that do not support tooltips yet.

Reference: https://panel.holoviz.org/reference/indicators/TooltipIcon.html

Example:

>>> pn.widgets.TooltipIcon(value="This is a simple tooltip by using a string")

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = ClassSelector(class_=(<class 'str'>, <class 'bokeh.models.ui.tooltips.Tooltip'>), default='Description', label='Value'): The description in the tooltip.
align = Align(default='center', label='Align'): Whether the object should be aligned with the start, end or center of its container. If set as a tuple it will declare (vertical, horizontal) alignment.

class panel.ui.Tqdm(*, layout, lock, max, progress, text, text_pane, write_to_console, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: Tqdm

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, disabled

panel.widgets.indicators.Indicator: sizing_mode

panel.widgets.indicators.Tqdm: value, margin, width, layout, lock, max, progress, text, text_pane, write_to_console

class panel.ui.Transition(object=None, **params)[source]#

Bases: Wrapper

The Transition wraps a child component with a transition effect that plays when the child enters or exits. Supports multiple animation variants including fade, grow, slide, zoom, and collapse.

References:

Example:

>>> Transition(Button(label="Hello"), variant="fade", active=True)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.wrappers.base.Wrapper: object

active = Boolean(default=True, label='Active'): Whether the child is shown (with transition). Set to False to animate the child out, True to animate it in.
duration = Integer(allow_None=True, bounds=(0, None), inclusive_bounds=(True, True), label='Duration'): The duration of the transition in milliseconds. When None, the duration is automatically calculated based on the element’s size.
orientation = Selector(default='vertical', label='Orientation', names={}, objects=['vertical', 'horizontal']): The orientation of the collapse transition. Only applies when variant is ‘collapse’.
placement = Selector(default='left', label='Placement', names={}, objects=['down', 'left', 'right', 'up']): The direction the child slides in from. Only applies when variant is ‘slide’.
variant = Selector(default='fade', label='Variant', names={}, objects=['collapse', 'fade', 'grow', 'slide', 'zoom']): The type of transition animation to apply.

class panel.ui.Tree(*, checkboxes, color, multi_select, propagate_to_child, propagate_to_parent, expanded, level_indent, show_children, active, items, attached, description, disabled, dark_theme, sx, theme_config, use_shadow_dom, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: TreeLikeBase

The Tree component displays hierarchical data using a Material UI RichTreeView, with optional checkboxes and multi-selection.

Items follow the same convention as MenuList:

Each item is a dictionary with at least:

label (str): Display label of the node.

The id field is optional. When omitted, a stable internal id is generated from the item’s position, so the simplest {"label": "Node"} form works without any additional bookkeeping.

Optional item fields:

items (list): Nested children, each with the same schema.

icon (str): MUI icon name (rendered via <Icon>).

file_type (str): Helper for common icons, one of "image", "pdf", "doc", "video", "folder", "pinned", "trash".

disabled (bool): Whether the item is disabled.

selectable (bool): Whether the item is selectable.

secondary (str): The secondary text of the item.

actions (list): Actions to display on the item.

buttons (list): Buttons to display on the item.

color (str): The color of the item.

tooltip (str): The tooltip text shown on hover.

Example:

>>> pmui.Tree(
...     items=[
...         {
...             "id": "documents",
...             "label": "Documents",
...             "file_type": "folder",
...             "items": [
...                 {
...                     "id": "invoice",
...                     "label": "Invoice Q1.pdf",
...                     "file_type": "pdf",
...                 },
...                 {
...                     "id": "notes",
...                     "label": "Meeting notes.docx",
...                     "file_type": "doc",
...                 },
...             ],
...         },
...         {
...             "id": "trash",
...             "label": "Trash",
...             "file_type": "trash",
...         },
...     ],
...     active=[(0,)],
... )

Attributes:

active

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, attached, description, disabled

panel_material_ui.widgets.menus.MenuBase: margin, width, items

panel_material_ui.widgets.menus.TreeLikeBase: expanded, level_indent, show_children

value = List(bounds=(0, None), default=[], item_type=<class 'dict'>, label='Value'): The list of currently selected item dictionaries. This parameter is synchronized with the active parameter and reflects the items that are currently selected in the tree. Each item is represented as a dictionary containing its properties (e.g., ‘id’, ‘label’, etc.).
active = List(allow_None=True, item_type=<class 'tuple'>, label='Active'): The index(es) of currently selected items. Provide a list of tuples of indices, e.g. [(0, 1)] to refer to the second child beneath the first root node.
checkboxes = Boolean(default=False, label='Checkboxes'): Whether to show selection checkboxes next to each tree item.
color = Selector(default='primary', label='Color', names={}, objects=['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning', 'light', 'dark', 'danger']): Color palette key for the selected node styling.
multi_select = Boolean(default=True, label='Multi select'): Whether multiple tree items can be selected at once.
propagate_to_parent = Boolean(default=False, label='Propagate to parent'): Whether checkbox selection propagates from child nodes to parent nodes. If True, selecting a child will also select its parent(s).
propagate_to_child = Boolean(default=False, label='Propagate to child'): Whether checkbox selection propagates from parent nodes to child nodes. If True, selecting a parent node will automatically select all its child nodes. If False, selection is independent for each node.

class panel.ui.Trend(*, data, layout, neg_color, plot_color, plot_type, plot_x, plot_y, pos_color, value_change, selection, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: SyncableData, Indicator

The Trend indicator enables the user to display a dashboard kpi card.

The card can be layout out as:

a column (text and plot on top of each other) or a row (text and
plot after each other)

Reference: https://panel.holoviz.org/reference/indicators/Trend.html

Example:

>>> data = {'x': np.arange(50), 'y': np.random.randn(50).cumsum()}
>>> Trend(label='Price', data=data, plot_type='area', width=200, height=200)

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

panel.reactive.SyncableData: selection

label = String(default='', label='Label'): The label or a short description of the card.
value = Parameter(default='auto', label='Value'): The primary value to be displayed.
sizing_mode = Selector(label='Sizing mode', names={}, objects=['fixed', 'stretch_width', 'stretch_height', 'stretch_both', 'scale_width', 'scale_height', 'scale_both', None]): How the component should size itself. This is a high-level setting for maintaining width and height of the component. To gain more fine grained control over sizing, use width_policy, height_policy and aspect_ratio instead (those take precedence over sizing_mode). "fixed" Component is not responsive. It will retain its original width and height regardless of any subsequent browser window resize events. "stretch_width" Component will responsively resize to stretch to the available width, without maintaining any aspect ratio. The height of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_height" Component will responsively resize to stretch to the available height, without maintaining any aspect ratio. The width of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_both" Component is completely responsive, independently in width and height, and will occupy all the available horizontal and vertical space, even if this changes the aspect ratio of the component. "scale_width" Component will responsively resize to stretch to the available width, while maintaining the original or provided aspect ratio. "scale_height" Component will responsively resize to stretch to the available height, while maintaining the original or provided aspect ratio. "scale_both" Component will responsively resize to both the available width and height, while maintaining the original or provided aspect ratio.
data = Parameter(allow_None=True, label='Data'): The plot data declared as a dictionary of arrays or a DataFrame.
layout = Selector(default='column', label='Layout', names={}, objects=['column', 'row']): The layout of the indicator, either a column (text and plot on top of each other) or a row (text and plot after each other).
plot_x = String(default='x', label='Plot x'): The name of the key in the plot_data to use on the x-axis.
plot_y = String(default='y', label='Plot y'): The name of the key in the plot_data to use on the y-axis.
plot_color = String(default='#428bca', label='Plot color'): The color to use in the plot.
plot_type = Selector(default='bar', label='Plot type', names={}, objects=['line', 'step', 'area', 'bar']): The plot type to render the plot data as.
pos_color = String(default='#5cb85c', label='Pos color'): The color used to indicate a positive change.
neg_color = String(default='#d9534f', label='Neg color'): The color used to indicate a negative change.
value_change = Parameter(default='auto', label='Value change'): A secondary value. For example the change in percent.

sizing_mode: t.Literal['fixed', 'stretch_width', 'stretch_height', 'stretch_both', 'scale_width', 'scale_height', 'scale_both'] | None = None#

class panel.ui.TupleInput(*, enter_pressed, max_length, size, color, error_state, helper_text, variant, attached, dark_theme, sx, theme_config, use_shadow_dom, description, placeholder, serializer, type, disabled, loading, align, aspect_ratio, css_classes, design, height, height_policy, margin, max_height, max_width, min_height, min_width, sizing_mode, styles, stylesheets, tags, visible, width, width_policy, label, value, name)[source]#

Bases: LiteralInput

The TupleInput allows entering a tuple value using a text input box.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.widgets.base.Widget: height

panel.widgets.input.LiteralInput: serializer

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.widgets.base.MaterialWidget: label, margin, width, attached, description, disabled

panel_material_ui.widgets.input.MaterialInputWidget: color, error_state, helper_text, variant

panel_material_ui.widgets.input._TextInputBase: max_length, placeholder, size

panel_material_ui.widgets.input.TextInput: enter_pressed

panel_material_ui.widgets.input.LiteralInput: value_input

value = Parameter(default=(), label='Value'): The widget value which the widget type resolves to when used as a reactive param reference.
type = ClassSelector(class_=<class 'type'>, constant=True, default=<class 'tuple'>, label='Type', readonly=True): The type of the value.

type#: alias of tuple

class panel.ui.Typography(object=None, **params)[source]#

Bases: MaterialPaneBase, Markdown

The Typography component is used to display text with different styles and weights.

References:

https://mui.com/material-ui/react-typography/

Methods

applies(obj)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.pane.base.PaneBase: margin, default_layout

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.markup.Markdown: dedent, disable_anchors, disable_math, extensions, hard_line_break, plugins, renderer, renderer_options

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

panel_material_ui.pane.base.MaterialPaneBase: object

color = String(allow_None=True, label='Color'): Color of the text. Can be a Material UI theme color (e.g., ‘primary’, ‘secondary’, ‘error’, ‘warning’, ‘info’, ‘success’) or any valid CSS color value.
variant = String(allow_None=True, label='Variant'): Typography variant that defines the text styling. Common options include: - Headers: ‘h1’, ‘h2’, ‘h3’, ‘h4’, ‘h5’, ‘h6’ - Body text: ‘body1’, ‘body2’ - Other: ‘subtitle1’, ‘subtitle2’, ‘caption’, ‘overline’

classmethod applies(obj: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

class panel.ui.VSpacer(refs=None, **params)[source]#

Bases: Spacer

The VSpacer layout provides responsive vertical spacing.

Using this component we can space objects equidistantly in a layout and allow the empty space to shrink when the browser is resized.

Reference: https://panel.holoviz.org/how_to/layout/spacing.html#spacer-components

Example:

>>> pn.Column(
...     pn.layout.VSpacer(), 'Item 1',
...     pn.layout.VSpacer(), 'Item 2',
...     pn.layout.VSpacer()
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, visible

panel.viewable.Viewable: loading

sizing_mode = Parameter(constant=True, default='stretch_height', label='Sizing mode', readonly=True): How the component should size itself. This is a high-level setting for maintaining width and height of the component. To gain more fine grained control over sizing, use width_policy, height_policy and aspect_ratio instead (those take precedence over sizing_mode). "fixed" Component is not responsive. It will retain its original width and height regardless of any subsequent browser window resize events. "stretch_width" Component will responsively resize to stretch to the available width, without maintaining any aspect ratio. The height of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_height" Component will responsively resize to stretch to the available height, without maintaining any aspect ratio. The width of the component depends on the type of the component and may be fixed or fit to component’s contents. "stretch_both" Component is completely responsive, independently in width and height, and will occupy all the available horizontal and vertical space, even if this changes the aspect ratio of the component. "scale_width" Component will responsively resize to stretch to the available width, while maintaining the original or provided aspect ratio. "scale_height" Component will responsively resize to stretch to the available height, while maintaining the original or provided aspect ratio. "scale_both" Component will responsively resize to both the available width and height, while maintaining the original or provided aspect ratio.

class panel.ui.VTK(obj, **params)[source]#

Bases: object

The VTK pane renders a VTK scene inside a panel, making it possible to interact with complex geometries in 3D.

Reference: https://panel.holoviz.org/reference/panes/VTK.html

Example:

>>> pn.extension('vtk')
>>> VTK(some_vtk_object, width=500, height=500)

This is a Class factory and allows to switch between VTKJS, VTKRenderWindow, and VTKRenderWindowSynchronized pane as a function of the object type and when the serialisation of the vtkRenderWindow occurs.

Once a pane is returned by this class (inst = VTK(object)), one can use pn.help(inst) to see parameters available for the current pane

class panel.ui.VTKVolume(object=None, **params)[source]#

Bases: AbstractVTK

The VTKVolume pane renders 3d volumetric data defined on regular grids. It may be constructed from a 3D NumPy array or a vtkVolume.

The pane provides a number of interactive control which can be set either through callbacks from Python or Javascript callbacks.

Reference: https://panel.holoviz.org/reference/panes/VTKVolume.html

Example:

>>> pn.extension('vtk')
>>> VTKVolume(
...    data_matrix, spacing=(3,2,1), interpolation='nearest',
...    edge_gradient=0, sampling=0,
...    sizing_mode='stretch_width', height=400,
... )

Methods

`applies`(object)	Returns boolean or float indicating whether the Pane can render the object.
`register_serializer`(class_type, serializer)	Register a serializer for a given type of class.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.vtk.vtk.AbstractVTK: axes, camera, color_mappers, orientation_widget, interactive_orientation_widget

ambient = Number(default=0.2, inclusive_bounds=(True, True), label='Ambient', step=0.01): Value to control the ambient lighting. It is the light an object gives even in the absence of strong light. It is constant in all directions.
controller_expanded = Boolean(default=True, label='Controller expanded'): If True the volume controller panel options is expanded in the view
colormap = Selector(default='erdc_rainbow_bright', label='Colormap', names={}, objects=['KAAMS', 'Cool to Warm', 'Cool to Warm (Extended)', 'Warm to Cool', 'Warm to Cool (Extended)', 'Rainbow Desaturated', 'Cold and Hot', 'Black-Body Radiation', 'X Ray', 'Grayscale', 'BkRd', 'BkGn', 'BkBu', 'BkMa', 'BkCy', 'Black, Blue and White', 'Black, Orange and White', 'Linear YGB 1211g', 'Linear Green (Gr4L)', 'Linear Blue (8_31f)', 'Blue to Red Rainbow', 'Red to Blue Rainbow', 'Rainbow Blended White', 'Rainbow Blended Grey', 'Rainbow Blended Black', 'Blue to Yellow', 'blot', 'CIELab Blue to Red', 'jet', 'rainbow', 'erdc_rainbow_bright', 'erdc_rainbow_dark', 'nic_CubicL', 'nic_CubicYF', 'gist_earth', '2hot', 'erdc_red2yellow_BW', 'erdc_marine2gold_BW', 'erdc_blue2gold_BW', 'erdc_sapphire2gold_BW', 'erdc_red2purple_BW', 'erdc_purple2pink_BW', 'erdc_pbj_lin', 'erdc_blue2green_muted', 'erdc_blue2green_BW', 'GREEN-WHITE_LINEAR', 'erdc_green2yellow_BW', 'blue2cyan', 'erdc_blue2cyan_BW', 'erdc_blue_BW', 'BLUE-WHITE', 'erdc_purple_BW', 'erdc_magenta_BW', 'magenta', 'RED-PURPLE', 'erdc_red_BW', 'RED_TEMPERATURE', 'erdc_orange_BW', 'heated_object', 'erdc_gold_BW', 'erdc_brown_BW', 'copper_Matlab', 'pink_Matlab', 'bone_Matlab', 'gray_Matlab', 'Purples', 'Blues', 'Greens', 'PuBu', 'BuPu', 'BuGn', 'GnBu', 'GnBuPu', 'BuGnYl', 'PuRd', 'RdPu', 'Oranges', 'Reds', 'RdOr', 'BrOrYl', 'RdOrYl', 'CIELab_blue2red', 'blue2yellow', 'erdc_blue2gold', 'erdc_blue2yellow', 'erdc_cyan2orange', 'erdc_purple2green', 'erdc_purple2green_dark', 'coolwarm', 'BuRd', 'Spectral_lowBlue', 'GnRP', 'GYPi', 'GnYlRd', 'GBBr', 'PuOr', 'PRGn', 'PiYG', 'OrPu', 'BrBG', 'GyRd', 'erdc_divHi_purpleGreen', 'erdc_divHi_purpleGreen_dim', 'erdc_divLow_icePeach', 'erdc_divLow_purpleGreen', 'Haze_green', 'Haze_lime', 'Haze', 'Haze_cyan', 'nic_Edge', 'erdc_iceFire_H', 'erdc_iceFire_L', 'hsv', 'hue_L60', 'Spectrum', 'Warm', 'Cool', 'Blues', 'Wild Flower', 'Citrus', 'Brewer Diverging Purple-Orange (11)', 'Brewer Diverging Purple-Orange (10)', 'Brewer Diverging Purple-Orange (9)', 'Brewer Diverging Purple-Orange (8)', 'Brewer Diverging Purple-Orange (7)', 'Brewer Diverging Purple-Orange (6)', 'Brewer Diverging Purple-Orange (5)', 'Brewer Diverging Purple-Orange (4)', 'Brewer Diverging Purple-Orange (3)', 'Brewer Diverging Spectral (11)', 'Brewer Diverging Spectral (10)', 'Brewer Diverging Spectral (9)', 'Brewer Diverging Spectral (8)', 'Brewer Diverging Spectral (7)', 'Brewer Diverging Spectral (6)', 'Brewer Diverging Spectral (5)', 'Brewer Diverging Spectral (4)', 'Brewer Diverging Spectral (3)', 'Brewer Diverging Brown-Blue-Green (11)', 'Brewer Diverging Brown-Blue-Green (10)', 'Brewer Diverging Brown-Blue-Green (9)', 'Brewer Diverging Brown-Blue-Green (8)', 'Brewer Diverging Brown-Blue-Green (7)', 'Brewer Diverging Brown-Blue-Green (6)', 'Brewer Diverging Brown-Blue-Green (5)', 'Brewer Diverging Brown-Blue-Green (4)', 'Brewer Diverging Brown-Blue-Green (3)', 'Brewer Sequential Blue-Green (9)', 'Brewer Sequential Blue-Green (8)', 'Brewer Sequential Blue-Green (7)', 'Brewer Sequential Blue-Green (6)', 'Brewer Sequential Blue-Green (5)', 'Brewer Sequential Blue-Green (4)', 'Brewer Sequential Blue-Green (3)', 'Brewer Sequential Yellow-Orange-Brown (9)', 'Brewer Sequential Yellow-Orange-Brown (8)', 'Brewer Sequential Yellow-Orange-Brown (7)', 'Brewer Sequential Yellow-Orange-Brown (6)', 'Brewer Sequential Yellow-Orange-Brown (5)', 'Brewer Sequential Yellow-Orange-Brown (4)', 'Brewer Sequential Yellow-Orange-Brown (3)', 'Brewer Sequential Blue-Purple (9)', 'Brewer Sequential Blue-Purple (8)', 'Brewer Sequential Blue-Purple (7)', 'Brewer Sequential Blue-Purple (6)', 'Brewer Sequential Blue-Purple (5)', 'Brewer Sequential Blue-Purple (4)', 'Brewer Sequential Blue-Purple (3)', 'Brewer Qualitative Accent', 'Brewer Qualitative Dark2', 'Brewer Qualitative Set2', 'Brewer Qualitative Pastel2', 'Brewer Qualitative Pastel1', 'Brewer Qualitative Set1', 'Brewer Qualitative Paired', 'Brewer Qualitative Set3', 'Traffic Lights', 'Traffic Lights For Deuteranopes', 'Traffic Lights For Deuteranopes 2', 'Muted Blue-Green', 'Green-Blue Asymmetric Divergent (62Blbc)', 'Asymmtrical Earth Tones (6_21b)', 'Yellow 15', 'Magma (matplotlib)', 'Inferno (matplotlib)', 'Plasma (matplotlib)', 'Viridis (matplotlib)', 'BlueObeliskElements']): Name of the colormap used to transform pixel value in color.
diffuse = Number(default=0.7, inclusive_bounds=(True, True), label='Diffuse', step=0.01): Value to control the diffuse Lighting. It relies on both the light direction and the object surface normal.
display_volume = Boolean(default=True, label='Display volume'): If set to True, the 3D representation of the volume is displayed using ray casting.
display_slices = Boolean(default=False, label='Display slices'): If set to true, the orthgonal slices in the three (X, Y, Z) directions are displayed. Position of each slice can be controlled using slice_(i,j,k) parameters.
edge_gradient = Number(bounds=(0, 1), default=0.4, inclusive_bounds=(True, True), label='Edge gradient', step=0.01): Parameter to adjust the opacity of the volume based on the gradient between voxels.
interpolation = Selector(default='fast_linear', label='Interpolation', names={}, objects=['fast_linear', 'linear', 'nearest']): interpolation type for sampling a volume. nearest interpolation will snap to the closest voxel, linear will perform trilinear interpolation to compute a scalar value from surrounding voxels. fast_linear under WebGL 1 will perform bilinear interpolation on X and Y but use nearest for Z. This is slightly faster than full linear at the cost of no Z axis linear interpolation.
mapper = Dict(allow_None=True, class_=<class 'dict'>, label='Mapper'): Lookup Table in format {low, high, palette}
max_data_size = Number(default=33.554432, inclusive_bounds=(True, True), label='Max data size'): Maximum data size transfer allowed without subsampling
nan_opacity = Number(bounds=(0.0, 1.0), default=1.0, inclusive_bounds=(True, True), label='Nan opacity'): Opacity applied to nan values in slices
origin = Tuple(allow_None=True, label='Origin', length=3): Origin of the volume in the scene coordinates. If None, the origin is set to (0, 0, 0)
render_background = Color(allow_named=True, default='#52576e', label='Render background'): Allows to specify the background color of the 3D rendering. The value must be specified as an hexadecimal color string.
rescale = Boolean(default=False, label='Rescale'): If set to True the colormap is rescaled between min and max value of the non-transparent pixel, otherwise the full range of the pixel values are used.
shadow = Boolean(default=True, label='Shadow'): If set to False, then the mapper for the volume will not perform shading computations, it is the same as setting ambient=1, diffuse=0, specular=0.
sampling = Number(bounds=(0, 1), default=0.4, inclusive_bounds=(True, True), label='Sampling', step=0.01): Parameter to adjust the distance between samples used for rendering. The lower the value is the more precise is the representation but it is more computationally intensive.
spacing = Tuple(default=(1, 1, 1), label='Spacing', length=3): Distance between voxel in each direction
specular = Number(default=0.3, inclusive_bounds=(True, True), label='Specular', step=0.01): Value to control specular lighting. It is the light reflects back toward the camera when hitting the object.
specular_power = Number(default=8.0, inclusive_bounds=(True, True), label='Specular power'): Specular power refers to how much light is reflected in a mirror like fashion, rather than scattered randomly in a diffuse manner.
slice_i = Integer(default=0, inclusive_bounds=(True, True), label='Slice i'): Integer parameter to control the position of the slice normal to the X direction.
slice_j = Integer(default=0, inclusive_bounds=(True, True), label='Slice j'): Integer parameter to control the position of the slice normal to the Y direction.
slice_k = Integer(default=0, inclusive_bounds=(True, True), label='Slice k'): Integer parameter to control the position of the slice normal to the Z direction.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

classmethod register_serializer(class_type, serializer)[source]#: Register a serializer for a given type of class. A serializer is a function which take an instance of class_type (like a vtk.vtkImageData) as input and return a numpy array of the data

class panel.ui.Vega(object=None, **params)[source]#

Bases: ModelPane

The Vega pane renders Vega-lite based plots (including those from Altair) inside a panel.

Note

to use the Vega pane, the Panel extension has to be

loaded with ‘vega’ as an argument to ensure that vega.js is initialized. - it supports selection events - it optimizes the plot rendering by using binary serialization for any array data found on the Vega/Altair object, providing huge speedups over the standard JSON serialization employed by Vega natively.

Reference: https://panel.holoviz.org/reference/panes/Vega.html

Example:

>>> pn.extension('vega')
>>> Vega(some_vegalite_dict_or_altair_object, height=240)

Methods

`applies`(object)	Returns boolean or float indicating whether the Pane can render the object.
`export`(fmt[, as_pane])	Exports the Vega spec to various formats.

is_altair

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

debounce = ClassSelector(class_=(<class 'int'>, <class 'dict'>), default=20, label='Debounce'): Declares the debounce time in milliseconds either for all events or if a dictionary is provided for individual events.
selection = ClassSelector(allow_None=True, class_=<class 'param.parameterized.Parameterized'>, label='Selection'): The Selection object reflects any selections available on the supplied vega plot into Python.
show_actions = Boolean(default=False, label='Show actions'): Whether to show Vega actions.
theme = Selector(allow_None=True, label='Theme', names={}, objects=['excel', 'ggplot2', 'quartz', 'vox', 'fivethirtyeight', 'dark', 'latimes', 'urbaninstitute', 'googlecharts']): A theme to apply to the plot. Must be one of ‘excel’, ‘ggplot2’, ‘quartz’, ‘vox’, ‘fivethirtyeight’, ‘dark’, ‘latimes’, ‘urbaninstitute’, or ‘googlecharts’.

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

export(fmt: VEGA_EXPORT_FORMATS, as_pane: bool = False, **kwargs: dict) → bytes | str | dict | ModelPane[source]#

Exports the Vega spec to various formats.

The export method converts the Vega/Altair specification to different output formats. It requires vl-convert-python to be installed.

Parameters:

fmtstr: The format to export to. Must be one of ‘png’, ‘jpeg’, ‘svg’, ‘pdf’, ‘html’, ‘url’, ‘scenegraph’.
as_panebool, default False: If True, wraps the exported data in the appropriate Panel pane.
**kwargsdict: Additional keyword arguments passed to the vl-convert functions.

Returns:

bytes | str | ModelPane: The exported data in the requested format, or a Panel pane if as_pane=True.

Raises:

ImportError: If vl-convert-python is not installed.
ValueError: If an unsupported format is specified.

Examples

>>> vega_pane = Vega(spec_dict)
>>> png_bytes = vega_pane.export('png')
>>> image_pane = vega_pane.export('png', as_pane=True)

class panel.ui.Video(object=None, **params)[source]#

Bases: _MediaBase

The Video Pane displays a video player given a local or remote video file.

The widget also allows access and control over the player state including toggling of playing/paused and loop state, the current time, and the volume.

Depending on the browser the video player supports mp4, webm, and ogg containers and a variety of codecs.

Reference: https://panel.holoviz.org/reference/panes/Video.html

Example:

>>> Video(
...     'https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_640_3MG.mp4',
...     width=640, height=360, loop=True
... )

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout

panel.pane.media._MediaBase: loop, time, throttle, paused, autoplay, muted

object = ClassSelector(allow_None=True, allow_refs=True, class_=(<class 'str'>, <class 'pathlib.Path'>, <class '_io.BytesIO'>, <class 'bytes'>), default='', label='Object'): The video file either local or remote as a string or URL or as a bytes or BytesIO object.
volume = Integer(bounds=(0, 100), default=100, inclusive_bounds=(True, True), label='Volume'): The volume of the media player.

class panel.ui.VideoStream(**params: Any)[source]#

Bases: Widget

The VideoStream displays a video from a local stream (for example from a webcam) and allows accessing the streamed video data from Python.

Reference: https://panel.holoviz.org/reference/widgets/VideoStream.html

Example:

>>> VideoStream(label='Video Stream', timeout=100)

Methods

snapshot()

Triggers a snapshot of the current VideoStream state to sync the widget value.

Parameter Definitions

Parameters inherited from:

panel.widgets.base.WidgetBase: label

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.widgets.base.Widget: height, margin, width, disabled

value = String(default='', label='Value'): A base64 representation of the video stream snapshot.
format = Selector(default='png', label='Format', names={}, objects=['png', 'jpeg']): The file format as which the video is returned.
paused = Boolean(default=False, label='Paused'): Whether the video is currently paused
timeout = Number(allow_None=True, inclusive_bounds=(True, True), label='Timeout'): Interval between snapshots in millisecons

snapshot()[source]#: Triggers a snapshot of the current VideoStream state to sync the widget value.

class panel.ui.Vizzu(object=None, **params)[source]#

Bases: ModelPane, SyncableData

The Vizzu pane provides an interactive visualization component for large, real-time datasets built on the Vizzu project.

Reference: https://panel.holoviz.org/reference/panes/Vizzu.html

Example:

>>> Vizzu(df)

Methods

`animate`(anim[, options])	Updates the chart with a new configuration.
`applies`(object)	Returns boolean or float indicating whether the Pane can render the object.
`on_click`(callback)	Register a callback to be executed when any element in the chart is clicked on.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.reactive.SyncableData: selection

panel.pane.base.PaneBase: margin, default_layout, object

animation = Dict(class_=<class 'dict'>, default={}, label='Animation', nested_refs=True): Animation settings (see https://lib.vizzuhq.com/latest/reference/modules/Anim/).
config = Dict(class_=<class 'dict'>, default={}, label='Config', nested_refs=True): The config contains all of the parameters needed to render a particular static chart or a state of an animated chart (see https://lib.vizzuhq.com/latest/reference/interfaces/Config.Chart/).
click = Dict(allow_None=True, class_=<class 'dict'>, label='Click'): Data associated with the latest click event.
column_types = Dict(class_=<class 'dict'>, default={}, label='Column types', nested_refs=True): Optional column definitions. If not defined will be inferred from the data.
duration = Integer(default=500, inclusive_bounds=(True, True), label='Duration'): The config contains all of the parameters needed to render a particular static chart or a state of an animated chart.
style = Dict(class_=<class 'dict'>, default={}, label='Style', nested_refs=True): Style configuration of the chart.
tooltip = Boolean(default=False, label='Tooltip'): Whether to enable tooltips on the chart.

animate(anim: dict[str, Any], options: int | dict[str, Any] | None = None) → None[source]#: Updates the chart with a new configuration.

classmethod applies(object)[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

on_click(callback: Callable[[dict], None])[source]#

Register a callback to be executed when any element in the chart is clicked on.

Parameters:

callback: (callable): The callback to run on click events.

panel.ui.WidgetBox[source]#: alias of Paper

class panel.ui.Wrapper(object=None, **params)[source]#

Bases: MaterialComponent

Base class for wrapper components that decorate a single child element with additional visual or behavioral embellishments.

Attributes:

object

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, margin, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.custom.ReactComponent: use_shadow_dom

panel_material_ui.base.MaterialComponent: loading, dark_theme, theme_config, sx

object = Child(allow_None=True, class_=<class 'panel.viewable.Viewable'>, label='Object'): The child component to wrap.

class panel.ui.YT(object=None, **params)[source]#

Bases: HTML

YT panes wrap plottable objects from the YT library. By default, the height and width are calculated by summing all contained plots, but can optionally be specified explicitly to provide additional space.

Methods

applies(object)

Returns boolean or float indicating whether the Pane can render the object.

Parameter Definitions

Parameters inherited from:

panel.viewable.Layoutable: align, aspect_ratio, css_classes, design, height, min_width, min_height, max_width, max_height, styles, stylesheets, tags, width, width_policy, height_policy, sizing_mode, visible

panel.viewable.Viewable: loading

panel.pane.base.PaneBase: margin, default_layout, object

panel.pane.markup.HTMLBasePane: enable_streaming

panel.pane.markup.HTML: disable_math, sanitize_html, sanitize_hook

classmethod applies(object: Any) → float | bool | None[source]#

Returns boolean or float indicating whether the Pane can render the object.

If the priority of the pane is set to None, this method may also be used to define a float priority depending on the object being rendered.

panel.ui package#

Subpackages#

Submodules#

Module contents#