# `LocalLiveView.Component`
[🔗](https://github.com/software-mansion/popcorn/blob/llv-v0.1.0/local-live-view/lib/server/component.ex#L1)

Phoenix component for mounting a `LocalLiveView`.

Import this module in your application's CoreComponents:

    defmodule MyAppWeb.CoreComponents do
      import LocalLiveView.Component
      ...
    end

Then use it in your templates:

    <.local_live_view view="MyLive" />
    <.local_live_view view="Cart" items={@items} />

# `local_live_view`

Renders a `LocalLiveView` mount point.

Like `Phoenix.Component.live_component/1`, any attribute other than `view` is
forwarded to the view as the assigns of its `c:LocalLiveView.update/2`
callback. `id` is forwarded too, and additionally used as the mount point's DOM
id.

## Attributes

  * `view` (required) - the LocalLiveView module name, as a string.
  * `id` - stable element id; defaults to a server-generated random id.

## Examples

    <.local_live_view view="MyLocal" />

    <.local_live_view view="Cart" items={@items} currency="EUR" />

The second example mounts the view, calling its `update/2` with:

    %{id: _, items: items, currency: "EUR"}

# `mirror_id`

```elixir
@spec mirror_id(Phoenix.LiveView.Socket.t(), String.t()) :: String.t()
```

Assembles the deterministic `mirror_id` for a given LocalLiveView component
within a parent LiveView process.

Accepts the parent `socket` (or directly its `socket.id`), and either:
* a default ID derived from view name
* an explicit custom DOM ID provided to `<.local_live_view id="..." />`

## Examples

    # Explicit ID passed to component:
    mirror_id = LocalLiveView.Component.mirror_id(socket, "my-custom-cart")

    # Default ID derived from view name:
    mirror_id = LocalLiveView.Component.mirror_id(socket, "llv-Cart")

---

*Consult [api-reference.md](api-reference.md) for complete listing*