mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2025-10-16 12:05:41 +00:00
* [React] Remove string index fallback for CSS properties (resolves #24568) * Require a minimum version of 2.2 for csstype * Fix aphrodite types * Fix react-confirm test * Use Omit * Fix react-geosuggest types * Fix victory test * Make customStyle and customStyleOnEditCell into functions
62 lines
1.6 KiB
TypeScript
62 lines
1.6 KiB
TypeScript
import * as React from 'react';
|
|
import { confirmable, createConfirmation, ReactConfirmProps } from 'react-confirm';
|
|
|
|
interface CustomModalProps {
|
|
title: string;
|
|
}
|
|
|
|
class CustomModal extends React.Component<CustomModalProps & ReactConfirmProps> {
|
|
modalStyle() {
|
|
return this.props.show ? { display: 'none' } : undefined;
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div style={this.modalStyle()}>
|
|
<h1>{this.props.title}</h1>
|
|
|
|
<div>
|
|
{this.props.confirmation}
|
|
</div>
|
|
|
|
<div>
|
|
<button onClick={() => this.props.proceed()}>Yes</button>
|
|
<button onClick={() => this.props.cancel()}>No</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
// Adds ReactConfirmProps to CustomModal component
|
|
const ConfirmModal = confirmable(CustomModal);
|
|
|
|
// This is the function you need to call to open your modal, then you can use the
|
|
// Promise object it returns to handle "proceed()" or "cancel()" functions.
|
|
const confirm = createConfirmation(ConfirmModal);
|
|
|
|
const markup = (
|
|
<div>
|
|
<b>Are you sure you want to delete this item?</b>
|
|
</div>
|
|
);
|
|
|
|
// This is how you can detect what option ("Yes" or "No") the user has chosen.
|
|
confirm({ confirmation: markup })
|
|
.then((result) => {
|
|
// User chose "Yes"
|
|
})
|
|
.catch((result) => {
|
|
// User chose "No"
|
|
});
|
|
|
|
const text = "Are you sure you want to buy this product?";
|
|
|
|
confirm({ confirmation: text })
|
|
.then((result) => {
|
|
// User chose "Yes"
|
|
})
|
|
.catch((result) => {
|
|
// User chose "No"
|
|
});
|