Skip to content

Releases: pushery/wirekit

v2.16.0

Choose a tag to compare

@pushery pushery released this 20 Jul 02:35
7bb6dae

Minor release. Two new components plus a broad set of accessibility, internationalization, and composition improvements, and a new form-control border token that meets WCAG non-text contrast. Everything here is additive and backward-compatible.

Added

  • Status Tiles. N entities as colored status tiles read at a glance — a fleet light, with an optional count-per-intent legend. Status never rides on color alone: every tile carries a distinct icon shape and a screen-reader status word, and an href makes a tile a keyboard-operable link.
  • Stream. A primitive for streaming text output over Server-Sent Events, with the hard parts handled once — a single live region announces that a response is generating and then the result (never re-read on every token), prefers-reduced-motion reveals the buffered text at once, and a dropped connection or an explicit stop resolves to a defined terminal state. A simulate mode types a fixed string out from a local timer for a demo or typewriter effect with no endpoint.
  • Badge wrap. A long label can now wrap across lines: the pill grows with the text instead of the second line spilling below its surface.
  • Image Gallery per-item overlays. An itemOverlay render-callback layers a control — a badge, a report button, a required content label — over each thumbnail as a sibling of the zoom trigger, so the thumbnail still opens the lightbox while the overlay stays interactive.
  • Command Palette server-side search. The palette now emits a debounced query event on every keystroke, so you can drive a server-backed search — feed the query to a Livewire property and re-render the results — instead of only filtering a fixed list.
  • Slider valueTextMap. The spoken aria-valuetext can now be decoupled from the visual tick labels — show numeric ticks yet announce semantic meaning (1 => 'Low').
  • Countdown completion event. The countdown now dispatches an event when it expires and exposes its done state, so it can drive a sibling control without running a second clock.
  • Sidebar item badge. sidebar.item gained a badge prop for a trailing unread counter — the common notifications / inbox nav pattern.
  • Table row headers. table.th gained a headerScope prop so a per-row header cell can be scope="row", previously reachable only as a column header.
  • Tooltip focusableTrigger. A tooltip on a non-interactive trigger — an icon, a text span — can now be reached by keyboard instead of being hover-only.
  • Design tokens. The --gap-wk-* scale is now the full xs2xl ladder (matching --space-wk-*), and a new --color-wk-border-strong token gives form controls a contrast-compliant resting border. See design tokens.
  • Error-announcement config default. A new wirekit.a11y.announce_error config key lets an app that runs its own live region opt every form control out of the built-in error announcement in one place, instead of per control.

Fixed

  • Form-control borders now meet WCAG non-text contrast (1.4.11). Input, select, textarea and checkbox drew their resting edge at 1.29:1 in the light theme — effectively invisible against the field fill. They now use the dedicated --color-wk-border-strong token (≥3:1 in both themes); the decorative border on cards and dividers is unchanged.
  • Fonts no longer fall back to system fonts silently in production. A configured but unpublished bundled font now leaves a visible signal in every environment plus a throttled server-side warning, instead of vanishing to system fonts with no trace outside local development.
  • Editor binding and custom toolbar. wire:model on the editor now binds the textarea — it previously landed on the wrapper and lost input — and a custom toolbar slot now renders instead of being overridden by the default set.
  • Notification Center announcements. New notifications are now announced to screen readers through a polite live region.
  • Pagination nested-route 404. The component now emits absolute hrefs, so a paginator under a nested Livewire route no longer 404s; and every user-visible string — body text and aria-labels — is now translatable.
  • Combobox attribute forwarding. Every caller attribute now reaches the role="combobox" input rather than a roleless wrapper.
  • Translatable strings. The "opens in new tab" screen-reader hint on the link component and its siblings, the threshold band labels and reset-cadence notes on the usage meter, and the copy-confirmation text on the clipboard button, are now translatable instead of hardcoded English.
  • Checkbox description association. A caller aria-describedby is now merged with the checkbox's own hint / error target instead of being silently dropped.
  • Table sort headers. A sortable column in Livewire sort mode no longer shows a pointer cursor across the whole cell when only the button is the click target.
  • Contrast helper parses rgb(). WcagContrast::parseToLinearRgb() now understands rgb() / rgba() color strings, not only #hex and oklch().

