Dialog

dialog

A dialog is a type of modal window that is displayed on top of the current app content and remains on the screen until confirmed, dismissed, or a required action has been taken.

Usage

dialog

Box(modifier = Modifier.padding(16.dp)) {
    XelaDialog(
        title = "Popup title",
        description = "Popup description",
        primaryButton =  { XelaButton(
            text = "Action",
            onClick = { /*TODO*/ },
            size = XelaButtonSize.MEDIUM
        ) },
        secondaryButton = { XelaButton(
            text = "Action",
            onClick = { /*TODO*/ },
            size = XelaButtonSize.MEDIUM,
            type = XelaButtonType.SECONDARY,
            foregroundColor = XelaColor.Blue3,
            defaultBorderColor = Color.Transparent,
            background = Color.Transparent
        )},
        closeButtonIcon = R.drawable.ic_x,
        background = XelaColor.Gray12,
    )
}

Properties

Name Type Default Value Required Description
icon Int? null NO Top Center icon from Drawable
title String NO Title string
description String NO Description string
primaryButton (@Composable () -> Unit)? null NO Primary button composable view
secondaryButton (@Composable () -> Unit)? null NO Secondary button composable view
closeButton Int? null NO Close dialog button icon name from Drawable
buttonsHorizontal Boolean true NO Primary and Secondary buttons positions
background Color Color.White NO Background color
titleColor Color XelaColor.Gray3 NO Title color
descriptionColor Color XelaColor.Gray3 NO Description color
iconColor Color XelaColor.Gray3 NO Icon color
onCloseButtonAction (() -> Unit)? null NO On close button action
closeButtonIconColor Color XelaColor.Gray3 NO Close button color