Environment
Vuetify0 Version: 1.0.0-beta.0
Vue Version: 3.5.35
OS: macOS 10.15.7 (current)
Steps to reproduce
- Click to "Open dialog"
- Click to "Show snackbar (inside dialog)"
Expected Behavior
The snackbar always appears on top of the dialog
Actual Behavior
The snackbar appears below the dialog
Reproduction Link
https://github.com/pont1s/vuetify0-dialog
Other comments
Since Dialog is built on top of the Dialog API, is there a plan to address at the library level (vuetify0) the set of issues that currently exist with this API? Or should fixing them be handled by the consumer when building a design system on top of vuetify0? What is vuetify0 position on these issues?
A list of such issues can be found at carbon-design-system/carbon#22241
One such issue is the common case where a Snackbar (Toast) needs to be displayed inside a Dialog. In this case, the expectation is that the Snackbar should always appear on top of the Dialog and remain interactive.
As a side note, I expected Snackbar to be implemented via the Popover API with a manual type, but even then the problem is not resolved. When using a shared queue, Snackbars are rendered in their container inside body, and the Dialog specification requires that a Popover be nested within the dialog, otherwise it will not be interactive.
Within my own design system, I solved this problem using a usePopoverTopmostTeleportTarget composable based on whatwg/html#9936 (comment), though it is far from perfect.
Environment
Vuetify0 Version: 1.0.0-beta.0
Vue Version: 3.5.35
OS: macOS 10.15.7 (current)
Steps to reproduce
Expected Behavior
The snackbar always appears on top of the dialog
Actual Behavior
The snackbar appears below the dialog
Reproduction Link
https://github.com/pont1s/vuetify0-dialog
Other comments
Since Dialog is built on top of the Dialog API, is there a plan to address at the library level (vuetify0) the set of issues that currently exist with this API? Or should fixing them be handled by the consumer when building a design system on top of vuetify0? What is vuetify0 position on these issues?
A list of such issues can be found at carbon-design-system/carbon#22241
One such issue is the common case where a Snackbar (Toast) needs to be displayed inside a Dialog. In this case, the expectation is that the Snackbar should always appear on top of the Dialog and remain interactive.
As a side note, I expected Snackbar to be implemented via the Popover API with a
manualtype, but even then the problem is not resolved. When using a shared queue, Snackbars are rendered in their container insidebody, and the Dialog specification requires that a Popover be nested within the dialog, otherwise it will not be interactive.Within my own design system, I solved this problem using a
usePopoverTopmostTeleportTargetcomposable based on whatwg/html#9936 (comment), though it is far from perfect.