API

    <.action class="button ui-size-sm" phx-click={Corex.Toggle.set_pressed("toggle-api-bind", true)}>
  Pressed
</.action>
<.action class="button ui-size-sm" phx-click={Corex.Toggle.set_pressed("toggle-api-bind", false)}>
  Not pressed
</.action>
<.toggle id="toggle-api-bind" class="toggle" controlled pressed={false}>
  duis
</.toggle>

  

    <.action
  class="button ui-size-sm"
  phx-click={
    Phoenix.LiveView.JS.dispatch("corex:toggle:set-pressed",
      to: "#toggle-api-cjs",
      detail: %{pressed: true},
      bubbles: false
    )
  }
>
  Pressed
</.action>
<.action
  class="button ui-size-sm"
  phx-click={
    Phoenix.LiveView.JS.dispatch("corex:toggle:set-pressed",
      to: "#toggle-api-cjs",
      detail: %{pressed: false},
      bubbles: false
    )
  }
>
  Not pressed
</.action>
<.toggle id="toggle-api-cjs" class="toggle" pressed>
  duis
</.toggle>

  

    const el = document.getElementById("toggle-api-cjs");
el?.dispatchEvent(
  new CustomEvent("corex:toggle:set-pressed", {
    bubbles: false,
    detail: { pressed: true },
  })
);

  

    const el: HTMLElement | null = document.getElementById("toggle-api-cjs");
el?.dispatchEvent(
  new CustomEvent<{ pressed: boolean }>("corex:toggle:set-pressed", {
    bubbles: false,
    detail: { pressed: true },
  })
);

  

    <.action class="button ui-size-sm" phx-click="toggle_api_on">Pressed</.action>
<.action class="button ui-size-sm" phx-click="toggle_api_off">Not pressed</.action>
<.toggle id="toggle-api-srv" class="toggle">
  duis
</.toggle>

  

    def handle_event("toggle_api_on", _, socket) do
  {:noreply, Corex.Toggle.set_pressed(socket, "toggle-api-srv", true)}
end

def handle_event("toggle_api_off", _, socket) do
  {:noreply, Corex.Toggle.set_pressed(socket, "toggle-api-srv", false)}
end