### Widget text overhaul
#### Current
- Numbers and text overlap
- Combo boxes truncate the value before the label
#### Proposed
**By default, widgets will now truncate their labels before their
values.**
https://github.com/user-attachments/assets/296ea5ab-d2ff-44f2-9139-5d97789e4f12
- Changes the way widget text is rendered, calculated, and truncated
- Truncation now applies in a standard way to the following widgets:
- Text
- Combo
- Number
- Centralises widget draw routines in base class
### Config
```ts
// Truncate **both** widgets and labels evenly
LiteGraph.truncateWidgetTextEvenly = true
// Swap the default from truncating labels before values, to truncating values first (restores legacy behaviour)
// truncateWidgetTextEvenly **must** be `false`.
LiteGraph.truncateWidgetValuesFirst = true
```
### API / interfaces
- Adds rich `Rectangle` concrete impl., with many methods and helpful
accessors (e.g. `right`, `bottom`)
- Actually _improves_ performance due to switch from Float32Array to
Float64Array
- Impact vs plain Float64Array was not detectable outside of a 2M+
instantiation-loop with random data
- Lazy `pos` & `size` `subarray` properties
- Adds `ReadOnlySize`
- Adds higher-level text draw functions to abstract the nitty gritty in
a performant way (binary search)
- Resolves Comfy-Org/ComfyUI_frontend/issues/457
Adds trackpad gesture support to canvas interaction. Supports:
- Pinch to zoom
- Two-finger panning
Feature is off by default. Also by default, the browser user-agent must
include "Mac" (even if the feature has been enabled).
```ts
// Enable mac trackpad gestures
LiteGraph.macTrackpadGestures = true
// Disable the default Mac user-agent check
LiteGraph.macGesturesRequireMac = false
```
Adds a global API to notify devs / users of deprecated features.
- Custom callbacks may be added
- By default, remembers message text and only sends each message once
- Sends to console.warn by default
```ts
// Add a custom notification when a warning is encountered
const warnMessage = (message: string, source?: object) => {
addToast({ message, detail: object })
}
LiteGraph.onDeprecationWarning.push(warnMessage)
```
```ts
// Debugging flag. Repeats deprecation warnings every time they are reported.
// May impact performance.
LiteGraph.alwaysRepeatWarnings = true
```
Generate a warning
```ts
import { warnDeprecated } from "@/utils/feedback"
warnDeprecated(
"[DEPRECATED] graph.oldFeature() will be removed from Litegraph. " +
"Please use graph.newFeature() instead. https://helpful.site/faq",
objectThatCausedThis
)
```
Currently, when node defs are refreshed (e.g., by pressing "r"
shortcut), every single node def is logged, which is useless when
there's hundred of nodes and clutters console. This PR changes to only
log those messages when in debug mode.
- Uses CanvasPointer click to open context menu (formerly occurred on
`pointerdown`)
- Frees up right-click & drag to be used by future features
- Right-clicking a reroute now selects the reroute, using the same
selection logic used for right-clicking nodes
Example usage with ComfyUI_frontend, via console / devtools:
```ts
const inputIndicators = new InputIndicators(app.canvas)
// Dispose:
inputIndicators.dispose()
```
- Updates UUIDv4 generator
- Adds a unique id & revision support to graphs
- `revision` to be incremented downstream (e.g. on save)
- `id` automatically assigned if not provided
Workaround originally implemented when converting to ES modules, but is
now redundant.
`DEFAULT_EVENT_LINK_COLOR` confirmed unused in code search (litegraph
events).
Minor clean up and graph null deref checks.
Minor runtime change: due to optional chaining, it is possible a
downstream consumer is catching this extremely rare behaviour on purpose
and handling it.
Removes formatters' ability to print code that goes to a new line, but
uses no braces to delineate.
It becomes more difficult to follow when using JS-style indents (two
spaces).
No effort required - braces added by auto-fixer.
- Prefer comments above lines over end-of-line comments
- Makes auto-formatting easier
- Subjective, but it is generally easier to read in JS
- Standardises JSdoc format
- Auto-fixes for many issues (applies on save w/ESLint extension)
- Part of effort to convert LGraphNode to TS strict
- Adds some small runtime changes - no impact expected, but it is
possible
- Runtime changes are in separate commits from compile-time type changes
- Risk of downstream impact is low
- Unused, loose typing
- Code search shows usage is limited to code copy & paste of litegraph
code
- So long as the `searchbox_extras` property exists and is empty, there
is no change to downstream consumers
* [API] Remove unused LiteGraph APIs
These features have not been maintained, and would require refactoring / rewrites. As code search revealed them to be unused, they are being removed.
- addNodeMethod
- compareObjects
- auto_sort_node_types
* Udpate API.md
- Replaces traditional incrementing `for` loops and `forEach()` calls with modern `for..of` syntax
- Improves readability
- Semantic checking used; not expecting issues to arise from this portion
* remove scaling of context menus based on graph scale
* deprecate scale in interface
* Add option to restore old context scaling behaviour
Revert "remove scaling of context menus based on graph scale"
This reverts commit d91ecaa86c671aea272844c3900a18da1af7bf01.
* Update test expectations
---------
Co-authored-by: filtered <176114999+webfiltered@users.noreply.github.com>
* Implement snap to grid
- Moves positioning logic to LGraph
- Simplifies code
- Adds Pointer API to alt-clone node
- Removes always_round_positions, replaced by always snap to grid (default size is 1 when always snapping)
Fix refator error
* Fix group items snapped without group
* Allow snapping of all items
- Add snapToGrid to Positionable
- Impl. on all types
- Deprecated: alignToGrid is now a wrapper
* Fix test import alias, update expectations
* Prevent desync of before / after change events
Adds ability to perform late binding of finally() during drag start.
* nit - Refactor
* Fix unwanted snap on node/group add
* nit - Doc
* Add shift key state tracking for snap to grid
Private impl., no state API as yet.
* Add snap guides rendering
Nodes, reroutes
* Optimisation - reroute rendering
Fixes exponential redraw
* Add snap guidelines for groups
* Add position rounding feature
Replaces previous impls. which only worked on some items, and were triggered when unexpected e.g. clicking a node that hadn't been moved.
Update test expectations
* Narrow TS types - readonly
* nit - Clean up, Doc
* nit - Clean up legacy accessors
Marks as deprecated
* Fix TS type - IContextMenuOptions.scale
* [Refactor] dist2 for use in pointer API
* Add CanvasPointer - API for pointer events
Add TS strict types
Add final click drag distance math
Add option to retain events
* nit - Rename
* nit
* Remove Subgraph - unused & not maintained
* Remove live_mode
Unused, not maintained.
* Update README
Remove live_mode reference
* Update delete selected - include reroutes & groups
* Bypass link menu if alt/shift pressed
* Remove old dragged_node interface
Incomplete impl. - unused.
Superceded by selectedItems
* Fix top/left edge of rectangles not in hitbox
* [Refactor] Match function names to interface names
* Add interface to find widgets by Point
LGraphNode.getWidgetOnPos
* Add widget search param - includeDisabled
* nit - Doc
* Rewrite canvas mouse handling
- Rewrites most pointer handling to use CanvasPointer callbacks
- All callbacks are declared ahead of time during the initial pointerdown event, logically grouped together
- Drastically simplifies the alteration or creation of new click / drag interactions
- Click events are all clicks, rather than some processed on mouse down, others on mouse up
- Functions return instead of setting and repeatedly checking multiple state vars
- Removes all lines that needed THIRTEEN tab indents
* Split middle click out from processMouseDown
* Use pointer API for link menus
* Narrow canvas event interfaces
* Fix canvas event types
Replaces original workarounds with final types
* Refactor - deprecated isInsideRectangle
* Add canvas hovering over state
- Centralises cursor set behaviour
- Provides simple downstream override
* nit
* [Refactor] Use measure functions
* Add double-click API to CanvasPointer
a
* nit - Doc
* Allow larger gap between double click events
* Rewrite double-click into CanvasPointer actions
* Improve double-click UX
Prefer down events over up events
* Add production defaults
* Add middle-click handling
* Remove debug code
* Remove redundant code
* Fix add reroute alt-click adds two undo steps
* Fix click on connected input disconnects
Old behaviour was to disconnect, then recreate a new link on drop.
* Add module export: CanvasPointer
* nit
* Add LGraph state POCO
Moves last_link_id, last_node_id and creates same for group and reroute
fix import
* Add new serialisation to LGraph
Add LGraph schema 1
Remove reroute from old serialised graph
Remove brittle inherited types
Ensure stale links are not kept when clearing graph
* Add serialisable exports
* Ensure valid LGraph.state during deserialise