v2.15.0

Choose a tag to compare

@pushery pushery released this 19 Jul 12:00
8dfa457

Feature release. A broad set of marketing, ecommerce, control and mobile components — the blocks a landing page, a store, and a mobile app-shell were missing — plus SEO structured-data builders and a drop-in dark-mode toggle. All additive; one existing component (Carousel) was rebuilt on a more robust foundation with no API break.

Added

  • Pricing Table. The plan grid — tiers, features, a highlighted plan, monthly/annual framing — the shape a SaaS pricing page needs, composed from tokens rather than a bespoke layout.
  • Testimonial. A cited quote with author, role, avatar and an optional read-only star rating (announced as a single record, never an operable control), plus a grid to lay several out.
  • FAQ. An accordion of questions that emits FAQPage JSON-LD derived from what it actually rendered — the structured data can't drift from the visible copy because it is generated from it.
  • Logo Cloud and Team Section. The two marketing blocks WireKit had no exemplar for — a "trusted by" logo strip and a people grid.
  • Announcement Banner. A dismissible page-edge bar (top or bottom) with an optional inline CTA. The dismissal persists by default; set persist off for a session-only bar that reappears next visit instead of being remembered.
  • Bento Grid. An asymmetric feature showcase — cells span a real column/row ladder and collapse to a single stacked column when the grid itself is narrow (a container query — a sidebar, a card, a split view — reflowing on its own width, independent of the viewport), reclaiming their spans once it is wide again; an unknown span degrades to a normal cell rather than a broken track claim.
  • Mockup. Frame chrome — browser, window, code, phone and tablet — for screenshots and demos. Every surface, border and shadow is a design token, so the frame follows the theme; the chrome is decorative and hidden from assistive technology.
  • Product Card. The ecommerce keystone — image, price with an optional compare-at, rating, stock state, and a call-to-action.
  • Button Group. Welds adjacent controls (buttons, an input + button) into one unit — inner radii collapsed to a single seam, RTL-safe via logical properties.
  • Toggle Button. An aria-pressed toggle — a button that stays down, for a single on/off state. Opt into self-toggle and it flips its own pressed state on click (a formatting toolbar with no wiring); the controlled form — the pressed state lives in your app — stays the default.
  • Indicator. A corner-badge positioner — a count or dot that rides the corner of any element (an avatar, an icon button) via logical insets.
  • Radial Progress. A circular progress ring — a real progressbar with the value announced, drawn from tokens. Opt into animate to sweep the fill from empty on first paint and animate later value changes instead of snapping, gated by prefers-reduced-motion.
  • Bottom Nav and FAB. The two mobile app-shell pieces WireKit was missing — a fixed bottom tab bar (opt into interactive to track the current tab client-side: clicking a tab marks it active with no page load) and a floating action button that fans out into secondary actions (keyboard-operable).
  • Theme Controller and Swap. Drop-in dark mode — a control that toggles the theme with no wiring and no flash-of-wrong-theme, and a swap primitive that cross-fades between two states (the sun/moon icon being the canonical case).
  • Schema builders. Typed PHP builders for schema.org JSON-LD (the same engine the FAQ block uses to derive its FAQPage data), for emitting structured data from your own components.

Changed

  • Carousel was rebuilt on native scroll-snap. The slider now rides the browser's own scroll-snap instead of a JavaScript transform, so it is smoother, keyboard- and touch-native, and lighter; autoplay gained a stop button, and a perView shows 2–4 slides at once. No API break — existing usage keeps working.

