Skip to main content Skip to navigation Skip to search
Name Type Description
i18n { closeButtonAriaLabel: string; contentStart: string; contentBox: string; contentEnd: string; }
closable boolean If false, the modal will not render the close button.
size "default" | "sm" | "lg" | "xl" Sets the overall height and width of the modal and icon based on value
ariaModal string
role string
overlayIsActive boolean
focusTrap FocusTrap
topReboundElement HTMLElement
bottomReboundElement HTMLElement
hidden boolean Its recommended to remove or add a focus trap element from the DOM some SSR systems can have technical constraints where the item can only be removed via CSS/hidden.
focusTrapId string
Name
--backdrop-background
--layered-backdrop-background
--border-color
--border-width
--border-radius
--background
--box-shadow
--width
Name Desription
closeChange notify when the user has clicked the close button
Name Description
default Content slot for inside the alert
cds-modal-content Content slot for inside the alert
cds-modal-header Content slot for inside the alert
cds-modal-actions Content slot for inside the alert