graphical apps development
via PatrickJS/awesome-cursorrules
Build graphical LLM applications by chaining reusable Elements with typed Ports and Payloads.
What is graphical apps development?
Pyllments is a Python framework for constructing graphical and API-based LLM applications through composable Elements connected via Ports. Use this rule when building modular, interactive UI components for LLM workflows where extensibility and clean interfaces are priorities.
- Structure applications as Elements (Components with Model and Views) connected through typed input/output Ports
- Use Payload objects to pass typed data between Elements following an observer pattern
- Build UI layers with Panel for visualization and Param for parameterized, reactive classes
- Organize elements with clear file structure separating logic (Model), UI (Views), and styling (CSS)
- Leverage Langchain integration for LLM-specific workflows and operations
- Write NumPy/SciPy-style docstrings for consistency and clarity
Applies to
File patterns this rule matches.
Rule definition (reference)
Source of truth, from the repository.
Project Synopsis
Pyllments is a Python library for building graphical and API-based LLM applications through chaining together Elements in a potentially cyclic graph. Elements and Payloads are a type of Components. A Component is composed of a Model and Views. The Model handles the underlying data and logic, while the Views are the UI components that are used to display display the interactive UI used to interact with the Model.
An Element is a type of Component that is responsible for a specific function. For instance, an Element can handle the LLM selection and generation by making calls to LLM providers. Another Element may handle the chat interface, whose Model would store the chat message history, and the Views would be the text boxes and buttons used to interact with the chat interface. Elements are meant to connect to other Elements through Ports. All that is necessary to link Elements together is to link the output port of one Element to the input port of Another. Each output port may have unlimited input ports it connects to, and each input port may have unlimited output ports it connects to. The ports follow an observer pattern where the output port is the subject and the input port is the observer. The subject notifies the observers when a certain event that we set within the Element is triggered.
In order to connect an input and and output port, they need to be setup in a manner that sends and receives the same type of Payload. A Payload is also a Component with a Model as well as views responsible for the display logic. Elements may receive payloads and use methods of the Payload to generate the views for the UI. The sending Element is responsible for packing data into the Payload.
I am currently working on making this a fully-fledged framework.
Project Organization
Here is an example of the file structure of an individual element:
chat_interface:
- init.py
- chat_interface_element.py
- chat_interface_model.py
- css:
- buttons.css
- column.css
- input.css
Primary Libraries Used
- Panel is used to create the visualization layer and run the GUI. Views tend to consist of Panel objects which can be styled with Python and CSS.
- Param is used to create parameterized classes which help create parameters that handle type validation, default values, constraints, and most importantly, reactivity(setting event handlers to catch changes).
- Langchain is responsible for the specific functions pertaining to incorporating LLM workflows.
Development Priorities
Pyllments code is prioritized on being developer-friendly, where extensibility and modularity are first-class citizens. Elements should be customizeable with clean and intuitive interfaces. It should also be easy to create new elements depending on the needs of the developer.
Documentation
Docstrings should use a NumPy/SciPy style.
Related rules
HarmonyOS ArkTS component structure, state management, layout, and accessibility patterns.
Access real-time news, bias analysis, market data, and options pricing via Helium MCP in Cursor.
TypeScript development rules for Hashgraph Online AI agents on Hedera using RegistryBrokerClient.
Create clear, step-by-step how-to documentation for non-technical users.
Expert HTML, Tailwind CSS, and vanilla JavaScript code generation with modern best practices.
HTMX development setup with best practices and folder structure guidance.