Fixed

  • Progress — label and value no longer jam at narrow widths. The label / value row gained a column gap so the two can never touch.

v2.14.0

Choose a tag to compare

@pushery pushery released this 17 Jul 23:25
a0eba66

Feature release. The Chat / AI Conversation suite: six new components for building chat transcripts and AI-native surfaces, plus fade, delivery-status, readability, animated-progress and copy-affordance additions to existing components. All additive — nothing changes for existing components — with one accessibility fix to the rating component.

Added

  • Shimmer. An animated highlight that sweeps across the letterforms of live text — the "Generating response…" / "Thinking…" affordance for AI streaming and long-running status. Unlike a skeleton's block shimmer, this shimmers the real copy rather than a gray placeholder, so the text stays readable to a screen reader throughout. Bind active to a streaming flag and it turns itself on and off with no conditional markup and no JavaScript. The sweep is disabled under prefers-reduced-motion and its duration is a token you can override per instance.
  • Conversation. A stick-to-bottom transcript scroller for chat and streaming. It keeps the newest message in view while a response streams in, but the moment the reader scrolls up to read history it stops yanking them back down — and offers an announced "jump to latest" with an unread count instead. New content appended above the fold never shifts what the reader is looking at. The viewport is a labeled live region, reachable and scrollable by keyboard.
  • Attachment. The display card for a file on a message — icon, name, human-readable size and type — and an attachment-group that lays several out, stacked by default or as a scroll-snapped row. Sizes and types are formatted server-side, so nothing about the file depends on JavaScript. Fills the existing attachments slot on the message component. An opt-in animate gives the uploading bar a shimmer sweep so an in-flight upload reads as active; it is disabled under prefers-reduced-motion.
  • Chat Marker. The in-thread meta row for the things in a conversation that are not messages — a streaming or tool-call status, a system note, a "New messages" divider, a timestamp separator. Presentational by design: compose a link or button inside it when a marker needs to be actionable.
  • Message Typing. The three-dot "someone is composing" indicator. Given an author, it shows that person's avatar and name above the dots — indented like their message — so the reader sees who is typing. It carries a visually-hidden "… is typing" text so a screen-reader user loses nothing when the dots freeze under prefers-reduced-motion, and it is a static announcement rather than a per-keystroke flicker that would flood assistive tech.
  • Assistant Message. The AI turn — the assistant-side counterpart to the human chat bubble, and WireKit's first AI-native surface. Assistant, user and system roles (a system turn is a centered notice), a streaming state, a prose body, an optional model chip on assistant turns, a collapsible reasoning disclosure, and footer chips and actions slots. The streaming body is announced a complete sentence at a time rather than character by character, so a screen reader hears finished thoughts, never a half-clause re-read on every token. An intent tints the bubble when a turn IS a state — an error answer (danger), a caution (warning), a confirmation (success) — with the body text kept regular so the tint reads as a marker, never as low-contrast colored text.

Changed

  • Scroll Area gained an edge fade. A fade option masks the overflow edges along the scroll axis so the content itself dissolves toward the edge — adapting to any background automatically, since there is no colored overlay to keep in sync with the surface. The fade lifts entirely when a child near the edge takes keyboard focus, so a focused control is never faded out from under the reader. Edge depth is a token.
  • Message gained a delivery-status ladder. A status prop shows sending → sent → delivered → read (or failed), the affordance a messaging UI needs for a bubble's own state. It follows the convention every messaging app shares — one check for sent, two checks for delivered, two accent checks for read — and is never carried by color or glyph alone: each rung states its own wording for assistive technology. Pass statusTime and the glyph carries a tooltip with the exact moment ("Read at 9:15 AM"), woven into its accessible text too so a screen reader gets the time without the hover.
  • Progress gained an optional animated fill. An animation overlays motion on a determinate bar — stripes (a barber-pole) or shimmer (a light sweep) — the "work in flight" affordance for uploads and streaming. The bar's value is unchanged and the motion is disabled under prefers-reduced-motion.
  • Clipboard Button gained a bare icon-only mode. A compact copy glyph — muted gray at rest, popping to the success green on copy — for action rows where a full labeled button is too heavy. Requires an aria-label since there is no visible text to name it.
  • Prose gained readability presets. A preset picks a reading rhythm — tighter line spacing for chat, roomier line spacing for long-form reading, larger text for emphasis — on top of the existing prose styling. (This is the vertical rhythm only; the separate measure prop that clamps line length is untouched.)

