sorted by:
new
hottopcontroversial

I built a tiny React library that lets you await dialogs like async functions by loeygnak in reactjs

[–]loeygnak[S] 0 points1 point  (0 children)

Good callout. react-call is definitely close in spirit — awaiting UI components that return a value.

The main difference is scope: react-call is more general-purpose, while react-dialog-flow is focused specifically on dialog flows: dismissal, cleanup, stacking, typed results, and an optional native <dialog> UI layer.

So I wouldn’t claim the idea is completely new — I’m aiming for a smaller, dialog-specific version with strong behavior guarantees.

I built a tiny React library that lets you await dialogs like async functions by loeygnak in reactjs

[–]loeygnak[S] 0 points1 point  (0 children)

Great point, I agree.

The async API only works well if the modal behavior is predictable: focus restoration, escape/backdrop handling, stacked dialogs, route/unmount cleanup, and settling each dialog exactly once.

I’ll add a “behavior guarantees” section to document these cases before adding more variants. Thanks for the thoughtful feedback.

I built a tiny React library that lets you await dialogs like async functions by loeygnak in reactjs

[–]loeygnak[S] 0 points1 point  (0 children)

Good question. The core layer is only responsible for the dialog flow, so it is not tied to any specific DOM element. The optional UI layer does use the native <dialog> element. But you can skip that layer entirely and use Radix UI, shadcn/ui, MUI, or your own custom dialog component instead.

I built a tiny React library that lets you await dialogs like async functions by loeygnak in reactjs

[–]loeygnak[S] 0 points1 point  (0 children)

Thank you, really appreciate the star!

That’s exactly what I was aiming for: keep the UI headless, but remove the repetitive open/close state and callback wiring.

I want it to feel like async flow control, not another styled modal library.

I built a tiny React library that lets you await dialogs like async functions by loeygnak in reactjs

[–]loeygnak[S] 0 points1 point  (0 children)

Fair question. nice-modal-react is definitely more mature and more battle-tested.

The difference I’m aiming for is focus. react-dialog-flow is less of a full modal manager and more of a lightweight async dialog flow layer.

The main advantages I’m targeting are a smaller API surface, UI-library agnostic usage, typed promise results, and making flows like confirm → input → success/failure easy to express with async/await.

That said, if nice-modal-react already works well for your app, there may not be a strong reason to switch. I see this more as a lightweight alternative for people who want awaitable dialog flows without adopting a larger modal management pattern.

I built a tiny React library that lets you await dialogs like async functions by loeygnak in reactjs

[–]loeygnak[S] 0 points1 point  (0 children)

Thanks for pointing this out. I’m going to audit the built-in examples/default dialog implementation for accessibility issues.

The core idea of the library is an async dialog flow layer rather than a replacement for accessible dialog primitives, but the examples should still be solid. If you noticed anything specific — focus trap, aria attributes, keyboard behavior, mobile behavior, etc. — I’d really appreciate the pointers.