page ApiBlockDemo {
  state nameFilter = "a"
  state found = ""
  state failed = ""

  client {
    api searchDirectory POST /api/directory {
      request {
        body {
          name?: string
        }
      }

      response {
        return data.data.users
      }

      error {
        return []
      }
    }
  }

  functions {
    client async function search(): Promise<void> {
      const users = await api.searchDirectory({ name: nameFilter })
      found = users.map((user) => user.name).join(", ")
    }
  }

  view {
    <main>
      <button @click="search()">Search</button>
      <p class="found" data-text="found">{found}</p>
      <p class="failed" data-text="failed">{failed}</p>
    </main>
  }
}