Fixed

  • Rating: a read-only rating is now a record, not a switched-off control. A read-only rating used to render a hidden form field and announce itself as a radio group with several stars simultaneously "selected" — so a page showing a dozen product scores carried a dozen stray form fields, and a screen reader heard a broken multi-select. A read-only rating is now announced as a single image with one readable value ("4.2 out of 5 stars"), carries no form field, and exposes nothing to operate. The interactive rating — where the reader gives a score — now implements its full documented keyboard model: both arrow axes move the selection, and Home / End jump to the first and last star.

v2.13.0

Choose a tag to compare

@pushery pushery released this 16 Jul 18:49
2cf3f39

Feature release. Four new components for user-content media and running deadlines — three Display (countdown, image, image gallery) and a reusable media-viewer Overlay (lightbox). All additive — nothing changes for existing components.

Added

  • Countdown. A live countdown to an absolute deadline, ticking down client-side with no polling. The display scales from years down to seconds (a far-off deadline reads in years and days, not tens of thousands of days), or you can pick an exact set of units. It colors itself when the deadline is near (urgent) and again once it has passed (overdue). Large values get locale-aware thousands separators, an optional segments variant renders each unit as a labeled box that animates when its value changes — either the whole box pulses (animate="box", the default) or only the changing number flashes color (animate="text"), both honoring prefers-reduced-motion — and it stays accessible — the ticking value is exposed to screen readers as a stable deadline label, not announced every second.
  • Image. A content image rendered as a semantic <figure> with required alt text, native lazy loading, an optional CLS-safe ratio box (space reserved before the image loads), cover/contain fit, and an optional caption. Renders only — a signed, ACL-protected download URL works unchanged.
  • Image Gallery. A responsive grid of content images with an accessible lightbox. Clicking a thumbnail opens a focus-trapped dialog that navigates with the arrow keys, closes on Escape, and returns focus to the thumbnail it opened from. Set :lightbox="false" for a plain responsive grid.
  • Lightbox. The gallery's zoom overlay as a standalone component you can drive from any trigger and any layout — images, video, and embeds. It is a focus-trapped dialog that steps through its items with the arrow keys, closes on Escape, and returns focus to whatever opened it. Open it from a control inside the component or from anywhere on the page via a wirekit-lightbox-open event; configure looping, captions, and a per-instance backdrop color. Media fills most of the viewport (very wide and very tall images, and video, scale to ~90% of the screen with their aspect ratio intact); off-screen slides load lazily and show a loading spinner until they resolve; captions sit on a semi-transparent dark scrim for readability and wrap centered under the media. The Image Gallery now builds on it internally.

v2.12.0

Choose a tag to compare

@pushery pushery released this 16 Jul 11:28
5d8f770

Feature release. A wave of accessibility and Livewire-integration improvements across the form controls, plus new infrastructure icons. Every change defaults to the current behavior, so upgrading is safe and requires no code changes.

