Skip to main content

PyPI version CI status

Collagraph 📓

Reactive user interfaces.

The word Collagraphy is derived from the Greek word koll or kolla, meaning glue, and graph, meaning the activity of drawing.

Inspired by Vue and React.

Features

Write your Python interfaces in a declarative manner with plain render functions, component classes or even single-file components using Vue-like syntax, but with Python!

  • Reactivity (made possible by leveraging observ)
  • Class components with local state and life-cycle methods/hooks
  • Single-file components with Vue-like template syntax (.cgx files)
  • Custom renderers

Here is an example that shows a counter, made with a component with Vue-like syntax:

Contents of counter.cgx:

<widget>
  <label
    :text="f'Count: {count}'"
  />
  <button
    text="bump"
    @clicked="bump"
  />
</widget>

<script>
import collagraph as cg


class Counter(cg.Component):
    def init(self):
        self.state["count"] = 0

    def bump(self):
        self.state["count"] += 1
</script>

Contents of app.py:

from PySide6 import QtWidgets
import collagraph as cg

# After importing collagraph, it's possible to import
# components directly from .cgx files
from counter import Counter

# Create a Collagraph instance with a PySide renderer
# and register with the Qt event loop
gui = cg.Collagraph(renderer=cg.PySideRenderer())
# Render the component into a container
# (in this case the app but can be another widget)
app = QtWidgets.QApplication()
gui.render(Counter, app)
app.exec()

Which looks something like this:

collagraph example

Instead of using a python file as an entry point to run components, you can run them directly using the collagraph CLI:

uv run collagraph examples/pyside/counter.cgx

For more examples, please take a look at the examples folder.

Currently there are two renderers:

It is possible to create a custom Renderer using the Renderer interface, to render to other UI frameworks, for instance wxPython.

Development

To try out Collagraph or start development, run:

# Basic dev setup (no pygfx or pyside)
uv sync
# Full dev setup
uv sync --all-groups
# Run example:
uv run python examples/pyside/layout-example.py
# Run test suite:
uv run pytest
# Install git pre-commit hooks to make sure tests/linting passes before committing
uv run pre-commit install

Editor Integration

Syntax highlighting, linting and formatting for single-file components (.cgx) is supported for Zed, VSCode and Sublime Text:

These plugins use collagraph-lsp for editor integration and ruff-cgx for formatting and linting capabilities.

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

collagraph-0.9.5.tar.gz (141.1 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

collagraph-0.9.5-py3-none-any.whl (67.3 kB view details)

Uploaded Python 3

File details

Details for the file collagraph-0.9.5.tar.gz.

File metadata

  • Download URL: collagraph-0.9.5.tar.gz
  • Upload date:
  • Size: 141.1 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.12

File hashes

Hashes for collagraph-0.9.5.tar.gz
Algorithm Hash digest
SHA256 1e021ae57e05e89a6f694543b995f67c6aba5122a045e62942de9916221ebabe
MD5 af233b63151aeee16f4402f34b02fbb8
BLAKE2b-256 bc80c9eb30c2e64bf63517ceead043e624abc49fb2b8b58e3843826b47667846

See more details on using hashes here.

Provenance

The following attestation bundles were made for collagraph-0.9.5.tar.gz:

Publisher: ci.yml on fork-tongue/collagraph

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

File details

Details for the file collagraph-0.9.5-py3-none-any.whl.

File metadata

  • Download URL: collagraph-0.9.5-py3-none-any.whl
  • Upload date:
  • Size: 67.3 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.12

File hashes

Hashes for collagraph-0.9.5-py3-none-any.whl
Algorithm Hash digest
SHA256 f3b2659bf8ec141b6a7eba40560b6edc98bc936fa234f6689fd7956e668fc793
MD5 6616595b45ef65b0b42af2d38020caf8
BLAKE2b-256 cd7cdcc9b65d147f6e6d860865a3dce04d20469ea17bd2861cd306270fb4432a

See more details on using hashes here.

Provenance

The following attestation bundles were made for collagraph-0.9.5-py3-none-any.whl:

Publisher: ci.yml on fork-tongue/collagraph

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Sentry Error logging StatusPage Status page