@bdt-component-library/modal NPM

Modal Component

About

This is a component published as its own package from our component library monorepo: https://github.com/BenefitsDataTrust/ui-components. Setup instructions, as well as higher-level goals and concerns can be found from the main project README.

Description

Handles display of modals according to style guide conventions.

https://zeroheight.com/990ea04ab/p/280a4e-modal

API

prop	type	required	default	explanation
children	any	yes	n/a	Renders the modal description
open	boolean	yes	false	Determines open state of modal
closeOnBackdropClick	boolean	no	true	Determines if the modal closes on clicking outside the modal
title	string	no	undefined	Modal title
width	number	no	undefined	Determines modal width
close	function	yes	() => {}	Handler for the onclick event on close button
hasBodyScroll	boolean	no	false	Determines wether scroll behavior occurs in the body section with a max height on the whole modal, or on the whole modal container (default)
cta	React node	no	no	Optional "call to action"
zIndex	number	no	1000	Determines z-index style for the modal (as well as backdrop at zIndex - 1)