react-confirm 0.3.0-4 → 0.3.0-6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -12
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -5,11 +5,10 @@ One key feature of react-confirm is that it doesn't provide a specific view or c
|
|
|
5
5
|
|
|
6
6
|
[](https://badge.fury.io/js/react-confirm)
|
|
7
7
|
|
|
8
|
-
##
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
- [material-ui example](https://github.com/haradakunihiko/react-confirm/tree/master/example/material-ui)
|
|
8
|
+
## Demo
|
|
9
|
+
[](https://stackblitz.com/fork/github/haradakunihiko/react-confirm-sample/tree/main/1_typescript)
|
|
10
|
+
|
|
11
|
+
Please note that interactions with the sample dialogs output details to the console. Review the console output while interacting with the dialogs to observe the behavior and outcomes.
|
|
13
12
|
|
|
14
13
|
## Motivation
|
|
15
14
|
React is a powerful library that allows for reactive rendering based on component state. However, managing temporary states like confirmation dialogs can quickly become complex. The question is: is it worth implementing these states within your app? The answer is not always a clear yes.
|
|
@@ -22,12 +21,6 @@ react-confirm library offers several benefits:
|
|
|
22
21
|
- You can retrieve values from the component in the promise.
|
|
23
22
|
- The library provides flexibility in designing the dialog. There is no limitation in the type of components you can use, whether it be input forms or multiple buttons. You can even check out the demo site to see examples of how to customize the dialog.
|
|
24
23
|
|
|
25
|
-
## Demo
|
|
26
|
-
[](https://stackblitz.com/fork/github/haradakunihiko/react-confirm-sample/tree/main/1_typescript)
|
|
27
|
-
|
|
28
|
-
Please note that interactions with the sample dialogs output details to the console. Review the console output while interacting with the dialogs to observe the behavior and outcomes.
|
|
29
|
-
|
|
30
|
-
|
|
31
24
|
## Versions
|
|
32
25
|
|
|
33
26
|
- React 18+ users should use `react-confirm` version 0.2.x or 0.3.x
|
|
@@ -158,4 +151,9 @@ const Confirmation1: React.FC<ConfirmDialogProps<Props, Response>> = (props) =>
|
|
|
158
151
|
const Confirmation2: ConfirmDialog<Props, Response> = (props) => (<Dialog></Dialog>)
|
|
159
152
|
```
|
|
160
153
|
|
|
161
|
-
|
|
154
|
+
When defining your dialog component, set both the `Props` for the dialog and the `Response` value to be passed when the dialog closes. This will be handy when calling the dialog.
|
|
155
|
+
|
|
156
|
+
|
|
157
|
+
## Other Examples
|
|
158
|
+
- [chakra-ui(using context) demo in codesandbox](https://codesandbox.io/s/react-confirm-with-chakra-ui-oidpf1)
|
|
159
|
+
- [material-ui example](https://github.com/haradakunihiko/react-confirm/tree/master/example/material-ui)
|