Known constraints
Product boundaries and setup-time behavior in Nuxt Photo 1.0.
Known dimensions are required
Every photo needs accurate intrinsic width and height values before it is
rendered. Nuxt Photo does not measure images in the browser. Calculate missing
dimensions during upload or server-side ingestion.
The photo model contains images only
Video and mixed-media slides are outside the Nuxt Photo 1.0 model. Build those experiences separately instead of representing them as photos.
A single Photo is strict
Photo throws when its item is invalid. validation="drop" exists only on
collection components: PhotoAlbum, PhotoGroup, and PhotoCarousel.
Lightbox capability is decided at setup
The lightbox option on ready-made components is read when the component is
created. Remount the component to change that capability. Transition settings
can change while the component remains mounted.
PhotoGroup uses one explicit collection
PhotoGroup.photos owns identity and navigation order. Descendant components
register thumbnail and slide behavior, but do not add items to the collection.
One lightbox owns the modal state
Only one provider owns focus and page isolation at a time. Opening another lightbox closes the current owner.
Structure CSS is required
Use css: 'all' for the included appearance or css: 'structure' with your own
theme. With css: 'none', your application must recreate all structural album,
carousel, lightbox, focus, and transition CSS.
Carousel options are intentionally limited
The public behavior options are loop, dragFree, direction, and Nuxt
Photo's autoplay settings. Embla plugins, private methods, and arbitrary Embla
options are not extension points.
Runtime direction changes must be explicit
PhotoCarousel reads inherited text direction when it mounts. Bind its
direction prop when locale direction can change without a remount.
Reduced motion can change animation behavior
Nuxt Photo follows prefers-reduced-motion. It replaces movement-heavy
transitions with a short fade and reacts when the media query changes.
A failed image keeps its placeholder
placeholderSrc stays visible after the main image fails. It resets when the
adapter produces a different image request and disappears after that request
loads successfully.
These constraints keep server rendering, navigation order, and modal ownership predictable. Use Troubleshooting for symptom-based fixes.