https://github.com/rintoj/native-x-modal
https://github.com/rintoj/native-x-modal
Last synced: about 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/rintoj/native-x-modal
- Owner: rintoj
- Created: 2021-06-17T21:48:44.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2022-07-08T17:31:05.000Z (almost 4 years ago)
- Last Synced: 2025-04-01T16:24:13.713Z (about 1 year ago)
- Language: TypeScript
- Size: 158 KB
- Stars: 0
- Watchers: 2
- Forks: 3
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# native-x-modal
[](https://github.com/semantic-release/semantic-release)
This component adds space between to other components
## Install
### Yarn
```sh
yarn add native-x-modal
```
### NPM
```sh
npm install native-x-modal
```
## Usage
```tsx
import { Modal } from 'native-x-modal'
function MyComponent() {
const [visible, setVisible] = React.useState(false)
return (
setVisible(false)}>
...
)
}
```
## API
| Property | Default Value | Usage |
| -------------------- | ------------- | ------------------ |
| children?: string | | Content |
| visible?: boolean | | Show modal |
| showClose?: boolean | | Show close button |
| width?: number | | Width of the modal |
| onClose?: () => void | | On close modal |
## Confirmation Modal
```tsx
import { ConfirmationModal } from 'native-x-modal'
function MyComponent() {
const [visible, setVisible] = React.useState(false)
return (
setVisible(false)}>
...
)
}
```
| Property | Default Value | Usage |
| ------------------------------------ | ------------- | --------------------------------- |
| children?: string | | Content |
| visible?: boolean | | Show modal |
| showClose?: boolean | | Show close button |
| width?: number | | Width of the modal |
| onClose?: () => void | | On close modal |
| onOk?: () => void | | On click on ok button |
| onCancel?: () => void | | On click on cancel button |
| okText?: string | OK | Label of ok button |
| okButtonBackgroundColor?: string | | Background color of ok button |
| okTextColor?: string | | Text color of ok button |
| cancelText?: string | Cancel | Label of cancel button |
| cancelButtonBackgroundColor?: string | | Background color of cancel button |
| cancelTextColor?: string | | Text color of cancel button |
## Automatic Release
Here is an example of the release type that will be done based on a commit messages:
| Commit message | Release type |
| ------------------- | --------------------- |
| fix: [comment] | Patch Release |
| feat: [comment] | Minor Feature Release |
| perf: [comment] | Major Feature Release |
| doc: [comment] | No Release |
| refactor: [comment] | No Release |
| chore: [comment] | No Release |