Toggle

Event

lorem, duis, donec: pressed changes from LiveView or the client.

On pressed change (Server)

Time	Source	Toggle id	Value
No event yet. Interact with the components to receive new events

    <.toggle
  class="toggle"
  controlled
  pressed={false}
  on_pressed_change="toggle_pressed_changed"
>
  lorem
</.toggle>

    def handle_event("toggle_pressed_changed", %{"pressed" => pressed} = params, socket) do
  IO.inspect(params, label: "toggle_pressed_changed")
  {:noreply, socket}
end

On pressed change (Client)

Time	Source	Toggle id	Value
No event yet. Interact with the components to receive new events

    <.toggle
  id="toggle-on-pressed-change-client"
  class="toggle"
  on_pressed_change_client="toggle-client-changed"
>
  lorem
</.toggle>

    const el = document.getElementById("toggle-on-pressed-change-client");
el?.addEventListener("toggle-client-changed", (e) => console.log(e.detail));

    const el = document.getElementById("toggle-on-pressed-change-client");
el?.addEventListener("toggle-client-changed", (e: Event) =>
  console.log((e as CustomEvent).detail)
);