# A (nearly complete) Radix UI package

**URL:** <https://discourse.elm-lang.org/t/a-nearly-complete-radix-ui-package/10421>\
**Category:** Show and Tell\
**Created:** [August 27, 2025, 4:28pm UTC](https://discourse.elm-lang.org/t/a-nearly-complete-radix-ui-package/10421 "2025-08-27T16:28:07Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![wolfadex](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/wolfadex/32/2461_2.png) [@wolfadex](https://discourse.elm-lang.org/u/wolfadex)\
**Post date:** [August 27, 2025, 4:28pm UTC](https://discourse.elm-lang.org/t/a-nearly-complete-radix-ui-package/10421/1 "2025-08-27T16:28:07Z")

</div>

Over a year ago now I started on porting Radix UI to an Elm package. Making a few upgrades here and there like using native modals and the Popover API for toolips. I didn’t complete the work as I somewhat lost interest, but figured others might be interested in forking it or just straight up taking the code to do with as they wish. If you have any questions about it, I’d be happy to answer!

> **[GitHub - wolfadex/elm-radix-ui: radix-ui.com in Elm](https://github.com/wolfadex/elm-radix-ui)**
>
> radix-ui.com in Elm

While I don’t use the package itself I do sometimes use it as a reference for how to do modals, and maybe tooltips, just straight copying those portions of code into newer projects that need these elements.

* * *

For the modals, the core of what you’d want to look at is these bits of code:

- [elm-radix-ui/public/elm-modal.js at main · wolfadex/elm-radix-ui · GitHub](https://github.com/wolfadex/elm-radix-ui/blob/main/public/elm-modal.js)
- [elm-radix-ui/src/Radix/Modal.elm at 1ec090a701c00aebf7e894a5b56f4f972104d0a2 · wolfadex/elm-radix-ui · GitHub](https://github.com/wolfadex/elm-radix-ui/blob/1ec090a701c00aebf7e894a5b56f4f972104d0a2/src/Radix/Modal.elm#L126-L134)

The rest of the Elm Modal file is more specific to Radix styling and options than what is needed to make a modal.

* * *

For the tooltips, dropdowns (select inputs), or anything Popover API related you’ll want to look at:

- [elm-radix-ui/public/elm-popover.js at main · wolfadex/elm-radix-ui · GitHub](https://github.com/wolfadex/elm-radix-ui/blob/main/public/elm-popover.js)
- [elm-radix-ui/src/Radix/Modal.elm at 1ec090a701c00aebf7e894a5b56f4f972104d0a2 · wolfadex/elm-radix-ui · GitHub](https://github.com/wolfadex/elm-radix-ui/blob/1ec090a701c00aebf7e894a5b56f4f972104d0a2/src/Radix/Modal.elm#L126-L134)
- [elm-radix-ui/src/Radix/Select.elm at 1ec090a701c00aebf7e894a5b56f4f972104d0a2 · wolfadex/elm-radix-ui · GitHub](https://github.com/wolfadex/elm-radix-ui/blob/1ec090a701c00aebf7e894a5b56f4f972104d0a2/src/Radix/Select.elm#L406-L419)

I don’t know if this is actually useful for anyone, but I do periodically see people ask about modals in Elm and I’ve found this works pretty well.

* * *

The modal stuff is fairly close to how it was done at Vendr when I migrated to using native modals. Though I think we might have used a port for opening/closing them instead of a property, I don’t fully remember. The tooltip JS code in my Radix code is also partially based off how we did tooltips at Vendr, though instead of using the Popover API we used elm-portal.

---

<div class="post-metadata">

**Author:** ![RyanNHG](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/ryannhg/32/5162_2.png) [@RyanNHG](https://discourse.elm-lang.org/u/RyanNHG)\
**Post date:** [September 3, 2025, 2:44am UTC](https://discourse.elm-lang.org/t/a-nearly-complete-radix-ui-package/10421/2 "2025-09-03T02:44:09Z")

</div>

So cool, Wolfgang! Thanks for sharing this 🤩

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/1X/50a05e53677a2c3b47776d7abd0f113eb50193a1.png) [@system](https://discourse.elm-lang.org/u/system)\
**Post date:** [September 13, 2025, 2:44am UTC](https://discourse.elm-lang.org/t/a-nearly-complete-radix-ui-package/10421/3 "2025-09-13T02:44:25Z")

</div>

Closed on September 13, 2025, 2:44am UTC

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.
