Laioutr Release News - Juni 2026

June centered on richer content, new page types, and a substantially expanded Cockpit. Laioutr UI now supports video and audio as first-class media types, brought the EU energy label and product rating blocks to the product detail page, and added several new sections with a store locator, a glossary, and a promotion banner. Frontend Core learned to render referenced global sections, to read prop values directly from query results, and to populate SEO fields with live query data. Cockpit (Studio) gained an MCP server for AI agents, bulk translations with a restore point, and project snapshots.

Frontend Core v0.30.3 – v0.32.1

Highlights

• SEO fields with live query data: A page variant's SEO title, description, and robots tag now support {{queries.<id>.<path>}} placeholders, resolved against loaded query data in the server-rendered head — a page can now embed live data such as a product title or stock status directly in its SEO tags (see the new Studio editor fields under Cockpit below).
• Referenced global sections in page rendering: A global section reused across pages is now dereferenced into the page at render time — its queries are merged into the page's query set and its configuration is wired through. A shared section therefore renders consistently wherever it is referenced.
• Query-bound prop values (RcPropValueEntityProperty): A single prop value can now read its content from a property of a query result — for example a media field bound to a query's product image. The resolved value is coerced into the right type via coerceFieldValue, so a string URL bound to a media field automatically becomes a Media object. String-template and query-bound paths now share the same resolveEntityPath helper.
• Installed apps in the reflect endpoint: The reflect endpoint now exposes installedApps — every app registered via registerLaioutrApp (including Frontend Core itself), keyed by name with its version and page wrapper. The Cockpit uses this to gate features that require a specific framework or app version.
• Link resolver as a filter hook: frontend-core:link-resolver:resolve is now a filter hook. It runs after a link is resolved, pre-seeded with the resolved path, and can transform that value for any link type (for example appending query parameters) — threaded across multiple handlers. Existing handlers keep working unchanged.
• CalendarDate value type (Core Types): An ISO YYYY-MM-DD date with no time and no timezone, exported from @laioutr-core/core-types/common — for whole-day values such as a location's opening or reopening date.

Bug Fixes & Improvements

• Fixed: Handler-set hook results for the frontend-core:link-resolver:* and select-page-variant hooks were dropped because the value was read before Nuxt's deferred handlers ran. Results are now read synchronously and take effect reliably.
• Fixed: The reflect endpoint (/api/laioutr/reflect) returned an empty orchestr on cold Vercel serverless instances. It now triggers an SSR render whenever the live reflection is empty.
• Unknown RcPropValue.type values are now treated as "no value" (with a deduplicated console.warn) instead of leaking the raw value object to downstream renderers. Newer studio configurations degrade gracefully on older Frontend Core deployments rather than crashing.
• Fixed: The new SEO placeholders were resolved against the live, route-reactive query map instead of a stable snapshot, which could cause a server-side 500 on data-bound pages because the resolution ran outside Nuxt's async context. SEO title, description, and robots now read a snapshot captured at setup time; sections themselves still use the live query map, so client-side filtering, sorting, and pagination keep re-fetching correctly.

Laioutr UI v2.2.3 – v2.4.3

Highlights

• Video and audio as media types: <Media> is now a dispatcher — alongside images, it renders video and audio via native MediaVideo and MediaAudio renderers. A new playback mode consolidates the attribute clusters: playback="background" is a one-switch decorative loop (autoplay, muted, loop, playsinline on, controls off), while interactive is the native player. <Media> exposes v-model:paused so consumers can position their own pause control (WCAG 2.2.2), and it suppresses autoplay under prefers-reduced-motion: reduce. Banner and media sections now accept both image and video assets. For HLS/DASH or a custom player, the built-in renderer can be overridden per media type.
• EU energy label on the product detail page: The new BlockProductDetailEnergyLabel renders the EU energy efficiency label — an inline energy-class badge that opens the full label in a lightbox, plus an optional link to the product data sheet. It is backed by the new ProductVariantEnergyLabel canonical component, defined per variant (each EU label is registered in the EPREL registry against the model / GTIN). Adapters populate the component where a variant carries a label; without data, the block renders nothing.
• Product rating on the product detail page: BlockProductDetailRating shows the average star rating, the rating value (x/maxRating), and the review count. The product detail query fetches the ProductRating component for this.
• Store locator and location pages: SectionLocationFinder resolves locations via the new canonical Location entity and renders a finder with a map, a configurable heading, and a Google Maps Map ID — including a slot for manually curated BlockLocationCard instances. SectionLocationDetail renders the full location page with map, header, image gallery, info list, and description. New page types /locations and /locations/:slug ship alongside.
• Glossary section: SectionGlossaryList renders an alphabetical A–Z index of name and link entries, sourced either from a bound data source (any app registering a Glossary entity) or from a manually authored list. The heading falls back to a localized default when left empty.
• Promotion banner with countdown: PromotionBanner and its SectionPromotionBanner bring headings, an optional countdown, a copy button for promo codes, a CTA, and surface presets (default, pale, bright, solid) or freely chosen per-slot colors. New alongside them: the Countdown component and the useCountdown composable, whose unit labels are localized and plural-aware automatically via Intl.NumberFormat.
• Link target selectable in Studio: Editors can now choose _self or _blank for editorial links via the new linkTargetOptions field across a range of blocks and sections (including BlockButton, BlockCategoryCard, header logos, SectionBrandList, SectionTopBar). target and rel props are plumbed through the link components. Existing configurations are unchanged (_self).
• Localized unit prices: The new $unitPrice formatter renders a UnitPrice as a localized price / reference string (e.g. 13.99 € / 100 ml), composing the existing $money and $measurement formatters.

