# `PhoenixDatastar.Elements`
[🔗](https://github.com/RicoTrevisan/phoenix_datastar/blob/v0.2.0/lib/elements.ex#L1)

Functions for patching and removing DOM elements via SSE.

    sse |> patch("<div>New content</div>", selector: "#target")
    sse |> patch("<p>Inner</p>", selector: "#target", mode: :inner)
    sse |> remove("#target")

# `patch`

```elixir
@spec patch(PhoenixDatastar.SSE.t(), String.t(), keyword()) :: PhoenixDatastar.SSE.t()
```

Patches DOM elements with new HTML content.

## Options

- `:selector` - CSS selector for target elements (required)
- `:mode` - Patch mode (default: :outer)
- `:use_view_transitions` - Enable View Transitions API (default: false)
- `:event_id` - Event ID for client tracking
- `:retry` - Retry duration in milliseconds

## Examples

    # Replace entire element
    sse |> patch("<div>Content</div>", selector: "#target")

    # Update inner HTML only
    sse |> patch("<p>New text</p>", selector: ".content", mode: :inner)

    # Append to element
    sse |> patch("<li>Item</li>", selector: "ul", mode: :append)

    # With view transitions
    sse |> patch("<div>Smooth</div>", selector: "#box", use_view_transitions: true)

# `remove`

```elixir
@spec remove(PhoenixDatastar.SSE.t(), String.t(), keyword()) ::
  PhoenixDatastar.SSE.t()
```

Removes elements from the DOM by selector.

## Options

- `:event_id` - Event ID for client tracking
- `:retry` - Retry duration in milliseconds

## Example

    sse
    |> PhoenixDatastar.Elements.remove(".temporary")
    |> PhoenixDatastar.Elements.remove("#old-content")

---

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