skills.rest
vaadin
vaadinOFFICIAL
Explore all skills by this author →
Website𝕏@vaadinGitHub

signals

Manage reactive UI state and propagate updates across Vaadin Flow components.

11|3|Updated Feb 26, 2026
Search Tags:#signals#push#transactions#reactive-state#vaadin#component-binding#signal-factory
One-click install
npx skills add https://github.com/vaadin/claude-plugin --skill signals
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: signals
Source: https://github.com/vaadin/claude-plugin/tree/main/skills/signals
Command: npx skills add https://github.com/vaadin/claude-plugin --skill signals

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Vaadin Signals removes the need for manual listener management and brittle update code by providing a reactive, transactional, and thread-safe approach to UI state in Vaadin 25 Flow. It makes it simple to keep component views, element properties, and cross-user shared state consistent and automatically updated while handling lifecycle attach/detach and concurrency concerns.

Core Features & Use Cases

  • Reactive primitive signals (ValueSignal, NumberSignal) and collections (ListSignal, MapSignal, NodeSignal) for representing application state.
  • SignalFactory scoping for IN_MEMORY_SHARED (cross-user, JVM-scoped) and IN_MEMORY_EXCLUSIVE (per-instance) usages, with guidance on when to enable Push.
  • ComponentEffect bindings and computed signals to derive values and bind state to component properties, text, classes, attributes, and styles with automatic lifecycle management.
  • Transactions and atomic update patterns to group changes, use peek() for non-tracking reads, and avoid modifying objects in place.
  • Use cases: shared counters and collaborative widgets, signal-backed form editors, computed derived displays, and element-level bindings for dynamic styling and visibility.

Quick Start

Create a ValueSignal or NumberSignal with SignalFactory (choose IN_MEMORY_SHARED for shared state or IN_MEMORY_EXCLUSIVE for local state), bind it to your components with ComponentEffect.bind or ComponentEffect.effect, and use Signal.runInTransaction for atomic multi-signal updates.

Frequently Asked Questions about signals

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I manage reactive UI state in Vaadin 25 Flow without manual listeners?▼

Reactive UI state in Vaadin 25 Flow is managed using signals to automatically propagate updates across components. This removes the need for manual listener management by providing thread-safe, transactional state handling for component bindings and shared state.

Can I share reactive state across users in a Vaadin application?▼

Cross-user shared state in a Vaadin application is supported using the IN_MEMORY_SHARED scope from SignalFactory. You must enable Push when using IN_MEMORY_SHARED to ensure reactive updates propagate correctly across different user sessions.

How do I bind reactive state to element properties and styles in Vaadin?▼

Reactive state binds to element properties, text, classes, attributes, and styles in Vaadin using ComponentEffect bindings. Computed signals derive values automatically while handling component lifecycle attach and detach events.

How do I update multiple signals atomically in a Vaadin Flow application?▼

Multiple signals update atomically in a Vaadin Flow application by wrapping changes in a transaction using Signal.runInTransaction. Transactions group multiple signal modifications into a single atomic update to maintain state consistency.

What reactive data structures are available for Vaadin component state?▼

Reactive data structures for Vaadin component state include primitive signals like ValueSignal and NumberSignal, and collections like ListSignal, MapSignal, and NodeSignal. These structures represent application state and support computed derived values.

Do I need to enable Push for local reactive state in Vaadin?▼

Push is not required for local reactive state in Vaadin using the IN_MEMORY_EXCLUSIVE scope, which limits state to a per-instance basis. Push is only necessary when sharing state across users with the IN_MEMORY_SHARED scope.

Related Skills

Explore More Software Engineering Skills→
marcushellbergmarcushellberg
6

signals

Manage reactive UI state with Vaadin Flow Signals.

Community
Advanced
ProfPowellProfPowell
4

state-management

Manage Web Component state with reactive stores, signals, and undo/redo.

Community
Intermediate
atomicojsatomicojs
1.3k

atomico-hooks-props

Provide bidirectional reactive access to Atomico component properties.

Official
Intermediate
vaadinvaadin
11

client-side-views

Build client-side React/Hilla views with file-based routing and type-safe Java endpoints.

Official
Advanced