Skip to main content
A container component representing a single page within the application.

​
Fields

NameTypeDescriptionOptions
Page keyIdentifying KeyUnique identifier. It’s needed to enable navigation to this Page.-
Page modeText-
  1. Compact
  2. Wide
AccentColor--
Primary textColor--
Secondary textColor--
EmptinessColorPage background color-
Container backgroundColor--
Container shadowShadow--
SeparatorColor--
ButtonColor--
Button textColor--
Button shadowShadow--
Custom CSS classesTextCSS classes, separated by spaces. You can define classes in custom stylesheets.-

​
Events

Captures all key activity while this page is open.

def handle_keydown(state, payload):
# The payload is a dictionary containing the key code and modifier keys.
# For example,
# {
#	"key": "ArrowDown",
#	"ctrl_key": False,
#	"shift_key": False,
#	"meta_key": False
# }

key_activated = payload.get("key")
delta = 0
if key_activated == "ArrowLeft":
	delta += -10
elif key_activated == "ArrowRight":
	delta += 10

shift_key = payload.get("shift_key")
if shift_key:
	delta *= 2 # Shift makes it go faster

state["position"] += delta
Emitted when the page is opened.

def handle_page_open(state, payload):
page_key = payload
state["message"] = f"The page {page_key} has been opened."