ui_elements is an experimental library for building stateful voice activated canvas UIs using a HTML/CSS/React-inspired syntax for python, for use with Talon.
- 20+ elements such as div,text,button,table,icon,input_text
- 90+ CSS-like properties such as width,background_color,margin,padding_left,flex_direction
- Reactive utilties state,effect, andref
- Dragging and scrolling
- Talon actions for highlighting elements, changing state, setting text
- Voice activated hints
- Skia canvas based rendering
Download or clone this repository into your Talon user directory.
# mac and linux
cd ~/.talon/user
# windows
cd ~/AppData/Roaming/talon/user
git clone https://github.com/rokubop/talon-ui-elements.gitDone! 🎉 Start learning below.
Say "elements test" to bring up the examples.
| Use Case | |
|---|---|
| 👋 Hello World | Start the tutorial → | 
| 📜 Command Cheatsheet | Start the tutorial → | 
| 🧭 Dashboard | Start the tutorial → | 
| 🎮 Game Key Overlay | Start the tutorial → | 
| 📝 TODO list | Start the tutorial → | 
actions.user.ui_elements(...)       # Provides elements to compose your UI
actions.user.ui_elements_show(...)  # Show your UI
actions.user.ui_elements_hide(...)  # Hide your UI📂 See the examples folder for code and screenshots.
While developing, you might get into a state where the UI gets stuck on your screen and you need to restart Talon. For this reason, it's recommended to have a "talon restart" command.
In a .talon file:
^talon restart$:            user.talon_restart()
Inside of a .py file:
import os
from talon import Module, actions, ui
mod = Module()
@mod.action_class
class Actions:
    def talon_restart():
        """restart talon"""
        # for windows only
        talon_app = ui.apps(pid=os.getpid())[0]
        os.startfile(talon_app.exe)
        talon_app.quit()- 
Sometimes the UI may not refresh after saving the file. Try hiding the UI, saving the file again, and showing again. 
- 
Recommend using "Andreas Talon" VSCode extension + its dependency pokey command server, so you can get autocomplete for talon user actions, and hover over hint documentation on things like actions.user.ui_elements()oractions.user.ui_elements_show().
Uses Talon's Canvas and Skia canvas integration under the hood, along with Talon's experimental TextArea for input.

