import React from 'react' ; import { Modal } from '@workday/canvas-kit-react/modal' ; import { usePopupModel , useInitialFocus , useReturnFocus , useFocusTrap , useAssistiveHideSiblings , useDisableBodyScroll , } from '@workday/canvas-kit-react/popup' ; import { DeleteButton } from '@workday/canvas-kit-react/button' ; import { HStack } from '@workday/canvas-kit-labs-react' ; export const WithoutCloseIcon = ( ) => { const model = usePopupModel ( ) ; useInitialFocus ( model ) ; useReturnFocus ( model ) ; useFocusTrap ( model ) ; useAssistiveHideSiblings ( model ) ; useDisableBodyScroll ( model ) ; const handleDelete = ( ) => { console . log ( 'Deleted item' ) ; } ; return ( < Modal model = { model } > < Modal . Target as = { DeleteButton } > Delete Item < /Modal.Target> < Modal . Overlay > < Modal . Card > < Modal . Heading > Delete Item < /Modal.Heading> < Modal . Body > < p > Are you sure you want to delete the item ? < /p> < HStack spacing = "s" > < Modal . CloseButton as = { DeleteButton } onClick = { handleDelete } > Delete < /Modal.CloseButton> < Modal . CloseButton > Cancel < /Modal.CloseButton> < /HStack> < /Modal.Body> < /Modal.Card> < /Modal.Overlay> < /Modal>); } ;