Dialog

[<ReactComponent>]
let DialogTest() =
    let isOpen, setIsOpen = React.useState false
    Fui.dialog [
        dialog.open' isOpen
        dialog.onOpenChange (fun (d: DialogOpenChangeData<MouseEvent>) -> setIsOpen d.``open``)
        dialog.children [
            Fui.dialogTrigger [
                dialogTrigger.disableButtonEnhancement true
                dialogTrigger.children (
                    Fui.button [
                        button.text "Open dialog"
                    ]
                )
            ]
            Fui.dialogSurface [
                Fui.dialogBody [
                    Fui.dialogTitle [
                        dialogTitle.as'.h1
                        dialogTitle.text "Dialog Title"
                    ]
                    Fui.dialogContent [
                        dialogContent.text "This dialog focus on the second button instead of the first"
                    ]
                    Fui.dialogActions [
                        dialogActions.position.start
                        dialogActions.children [
                            Fui.button [
                                button.appearance.outline
                                button.text "Third Action"
                            ]
                        ]
                    ]
                    Fui.dialogActions [
                        dialogActions.position.end'
                        dialogActions.children [
                            Fui.dialogTrigger [
                                dialogTrigger.disableButtonEnhancement true
                                dialogTrigger.children (
                                    Fui.button [
                                        button.appearance.secondary
                                        button.text "Close"
                                    ]
                                )
                            ]
                            Fui.button [
                                button.appearance.primary
                                button.text "Do Something"
                            ]
                        ]
                    ]
                ]
            ]
        ]
    ]