Documentation
Table of Contents
Quantum Viewports provides a system for managing viewport‑specific block styles in the WordPress editor and on the frontend.
It handles storage, state resolution, CSS generation, and inspector integration.
This documentation describes the internal implementation of the system. It is focused on how the core components work and how they interact.
What this covers
- The Quantum Viewports datastore and state layout
- Action interfaces and reducer behavior
- Selectors and derived state
- Rendering style data to CSS on both editor and server
- Inspector panel components and indicator integration
Familiarity with React, JavaScript, and PHP in WordPress context is recommended.
Recommended reading order
Here is a quick UI overview:
- Keyframes UI
- Indicator UI
Start with these examples to connect your Theme Components:
- How to connect your BlockStyle components to Viewports
- How to integrate the Viewport IndicatorPanelItem
For a deep dive into the structure of Quantum Viewports, read: