dialog-close
Syntax
dialog-close: (selector) [return value] [after (time)][, (selector)...];
selector = Any valid CSS selector referencing a dialog element(s).
return value = (optional) If a value is required from a form within the dialog box, this would be the string value to assign to the returnValue of the dialog box at the moment of closing. This is usually either a hard-coded value, or fetched from the value of a confirmation button in a form. See below for more information.
This command closes an HTML dialog.
It implements the JavaScript HTMLDialogElement.close() functionality for the standard HTML dialog element.
If using a form to get a return value from the dialog, the returnValue property can be extracted from the dialog element using {@@returnValue}. The double @ symbol is the ACSS method of retrieving a property of a target selector element.
The recommended method to get a return value from the dialog box (from the MDN docs) is to first assign the return value to the confirm button closing the dialog. Then on closing the dialog box you get the returnValue property from the dialog box itself. This approach will allow the native UI of the dialog box to work as advertised. There is an example below that demonstrates how this approach can be followed in ACSS.
Of course, you may wish to roll-your-own dialog box or make a hybrid with ACSS, but you may encounter one or two deviations from native dialog behaviour along the way. Even so, rolling-your-own may be totally acceptable for your use case.
If you have any doubt about the native implementation, read the MDN docs closely.
Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog