{"_id":"@adriandiaz/react-native-iphone-x-helper","name":"@adriandiaz/react-native-iphone-x-helper","dist-tags":{"latest":"1.3.2"},"versions":{"1.3.2":{"name":"@adriandiaz/react-native-iphone-x-helper","version":"1.3.2","description":"A library to help you design your react-native app for the iPhone X","main":"index.js","types":"index.d.ts","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/ptelad/react-native-iphone-x-helper.git"},"keywords":["react-native","ios","iphone-x","iphoneX","stylesheet"],"author":{"name":"Elad Gil"},"license":"MIT","bugs":{"url":"https://github.com/ptelad/react-native-iphone-x-helper/issues"},"homepage":"https://github.com/ptelad/react-native-iphone-x-helper#readme","peerDependencies":{"react-native":">=0.42.0"},"gitHead":"322fefeba4eb215530ccdc2b9dc058359f1e389e","_id":"@adriandiaz/react-native-iphone-x-helper@1.3.2","_nodeVersion":"14.17.1","_npmVersion":"7.19.1","dist":{"integrity":"sha512-wklzCQs8ozn8hxYveEZek85rTYju/PTGTbVg4OC9arC1Ct424k7fW05y0kyFSRGobG/mI2Z/Q3YM2YWeOabO3g==","shasum":"a8c07829d823dbed84259e3032a79f6701572c82","tarball":"https://registry.npmjs.org/@adriandiaz/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.3.2.tgz","fileCount":5,"unpackedSize":5838,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDOykXtozsaobhIdblvm4EZpGlNmpGKr5HHnJu2usct2gIhAIBFzmgoGMRRwk144/aPp5QKoUhfXTsJBdjIWdwgrSRC"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJj5uAUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqh2A//SsIv+FZOud26fWXRRW2JPP/jgHYwoJmmrMd0VBw2iQwU1wGn\r\njxpN2eAqjru6s5YnRqLmZI9BzWsUVbl4u5fY45fer8Bds5FHlQLgzNSxjwTN\r\neDuy7IHWcSf/aj5fuAYHFoelB5pEZhZHbFXB15cS4RCABGQKHPt40wtqwfVm\r\nY15yh5bZqlNW8YAMpyN5RRDkw/OLNuZIOA0K9FWKIuDdvoLtg9VJDRoHq9sq\r\nSa8Kshzeob2Tk1RpAKgrVneavom04kpVZLefLRdgfBALqFMWntWiuJHTRqhX\r\ndA2ln53kOBqS1HDPWPZmZnYD1LAYUoaFBUwOLG7vvECwA8W9E1dAYTg5sQEv\r\nHX5MO02LpURqopN6rSd2hcFHmkMg5Jju3/rB4BlxM/q+aysuk4uQBHixiEB8\r\nsB0lpKbP3QKgE/vAuZXdcCDLL7HmsS5B/UCTRMSjiL536nPptCRJJP628FNX\r\njjBzasMhML8iPLgDB8hE5iN4lkyDvoe7u+PHteBXHLTogDBk9HYRYJX9xlKX\r\n4j6z5yQTks5cfq2VSjyWKrescn+0OSKDqUE97gRqHQLy7JorWMEQ4GAEp8j/\r\nTna8snjc969KXcOiT7+LGGgPNWscM5i+W/1JkKsIh9cNwxJKURJfO/GHtF1I\r\nW8DNVRCavroOTg0yCnIfyZ3gR4ziOP/EWlU=\r\n=Ak5c\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"adriandiaz","email":"adrian@longweekend.io"},"directories":{},"maintainers":[{"name":"adriandiaz","email":"adrian@longweekend.io"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-native-iphone-x-helper_1.3.2_1676075028660_0.8193328058094522"},"_hasShrinkwrap":false}},"time":{"created":"2023-02-11T00:23:48.604Z","1.3.2":"2023-02-11T00:23:48.841Z","modified":"2023-02-11T00:23:49.072Z"},"maintainers":[{"name":"adriandiaz","email":"adrian@longweekend.io"}],"description":"A library to help you design your react-native app for the iPhone X","homepage":"https://github.com/ptelad/react-native-iphone-x-helper#readme","keywords":["react-native","ios","iphone-x","iphoneX","stylesheet"],"repository":{"type":"git","url":"git+https://github.com/ptelad/react-native-iphone-x-helper.git"},"author":{"name":"Elad Gil"},"bugs":{"url":"https://github.com/ptelad/react-native-iphone-x-helper/issues"},"license":"MIT","readme":"## ❗❗❗ PLEASE NOTICE ❗❗❗ This package is not longer maintained, plaease use alternatives like `react-native-safe-area-context`\n\n[![npm version](https://badge.fury.io/js/react-native-iphone-x-helper.svg)](https://badge.fury.io/js/react-native-iphone-x-helper)\n\n# react-native-iphone-x-helper\nA library to help you design your react-native app for notched iPhones.\n\n## Installing ##\n`npm i react-native-iphone-x-helper --save`\n\n## API ##\n\n### ifIphoneX(iphoneXStyle, \\[regularStyle\\]) ###\nthis method it for creating stylesheets with the iPhone X in mind\n\n#### Parameters ####\n**iphoneXStyle** - the style to apply if you're on iPhone X\n\n**regularStyle (*optional*)** - the style to apply if you're not on iPhone X\n\n#### Example ####\n```js\n// in style.js\n\nimport { StyleSheet } from 'react-native';\nimport { ifIphoneX } from 'react-native-iphone-x-helper'\n\nexport default StyleSheet.create({\n    header:{\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        padding:10,\n        height: 60,\n        backgroundColor: 'transparent',\n        ...ifIphoneX({\n            paddingTop: 50\n        }, {\n            paddingTop: 20\n        })\n    },\n});\n```\n\n### isIphoneX() ###\n\n**returns** - `true` if you running on an iPhone X.\n\n#### Example ####\n```js\nimport { isIphoneX } from 'react-native-iphone-x-helper'\n\n// ...\n\nif (isIphoneX()) {\n    // do this...\n} else {\n    // do that...\n}\n```\n\n### getStatusBarHeight([safe]) ###\n\n#### Parameters ####\n**safe** - whether you want for get safe area height or not\n\n**returns** - the height of the status bar: `44` for safe iPhoneX, `30` for unsafe iPhoneX, `20` for other iOS devices and `StatusBar.currentHeight` for Android.\n\n#### Example ####\n\n```js\n// in style.js\n\nimport { StyleSheet } from 'react-native';\nimport { getStatusBarHeight } from 'react-native-iphone-x-helper'\n\nexport default StyleSheet.create({\n    header:{\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        padding:10,\n        height: 60,\n        backgroundColor: 'transparent',\n        paddingTop: getStatusBarHeight()\n    },\n});\n```\n\n***NOTE:*** If your using the the unsafe statusbar height, make sure to add 14dp of padding to your content, otherwise it's going to be flush against the notch\n\n### getBottomSpace ###\n\n**returns** - the height of the bottom to fit the safe area: `34` for iPhone X and `0` for other devices.\n\n#### Example ####\n\n```js\n// in style.js\n\nimport { StyleSheet } from 'react-native';\nimport { getBottomSpace } from 'react-native-iphone-x-helper'\n\nexport default StyleSheet.create({\n    totalview: {\n        flex: 1,\n        backgroundColor: 'transparent',\n        marginBottom: getBottomSpace()\n    },\n});\n```\n\n## Licence ##\n**MIT**\n","readmeFilename":"README.md"}