Note for using within a Dialog

[mjsisley]

Nice component! Shadcn and radix are pretty great and thanks for putting this out there.

As an FYI for using within a Dialog component; in order to make this component functional I had to create a Popover component that wasn't wrapped in a PopoverPrimitive.Portal. When used in the context of within a Dialog - I was unable to interact with anything within the Popover (I was able to focus the Group Items after adding pointer-events-auto - but for reasons I'm not sure on - I could not get focus to the CommandInput except after closing the Edit Dialog).

This is of course a better issue for the shadcn repo (possibly exposing a variant of PopoverContent component); but thought I'd leave a note here in case anyone tries to use your component within a Dialog

Thanks again!

[mxkaske]

Thank you for your sharing the advice! Indeed, I encountered some issues nesting the Dialog inside of the Popover and therefore I went for the controlled way.

[adaptive-shield-matrix]

I'm getting some kind of weird transparency bug then using the Multiselect inside a Dialog.
Is this the problem you are talking about or something separate?

Outside of a Dialog it looks/looked completely fine...
The z-Index seems to be wrong too, because the Switch thumb sticks through as well.

[adaptive-shield-matrix]

nevermind, I cound fix my problem by adding a z-10 class

      <div className="relative mt-2">
        {open && selectables.length > 0 ? (
          <div
            className={cn(
              "absolute w-full z-10 top-0 rounded-md border bg-popover text-popover-foreground shadow-md outline-none animate-in",
            )}
          >

[mxkaske]

Appreciate the contribution, @adaptive-shield-matrix! 🚀