trame-components

2.5.0 verified Mon Apr 27 auth: no python

Core components for trame widgets, providing a set of reusable UI components for building web-based scientific visualization applications. Current version 2.5.0 is under active development with frequent releases.

pip install trame-components

Common errors

error ImportError: cannot import name 'Vuetify3' from 'trame.widgets' ↓

cause trame-components version mismatch: vuetify3 submodule is only available in v2.0+.

fix

Upgrade trame-components to >=2.0: pip install 'trame-components>=2.0'

error ModuleNotFoundError: No module named 'trame' ↓

cause The base `trame` package is not installed; trame-components depends on it but doesn't install it automatically.

fix

Install trame: pip install trame

error TypeError: 'NoneType' object is not callable when using server.start() ↓

cause Missing server instance: `server.start()` was called without creating a server via `get_server()`.

fix

Add server = get_server() before using with layout: or server.start().

Warnings

breaking trame-components v2.0 broke all Vuetify2 imports. Use `trame.widgets.vuetify3` instead of `vuetify2`. ↓

fix Replace `from trame.widgets.vuetify2 import ...` with `from trame.widgets.vuetify3 import ...`

deprecated The `trame.html` and `trame.core` modules are deprecated. Use explicit widget imports (e.g., `from trame.widgets.vuetify3 import VContainer`). ↓

fix Migrate to direct widget imports from `trame.widgets.*`

gotcha State variables must be defined before use in templates. Accessing `state.some_var` without initialising it in the state dictionary will raise an error. ↓

fix Always initialise state: `state.some_var = 'default'` before using in v-model or expressions.

Imports

Vuetify3

wrong

from trame.widgets import Vuetify3

correct

from trame.widgets.vuetify3 import Vuetify3

Wrong import path: submodule vuetify3 missing

VContainer

wrong

from trame.widgets.vuetify2 import VContainer

correct

from trame.widgets.vuetify3 import VContainer

Vuetify2 components were renamed in trame-components >= 2.0

Quickstart

Minimal trame app with Vuetify3 components

from trame.app import get_server
from trame.ui.vuetify3 import SinglePageLayout
from trame.widgets.vuetify3 import VBtn, VTextField

server = get_server()
state, ctrl = server.state, server.controller

with SinglePageLayout(server) as layout:
    with layout.content:
        VTextField(v_model=('name', 'World'), label='Name')
        VBtn(click='alert(`Hello ${name}`)', text='Greet')

server.start()