Added

  • Combobox — accessible name. New label, hideLabel, and ariaLabel props, matching Select and Multi-Select. A combobox in a facet toolbar can now carry a proper accessible name without hand-rolling an external <label for>.
  • Form controls — announced validation errors. Every error-rendering control (Select, Checkbox, Radio, Textarea, Toggle, Number Input, OTP Input, Password Input, Multi-Select, Combobox, Tags Input, Time Picker, Date Picker, Editor) now renders its error message in a polite live region by default, so a server-side validation error that appears after submit is announced even when focus has moved to the submit button. Opt out per field with :announce-error="false".
  • Slider — labeled-mark announcements. When marks is a labeled map ([0 => 'Low', 100 => 'High']), the slider now exposes the label to assistive tech via a live aria-valuetext and shows it in the value tooltip — a screen reader announces "Low" instead of "0". Plain sliders are unchanged.
  • Button — scoped loading spinner. New loading-target prop scopes the loading spinner and disable to the button's own Livewire action, so on a polling page the spinner no longer flashes on every wire:poll refresh or unrelated action.
  • Table — keyboard-operable Livewire sort. New sort-action prop on <x-wirekit::table.th> wraps the header label in a real <button> with a focus ring, so server-side sorting is operable by keyboard, not mouse only.
  • Message — accessible actions and localized time. The actions slot now reveals on hover or keyboard focus (and actions-reveal="always" keeps it visible for touch). The timestamp is now locale-aware — 9:15 PM for English, 21:15 for German and other 24-hour locales — with a time-format prop for an explicit format.
  • Icon — infrastructure glyphs. New aliases across every base preset: server, database, cloud, shield / shield-check, inbox, bolt, and refresh.
  • Theming — auditable tinted surfaces. Pushery\WireKit\Theming\WcagContrast now parses color-mix(in srgb, …) values, so the soft (tinted) surfaces used by Badge, Alert, and Stat can be contrast-checked directly.

Fixed

  • Brand — responsive logo no longer vanishes. <x-wirekit::brand> built its responsive show/hide classes by splicing the breakpoint into the class name at render time, which a Tailwind v4 CSS-first build cannot discover — so the desktop logo could silently disappear after a WireKit upgrade. The classes are now emitted as full literals.
  • Segmented Control, Rating, OTP Input — wire:model modifiers. These controls dropped wire:model modifiers (.live / .blur / .debounce) when forwarding the binding to their hidden input, so a live binding never updated. All modifier forms are now forwarded.
  • Inputinputmode no longer warns. Standard HTML attributes like inputmode, enterkeyhint, autocapitalize, and spellcheck no longer log a spurious "unknown prop" warning.
  • Icon — no more crash on an unknown alias. An unknown icon name in a browser request now renders an inert placeholder and logs the problem, instead of throwing and taking down the whole page. Console and test runs still fail fast so typos surface early.
  • Combobox — the dropdown now matches its size. A large or small combobox opened a dropdown whose option rows stayed medium-sized; the option padding and text now scale with the size prop so the open panel matches its trigger.
  • Combobox — no stray focus warning. Clicking the chevron to close the dropdown could leave keyboard focus on the decorative toggle, which browsers flag as focus trapped on an aria-hidden element. Focus now always returns to the input.
  • Button — a joined input abuts its button cleanly. When an <x-wirekit::input> is joined to a trailing button inside <x-wirekit::button.group>, the field's seam-side corner is now squared and its duplicated seam border removed, so the input meets the button flush instead of showing a rounded edge and a doubled border.

v2.11.1

Choose a tag to compare

@pushery pushery released this 03 Jul 23:06
398e98c

Patch release. Documentation-only clarifications to the Getting Started guide. No component code changed — upgrading is optional.

Documentation

  • Getting Started — JavaScript pipeline. Clarified that resources/js/app.js and resources/js/bootstrap.js already ship with a standard Laravel app, so there is nothing to create there. The one thing that matters is not importing Alpine yourself — Livewire provides it.
  • Getting Started — layout example. The example layout now shows the @wirekitStyles directive in <head> alongside @wirekitScripts, so pasting it verbatim loads WireKit's design tokens (colors, spacing, radii, shadows).
  • Getting Started — your first Livewire page. Clarified that make:livewire scaffolds empty files whose contents you then replace with the example shown, and that the example route replaces Laravel's default welcome route instead of adding a second route for /.

