👋
Welcome to popup-sensor
Popup window sensor written in typescript
Installing
Using npm:
npm i --save popup-sensor
Using yarn:
yarn add --dev popup-sensor
Usage
Here are examples of how you can use popup-sensor
.
Simply open a popup window
import Popup from 'popup-sensor'
const onClick = () => {
const popupInstance = new Popup({})
popupInstance.open({
title: 'Google',
url: 'https://www.google.com/',
})
}
One-liner
import Popup from 'popup-sensor'
const onClick = () => {
new Popup({}).open({
title: 'Google',
url: 'https://www.google.com/',
})
}
Catch the close event of popup window
import Popup from 'popup-sensor'
const onPopupClose = () => {
console.log('popup close event')
}
const onClick = () => {
const popupInstance = new Popup({ onClose: onPopupClose })
popupInstance.open({
title: 'Google',
url: 'https://www.google.com/',
})
}
One-liner
import Popup from 'popup-sensor'
const onPopupClose = () => {
console.log('popup close event')
}
const onClick = () => {
new Popup({ onClose: onPopupClose }).open({
title: 'Google',
url: 'https://www.google.com/',
})
}
Track location and dispatch action
import * as queryString from 'query-string'
import Popup from 'popup-sensor'
import { EPopupAction } from 'popup-sensor/types'
const onLocationChange = (location: Location) => {
const locationSearch = queryString.parse(location.search)
return locationSearch.code ? EPopupAction.CLOSE : EPopupAction.NONE
}
const onClick = () => {
const popupInstance = new Popup({ onLocationChange })
popupInstance.open({
title: 'Google',
url: 'https://www.google.com/',
})
}
One-liner
import * as queryString from 'query-string'
import Popup from 'popup-sensor'
import { EPopupAction } from 'popup-sensor/types'
const onLocationChange = (location: Location) => {
return queryString.parse(location.search).code
? EPopupAction.CLOSE
: EPopupAction.NONE
}
const onClick = () => {
new Popup({ onLocationChange }).open({
title: 'Google',
url: 'https://www.google.com/',
})
}
Running the tests
Tests are written with jest
Unit tests
Using jest:
yarn run test
Deployment
Deployment is done with Travis.
Built With
- TSDX - TSDX
Contributing
Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.
Versioning
We use SemVer for versioning. For the versions available, see the tags on this repository.
Authors
- Arnaud Zheng - Initial work - arnaud-zg
See also the list of contributors who participated in this project.
License
This project is licensed under the MIT License - see the LICENSE.md file for details