How to use headlessui

[shrimpy]

trafficstars

Anyone has any idea why i am getting below error?

SSR TypeError: Relative import path "client-only" not prefixed with / or ./ or ../ and not in import map from "https://esm.sh/v120/@headlessui/[email protected]/X-ZS8q/deno/react.mjs"
    at https://esm.sh/v120/@headlessui/[email protected]/X-ZS8q/deno/react.mjs:2:7
    at async importRouteModule (https://deno.land/x/[email protected]/server/router.ts:38:10)
    at async https://deno.land/x/[email protected]/server/renderer.ts:286:17
    at async Promise.all (index 0)
    at async initSSR (https://deno.land/x/[email protected]/server/renderer.ts:285:19)
    at async Object.fetch (https://deno.land/x/[email protected]/server/renderer.ts:26:41)
    at async routeHandler (https://deno.land/x/[email protected]/server/handler.ts:347:14)
    at async Server.#respond (https://deno.land/[email protected]/http/server.ts:299:18)

import_map.json

{
  "imports": {
    "~/": "./",
    "std/": "https://deno.land/[email protected]/",
    "aleph/": "https://deno.land/x/[email protected]/",
    "aleph/react": "https://deno.land/x/[email protected]/framework/react/mod.ts",
    "aleph/plugins/react": "https://deno.land/x/[email protected]/framework/react/plugin.ts",
    "aleph/plugins/deploy": "https://deno.land/x/[email protected]/plugins/deploy.ts",
    "aleph/dev": "https://deno.land/x/[email protected]/server/dev.ts",
    "aleph/server": "https://deno.land/x/[email protected]/server/mod.ts",
    "react-dom": "https://esm.sh/v120/[email protected]",
    "react-dom/": "https://esm.sh/v120/[email protected]/",
    "react": "https://esm.sh/v120/[email protected]",
    "@headlessui/react": "https://esm.sh/v120/*@headlessui/[email protected]"
  },
  "scopes": {}
}

usage:

import { Transition } from "@headlessui/react";

...
...
  <Transition>
  ...
  </Transition>

turn SSR off and seeing similar error from browser console

client.ts:24 Uncaught (in promise) TypeError: Failed to resolve module specifier "client-only". Relative references must start with either "/", "./", or "../".
await (async)
(anonymous) @ main.ts:3

[ije]

try to use deno task esm add @headlessui/react