version: "1.0.0" name: rexui-dialogs-and-popups description: "Use this skill when building RexUI dialogs, confirmDialog, confirmActionButton, nameInputDialog, modal overlays, popup panels, menus, dropDownList, simpleDropDownList, toast, or toastQueue flows. Triggers on: RexUI dialog, RexUI confirmDialog, RexUI modal, RexUI popup, RexUI dropdown, RexUI dropDownList, RexUI menu, RexUI toast, modalPromise."

RexUI Dialogs And Popups

Use this skill for RexUI interaction flows that open, close, select, confirm, or notify.

Use This First

Choose the popup component:

For layout details inside dialog content, use rexui-layout-sizers. For button visuals and selection state, use rexui-basic-widgets.

Required Setup

This skill assumes RexUI is available as this.rexUI. If not, use rexui-setup-and-factory.

References

Read these only when needed:

• references/dialog-config.md: component chooser and key config fields.
• references/modal-patterns.md: modal lifecycle, promises, close behavior.
• references/dialog-recipes.md: reduced recipes for dialog, confirm, dropdown, toast, and modal.

Core Rules

• Call .layout() before .modal(), .modalPromise(), .popUp(), or relying on bounds.
• Use confirmDialog for common confirmation flows instead of hand-building dialog.
• Use dialog when the layout has custom toolbars, descriptions, choices, or action sections.
• Use modalPromise() when caller needs a result object.
• Use dropDownList when the selected value should live in the label itself.
• Use toast for one toast instance with internal message queue; use toastQueue for visible stacked messages.
• Do not use these skills for generic browser dialogs or DOM popups unless RexUI is explicitly involved.

Source File Map

• templates/ui/dialog/Dialog.d.ts
• templates/ui/confirmdialog/ConfirmDialog.d.ts
• templates/ui/confirmactionbutton/ConfirmActionButton.d.ts
• templates/ui/nameinputdialog/NameInputDialog.d.ts
• templates/ui/modal/Modal.d.ts
• templates/ui/menu/Menu.d.ts
• templates/ui/dropdownlist/DropDownList.d.ts
• templates/ui/simpledropdownlist/SimpleDropDownList.d.ts
• templates/ui/toast/Toast.d.ts
• templates/ui/toastqueue/ToastQueue.d.ts

Related Skills

• rexui-setup-and-factory: plugin setup and factory discovery.
• rexui-components-catalog: choose the correct component family.
• rexui-layout-sizers: internal dialog layout.
• rexui-basic-widgets: labels, buttons, and button state.
• rexui-text-and-input: text input and textarea content.