Security News
RubyGems.org Adds New Maintainer Role
RubyGems.org has added a new "maintainer" role that allows for publishing new versions of gems. This new permission type is aimed at improving security for gem owners and the service overall.
@leafygreen-ui/confirmation-modal
Advanced tools
yarn add @leafygreen-ui/confirmation-modal
npm install @leafygreen-ui/confirmation-modal
import ConfirmationModal from '@leafygreen-ui/confirmation-modal';
function ExampleComponent() {
const [open, setOpen] = useState(false);
return (
<>
<button onClick={() => setOpen(!open)}>Open Modal</button>
<ConfirmationModal
open={open}
confirmButtonProps={{
children: 'confirm',
onClick: () => setOpen(false),
disabled: true,
}}
cancelButtonProps={{
onClick: () => setOpen(false),
variant: 'default',
}}
title="Confirm Title Here"
requiredInputText="confirm"
>
This is some description text, and it is extra long so it fills up this
modal. Another thing about the modals here. This is some description
text, and it is extra long so it fills up this modal. Another thing
about the modals here.
</ConfirmationModal>
</>
);
}
Prop | Type | Description | Default |
---|---|---|---|
confirmButtonProps | ButtonProps | The confirm button on the right. An object that accepts all Button props except variant . The variant of the confirm button is controlled by the variant prop. The text is confirm by default but can by overridden with the children property. | |
cancelButtonProps | ButtonProps | The cancel button on the left. An object that accepts all Button props. except children . The text will always render cancel and the onClick property will also fire when the X button, or backdrop is clicked. | |
open | boolean | Determines open state of Modal component | false |
title | string | Title text to display above the main content text. | |
children | node | Children that will be rendered inside <ConfirmationModal /> component. | |
variant | 'default' , 'danger' | Sets the style variant. | 'default' |
requiredInputText | string | If provided, a text prompt will be displayed and the confirmation button will be disabled until the text prompt is filled out with the required text. | |
className | string | Style to be applied to the container's root node. | |
darkMode | boolean | Determines if the component will appear in dark mode. | false |
onConfirm(Deprecated ) | function | Callback that fires when the action is confirmed. This can be used to set the modal to be closed. @deprecated - use confirmButtonProps and pass the onClick property | () => {} |
buttonText(Deprecated ) | string | Text content of the confirmation button. @deprecated - use confirmButtonProps and pass the children property. | |
submitDisabled(Deprecated ) | boolean | Determines if the submit button should appear as disabled @deprecated - use confirmButtonProps and pass the disabled property | false |
onCancel(Deprecated ) | function | Callback that fires when the cancel button, x button, or backdrop is clicked. This can be used to set the modal to be closed. @deprecated - use cancelButtonProps and pass the onClick property | () => {} |
FAQs
leafyGreen UI Kit Confirmation Modal
We found that @leafygreen-ui/confirmation-modal demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
RubyGems.org has added a new "maintainer" role that allows for publishing new versions of gems. This new permission type is aimed at improving security for gem owners and the service overall.
Security News
Node.js will be enforcing stricter semver-major PR policies a month before major releases to enhance stability and ensure reliable release candidates.
Security News
Research
Socket's threat research team has detected five malicious npm packages targeting Roblox developers, deploying malware to steal credentials and personal data.