Phx-click-away can not stopPropagation in liveview

Hello, I have a simple HTML that contains a modal in itself, the main body you can see in the following code has a phx-click="reset"

def dashboard(assigns) do
  <div class="main-body" phx-click="reset">
    <div id="mishka_top_nav" class="top-nav">
      <div>Back To/History</div>
      <div>Main Section</div>
      class="flex flex-col-reverse mx-auto justify-between items-stretch w-full rounded-t-md lg:flex-row"
      <%!-- Modal with phx-click-away={JS.push("something")} --%>

When I select outside of modal, I need to call something, but it calls "reset", it should be noted when my modal is buggier than a normal size, if user clicks each empty place of modal, it runs reset event.

How can I command a div runs something like JavaScript stopPropagation? It is just for learning.
I fixed my problem with deleting phx-click="reset" from my main-body, but I think in the feature I am faced with this problem again.

<div phx-stop-propagation>
  <%!-- Modal with phx-click-away={JS.push("something")} --%>

Thank you in advance.

The phx-click-away event is fired when a click event happens outside of the element. This is useful for hiding toggled containers like drop-downs.

(Bindings — Phoenix LiveView v0.18.16)