Skip to content

Timer

A component that emits an event repeatedly at specified time intervals, enabling time-based refresh.

Fields

NameTypeDescriptionOptions
Interval (ms)NumberHow much time to wait between ticks. A tick is considered finished when its event is handled.
ActiveTextWhether the timer should trigger tick events.
  • Yes
  • No
AccentColor
Custom CSS classesTextCSS classes, separated by spaces. You can define classes in custom stylesheets.

Events

NameDescriptionUsage
ss-tickEmitted when the timer ticks.
def handle_timer_tick(state):

  # Increment counter when the timer ticks

  state["counter"] += 1

Low code usage

This component can be declared directly in Python, using backend-driven UI.

python
ui.Timer(content={
        "intervalMs": 0.0, # Union[float, str] 
        "isActive": "yes", # str [yes, no]
        "accentColor": "", # str 
        "cssClasses": "", # str 
    },
    handlers={
        "ss-tick": handle_event,
    }
)
A function, in this example handle_event, should be implemented in your code to handle events.
python
def handle_event(state, payload, context, ui):
  pass

Reference