v2.11.0

Choose a tag to compare

@pushery pushery released this 02 Jul 19:10
cb6a3ad

Minor release. Overridable navigation-landmark and heading-level semantics, screen-reader-announced form errors, and an engine-neutral rich-text-editor factory — all backward-compatible.

Added

  • <x-wirekit::sidebar> gains a label prop for the navigation landmark's accessible name. It defaults to "Sidebar"; override it — or pass aria-label / aria-labelledby directly — when a page has more than one navigation landmark, so assistive technology can tell them apart. No duplicate or conflicting name is emitted.
  • <x-wirekit::empty-state> gains a level prop for the title's heading level. Choose 16 (default 3) to fit the surrounding document outline so screen-reader heading navigation stays correct. The default still renders an <h3>.
  • <x-wirekit::field> and <x-wirekit::input> announce validation errors to screen readers. The error message now renders as a polite ARIA live region by default, so an error that appears dynamically — for example after a Livewire round-trip — is announced without the focus having to return to the field. Opt out with announceError="false" when your page runs its own live region.

Changed

  • The <x-wirekit::editor> rich-text component now uses an engine-neutral window.wirekitEditor(config) factory. The previous window.tiptapEditor name keeps working as a deprecated alias, so upgrading is a one-line rename in your editor bootstrap.

v2.10.0

Choose a tag to compare

@pushery pushery released this 01 Jul 09:25
b3164b0

Minor release. An opt-in accent stripe for callouts, a readable line-length measure for prose, a refined intent treatment on KPI tiles and stage cards, and refreshed marketing-blueprint copy — all backward-compatible.

Added

  • <x-wirekit::callout> gains an opt-in stripe prop. It adds a one-sided accent bar and is off by default (the plain callout is the alert-style tinted border). Pass stripe to bring the bar back.
  • <x-wirekit::prose> gains a measure prop — a readable line-length clamp. Long-form text caps at a comfortable ~65 characters per line by default; use measure="wide" (~78ch) for a roomier column or measure="none" for the full container width. Themeable via the new --measure-wk token.

Changed

  • <x-wirekit::callout> no longer shows the accent stripe by default. The plain callout is now the balanced tinted border; add the new stripe prop to restore the one-sided bar.
  • <x-wirekit::stat> and <x-wirekit::stage-card> intent treatment is now a balanced 4-sided tinted border (previously a one-sided left bar). The intent color cue is unchanged — only the shape is refined.
  • <x-wirekit::prose> now clamps long-form text to a readable measure by default. Existing prose wraps at ~65ch; set measure="none" to restore the previous full-container-width behavior.

Documentation

  • Refreshed the marketing-blueprint demo copy (hero, testimonials, feature, and landing previews) with neutral, concrete placeholder content.

v2.9.0

Choose a tag to compare

@pushery pushery released this 29 Jun 16:13
18a9274

Minor release. A local MCP server, discoverable AI tooling, new SaaS icon aliases, a dropdown form-submit affordance, dev-mode composition + prop warnings, and documentation — all backward-compatible.

