PHPackages                             vortexphp/live - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. vortexphp/live

ActiveLibrary

vortexphp/live
==============

Server-driven Live components (Livewire-style) for Vortex PHP

0.0.1(today)01↑2900%MITPHPPHP ^8.2

Since Apr 5Pushed todayCompare

[ Source](https://github.com/vortexphp/live)[ Packagist](https://packagist.org/packages/vortexphp/live)[ RSS](/packages/vortexphp-live/feed)WikiDiscussions main Synced today

READMEChangelog (1)Dependencies (2)Versions (2)Used By (0)

vortexphp/live
==============

[](#vortexphplive)

Server-driven Live components (Livewire-style POST + signed snapshot) with a small vanilla client runtime (`resources/live.js`). Public markup uses the `live:*` attribute namespace documented below.

For product direction and parity notes, see [ROADMAP.md](ROADMAP.md).

Installation
------------

[](#installation)

- Require the package; allowlist component FQCNs in app config (`live.components`).
- Register the Twig extension (`live_mount`) in your app.
- Expose the client script (copy `resources/live.js` to your web root or run your project’s sync step after `composer install`).

**Config (example)**

```
// config/live.php
return [
    'components' => [
        App\Live\Components\Counter::class,
    ],
];
```

**Layout**

```

```

**Twig extension (your app wiring may differ)**

```
$twig->addExtension(new \Vortex\Live\Twig\LiveExtension());
```

Component island (server-rendered root)
---------------------------------------

[](#component-island-server-rendered-root)

`live_mount('App\\Live\\Components\\MyComponent', props)` wraps the view in a root element with:

AttributePurpose`live-root`Marks the island boundary.`live-state`Signed snapshot token (HMAC).`live-url`POST endpoint for actions / sync (e.g. `/live/message`).`live-csrf`CSRF token for POST JSON body.**Twig**

```
{{ live_mount('App\\Live\\Components\\Counter', { count: 0 }) }}
```

**Rough HTML shape** (attributes are emitted by PHP; don’t paste `live-state` by hand)

```

  {# your component twig #}

```

All `live:click`, `live:submit`, and `live:model.live` / `live:model.lazy` behavior applies **inside** this subtree.

Actions (server)
----------------

[](#actions-server)

SyntaxMeaning`live:click="methodName"`On click, POST `action: methodName` with `args` from `live:args`. Element must be inside `[live-root]`.`live:submit="methodName"`On form submit, POST that action; merge includes bound fields + `FormData`.`live:args='[1,"a"]'`Optional JSON **array** only. Invalid JSON or non-array → action is not sent. Single argument: `live:args='[0]'`.Methods are invoked on the PHP component with `ReflectionMethod::invokeArgs` — arity must match.

**Button + args**

```
+1
+5
First row
```

**Twig loop**

```
{% for item in items %}
  Remove
{% endfor %}
```

**Form**

```

  Save

```

Model binding modes
-------------------

[](#model-binding-modes)

AttributeBehavior`live:model.local="prop"`Client-only until the next server round-trip; value is merged from the DOM when an action/submit/sync runs.`live:model.live="prop"`Debounced `POST` with `sync: true` (re-render, no named action).`live:model.lazy="prop"`Sync on `change` / commit-style events.Supported controls: `input` (text, checkbox, radio, number, …), `textarea`, `select`.

**Examples**

```

{{ body }}

  Light
  Dark

```

Validation
----------

[](#validation)

SyntaxMeaning`live-error="fieldName"`Node whose `textContent` is filled when the server returns `validation_failed` + `errors[fieldName]`.**Example**

```

  Save

```

Local mirrors
-------------

[](#local-mirrors)

SyntaxMeaning`live-display="prop"`Text node mirroring the formatted value of `live:model.local="prop"` on the same island (updated as the user types).**Example**

```

```

Conditional visibility (`live:show` / `live:hide`)
--------------------------------------------------

[](#conditional-visibility-liveshow--livehide)

Inside a **`live-root`** island, toggle `hidden` from the current value of any bound property (`live:model.local` | `.live` | `.lazy` with the same name).

SyntaxMeaning`live:show="prop"`Visible when `prop` is **truthy** (non-empty string, non-zero number, `true`, checked checkbox, etc.).`live:hide="prop"`Hidden when `prop` is **truthy**.Use **one** of the two per element (not both on the same node). Updates run when the bound control changes and once after bindings init.

**Falsy:** `null`, `undefined`, `false`, `''` / whitespace-only string, `0`.

**Example**

```

Thanks for agreeing.
Please check the box.
```

Scope templates (JSON in DOM)
-----------------------------

[](#scope-templates-json-in-dom)

AttributeMeaning`live:scope='{"path":{"nested":true}}'`JSON object on a container.``For each object key or array index at `path`, clone template content as siblings.`live:slot="key"``value`Runs on load and after each Live HTML swap on the new root. Add `live:model.local` inside cloned nodes if you need bindings.

**Example**

```

    :

```

### Arrays / lists in local state

[](#arrays--lists-in-local-state)

There is no single `live:model` for a JSON array. Use one of:

1. **Flat props** — `item0_title`, `item1_title`, … plus Twig `{% for %}` and `live:model.local="item{{ i }}_title"`.
2. **`live:scope` JSON** — client-side templated list; good for display/expansion; binding to snapshot still uses flat props if you merge to the server.

**Twig: fixed slots**

```
{% for i in 0..2 %}

{% endfor %}
```

Internal attributes (do not hand-author)
----------------------------------------

[](#internal-attributes-do-not-hand-author)

The runtime may set `data-live-model-bound`, `data-live-template-id`, and `data-live-from-template` on nodes it manages.

Source file
-----------

[](#source-file)

- Client: `resources/live.js` (single IIFE, no bundler).

###  Health Score

37

—

LowBetter than 83% of packages

Maintenance100

Actively maintained with recent releases

Popularity2

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity35

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Unknown

Total

1

Last Release

0d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/54aca816e08a169a1615996a7ebed1c12cd35688999f8573a9c5c677aa9ea597?d=identicon)[bobicloudvision](/maintainers/bobicloudvision)

---

Top Contributors

[![bobicloudvision](https://avatars.githubusercontent.com/u/69676022?v=4)](https://github.com/bobicloudvision "bobicloudvision (13 commits)")

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/vortexphp-live/health.svg)

```
[![Health](https://phpackages.com/badges/vortexphp-live/health.svg)](https://phpackages.com/packages/vortexphp-live)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)