Bug Fixes & Improvements

• Pagination now emits SEO-correct sequence semantics: rel="prev" / rel="next" only on the edges where the target page actually exists. On the first page the previous control renders as a <button> (no href), and on the last page the next control does the same — so crawlers don't follow dead links.
• Fixed: Inset banners (BannerBasic, BannerShowcase, BannerIntegrated, BrandHero) lost their rounded corners on tall elements.
• Fixed: Several props were silently dropped because they didn't match the target API — including the icon in FeaturePillList, opening the off-canvas filter in FilterBar, and variant headings in the location and opening-status components.
• OpeningStatus components and composables now use the shared now clock.

Notes for Developers (Breaking Changes)

• BrandList → AlphabeticalIndex: BrandList has been replaced by the generic AlphabeticalIndex component (an alphabetically grouped link list with a heading and an optional per-item count). Upgrade: import from #ui/components/AlphabeticalIndex/AlphabeticalIndex.vue, rename the brands prop to items, and pass heading explicitly.
• SectionBrandList: The brandLinks schema field is renamed to items, with a new heading text field added. Stored configurations referencing the old field name will not migrate automatically.
• PromotionBanner moved: PromotionBanner now lives in @laioutr-core/ui (promo codes are commerce-domain). The PromotionBanner/types import from ui-kit is gone — import from @laioutr-core/ui instead.

Cockpit (Studio) June 2026

Highlights

• Studio MCP server for AI agents: The Studio MCP server can now be set up under Organization → API Keys, letting AI assistants such as Claude Desktop or Cursor connect directly to a project. On connecting, agents receive a short Studio primer and can fetch the deeper data-model reference on demand; every accessible project appears as its own catalog entry, and mutation results report the current catalog version. Through the MCP server, agents can now: place an existing global section onto a page, move or reorder a section between header, body, and footer or onto another page, move a block between local sections, add items to list props (slides, cards, rows), discover a project's reusable global sections, and set a page's SEO title and description or rename a page variant.
• Bulk translations: The Translations page now accepts a translations JSON import to bulk-update text translations. A restore point is saved automatically before each import, so a bad import can be undone. Export now covers only translatable fields and requires a published frontend. Translations for several languages can also be written in a single edit.
• Populate SEO fields with live data: A page's SEO title and description can now be populated with live query data as inline variables (such as a product title), and the robots tag can be set from a preset (index/noindex/nofollow) or bound to live query data — resolved server-side via the new Frontend Core placeholders described above. The corresponding insert buttons are enabled only when the connected frontend supports it; otherwise an upgrade hint is shown.
• Project snapshots & restore: Project versions can now be saved as a snapshot and restored directly from Studio; a snapshot is created automatically before each migration.

Bug Fixes & Improvements

• Fixed: Studio showed an unsaved state simply from opening a project.
• Fixed: An occasional "statement timeout" error when loading organizations and projects.
• Fixed: Retrying an action after a transient error now actually re-attempts it instead of replaying the same result.
• Fixed: AI agents connected over MCP could temporarily no longer list the Studio tools; tool and data-model descriptions now again accurately reflect what the server supports.
• Fixed: Section and block reordering was not reflected in the MCP page tree.
• Fixed: Media fields did not reliably survive a translations export followed by a re-import.
• Fixed: Importing translations occasionally disconnected editors; images now import correctly.
• Fixed: Props set when adding a section or block were lost instead of being saved.
• Fixed: Studio no longer saves a broken page when an invalid dropdown value is set — the value is now rejected at write time.

Notes for Developers (Breaking Change in the MCP Server)

• project_list now lists each project's locales; the separate locales resource has been removed. Setting a translatable field via the MCP server now requires specifying locales; extra locales on a non-translatable field are ignored with a warning. Relevant for anyone who has built custom agent integrations against the Studio MCP server.

Find the full changelogs with all technical details at docs.laioutr.io/getting-started/changelogs.

Related resources (Hub-Link-Audit)

Learn more: Agentic Frontend Management Platform, Composable Visual Page Builder, Composable Digital Experience Platform.