Added

  • A local MCP server — php artisan wirekit:mcp-serve. AI coding assistants spawn it over stdio and query the component catalog live while authoring, so the editor reads real prop signatures and design tokens instead of guessing them. It is local and read-only — no port, no daemon, no network, always version-matched to your installed WireKit. See the AI-tooling guide for copy-paste editor config and the CLI reference.
  • A tool-neutral AGENTS.md at the package root. It points AI coding assistants at the wirekit:list / wirekit:show / wirekit:icons discovery commands, so assistants that do not read the Cursor rules still find the tooling. The README gains a matching "Using WireKit with AI assistants" section.
  • A Laravel Boost skill manifest — php artisan wirekit:boost-skills. Publishes .boost/wirekit.json — every component with its real props + defaults, the theme presets, the customization decision tree, and the CLI — so a Laravel-Boost-aware editor autocompletes WireKit. Auto-generated from the installed package, so it cannot drift from your version; re-run to refresh after an upgrade. See the CLI reference.
  • Five high-frequency icon aliases now resolve out of the box on every base presetsettings, gear, dashboard, billing, and credit-card. Previously settings / gear / dashboard / billing had no glyph on a base-only setup. See <x-wirekit::icon>.
  • <x-wirekit::dropdown.item> now honors a caller type. A no-href item still defaults to type="button", but type="submit" lets it drive a wrapping <form> — the canonical CSRF logout for non-Livewire apps. A "Sign out & form actions" recipe documents both the Livewire and the form-submit paths.
  • A hideLabel prop on <x-wirekit::input>, <x-wirekit::select>, and <x-wirekit::textarea>. It keeps the real <label> (so the control keeps its accessible name) but renders it visually hidden — for a compact field in a toolbar or header, where the default stacked label reads wrong.
  • Dev-mode warnings for two silent mistakes (debug only, silent in production). <x-wirekit::card> warns when content is placed directly in it with no card.body (it would otherwise render flush against the border), and a misspelled prop on a prop-rich component — the form controls plus button, badge, alert, stat, callout, progress, and tooltip — now logs a "did you mean" hint instead of silently doing nothing.

Changed

  • The shipped .cursor/rules/wirekit.mdc AI-authoring rules were corrected to match the shipped API. Several prop names (the layout primitives take gap, not space; the button takes intent), token names, and a composition example had drifted from the components they describe. The file now matches the real surface and gains the card.body and app-shell composition patterns, with a guard that keeps it from drifting again.

Fixed

  • A caller aria-label now reaches the actual control on more form components. On <x-wirekit::otp-input>, <x-wirekit::rating>, <x-wirekit::tags-input>, and <x-wirekit::file-upload>, a caller aria-label previously landed on the outer wrapper, where assistive technology ignored it. It now names the role-bearing element — the role="group" / role="radiogroup", or the text / file <input> — so screen readers announce it. A class-level guard now locks this across every single-interactive-element component.

Documentation

  • Setup and reference guidance for the most common first-build mistakes. A consolidated "Styles not applying?" troubleshooting checklist and a "using WireKit tokens in your own Tailwind classes" note on the integration and customization pages; a Spacing-and-Layout token section on the Design Tokens page; a typography signpost steering body copy to <x-wirekit::text>; a note that navbar and the app-shell are alternative layout shells; and corrected prop / token references across several component pages. The AI-tooling guide now features the local MCP server with copy-paste editor config, and component reference pages lead with their live examples — usage notes and prop conventions moved below.

v2.8.1

Choose a tag to compare

@pushery pushery released this 25 Jun 09:01
24f80a7

Patch release. A Livewire 4 layout-setup documentation correction plus a matching installer-hint fix — fully backward-compatible.

Fixed

  • wirekit:install now names the correct layout path in its no-layout hint. When no app layout exists and Livewire's livewire:layout command is unavailable, the installer's fallback instruction pointed at resources/views/components/layouts/app.blade.php. On a fresh Livewire 4 app the layout actually belongs at resources/views/layouts/app.blade.php (Livewire 4's default layouts::app namespace), so the hint now names that path.

Documentation

  • The Getting Started layout walkthrough now matches what the installer actually creates. It recommended resources/views/components/layouts/app.blade.php and pinned the example page-component to #[Layout('components.layouts.app')] — but on a fresh Livewire 4 app (no Starter Kit), wirekit:install, via Livewire's own livewire:layout, creates resources/views/layouts/app.blade.php (Livewire 4's default layouts::app). Following the old steps left #[Layout] pointing at a file that was never created. The page now frames the two real cases (fresh app vs. Starter Kit), drops the #[Layout] attribute from the example (Livewire's default already wraps the component in the created layout), and clarifies that make:livewire scaffolds empty stubs you fill in and that the route is yours to add.