From 228032961a858f14008d8eb9ada1b4432290f4eb Mon Sep 17 00:00:00 2001 From: Mostafa Date: Mon, 7 Feb 2022 22:59:46 +0330 Subject: [PATCH 1/9] Add willNotShowPrompt callback function --- dist/react-ios-pwa-prompt.js | 2 +- package.json | 2 +- src/index.js | 8 ++++++++ 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/dist/react-ios-pwa-prompt.js b/dist/react-ios-pwa-prompt.js index 6696405..91de9d6 100644 --- a/dist/react-ios-pwa-prompt.js +++ b/dist/react-ios-pwa-prompt.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("react-ios-pwa-prompt",["React"],t):"object"==typeof exports?exports["react-ios-pwa-prompt"]=t(require("react")):e["react-ios-pwa-prompt"]=t(e.React)}(global,(function(e){return function(e){var t={};function r(o){if(t[o])return t[o].exports;var n=t[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,o){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(o,n,function(t){return e[t]}.bind(null,n));return o},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/dist/",r(r.s=5)}([function(t,r){t.exports=e},function(e,t,r){var o=r(2),n=r(3);"string"==typeof(n=n.__esModule?n.default:n)&&(n=[[e.i,n,""]]);var a={insert:"head",singleton:!1},c=(o(n,a),n.locals?n.locals:{});e.exports=c},function(e,t,r){"use strict";var o,n=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},a=function(){var e={};return function(t){if(void 0===e[t]){var r=document.querySelector(t);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}e[t]=r}return e[t]}}(),c=[];function i(e){for(var t=-1,r=0;re.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(k))),k.isiOS||E){var C=k.visits+1>=l;if((k.visits+1e.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(M))),M.isiOS||E){var I=M.visits+1>=l;if((M.visits+1 {}, + willNotShowPrompt = () => {}, }) => { let promptData = JSON.parse(localStorage.getItem("iosPwaPrompt")); @@ -66,5 +67,12 @@ export default ({ } } + /** + * Check prompt will show + */ + if (!promptData.isiOS || !aboveMinVisits || !belowMaxVisits) { + willNotShowPrompt() + } + return null; }; From 3ee87100d29779c24f11c95523f388e159a5bcab Mon Sep 17 00:00:00 2001 From: Mostafa Date: Mon, 7 Feb 2022 23:14:06 +0330 Subject: [PATCH 2/9] Fix aboveMin and belowMax --- package.json | 2 +- src/index.js | 5 +++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 9b4db69..1d2059e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-ios-pwa-prompt", - "version": "1.8.4", + "version": "1.8.5", "description": "A React component to prompt the user to add the app as a PWA to the home screen with native iOS styles.", "repository": { "type": "git", diff --git a/src/index.js b/src/index.js index a0ee1a9..e93a878 100644 --- a/src/index.js +++ b/src/index.js @@ -35,9 +35,10 @@ export default ({ localStorage.setItem("iosPwaPrompt", JSON.stringify(promptData)); } + const aboveMinVisits = promptData.visits + 1 >= promptOnVisit; + const belowMaxVisits = promptData.visits + 1 < promptOnVisit + timesToShow; + if (promptData.isiOS || debug) { - const aboveMinVisits = promptData.visits + 1 >= promptOnVisit; - const belowMaxVisits = promptData.visits + 1 < promptOnVisit + timesToShow; if (belowMaxVisits || debug) { localStorage.setItem( From 5e4b493a6e29eab9d8668c58dbe00d3ffddf5055 Mon Sep 17 00:00:00 2001 From: Mostafa Date: Mon, 7 Feb 2022 23:20:00 +0330 Subject: [PATCH 3/9] Build the source --- dist/react-ios-pwa-prompt.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dist/react-ios-pwa-prompt.js b/dist/react-ios-pwa-prompt.js index 91de9d6..fb80f1c 100644 --- a/dist/react-ios-pwa-prompt.js +++ b/dist/react-ios-pwa-prompt.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("react-ios-pwa-prompt",["React"],t):"object"==typeof exports?exports["react-ios-pwa-prompt"]=t(require("react")):e["react-ios-pwa-prompt"]=t(e.React)}(global,(function(e){return function(e){var t={};function r(o){if(t[o])return t[o].exports;var n=t[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,o){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(o,n,function(t){return e[t]}.bind(null,n));return o},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/dist/",r(r.s=5)}([function(t,r){t.exports=e},function(e,t,r){var o=r(2),n=r(3);"string"==typeof(n=n.__esModule?n.default:n)&&(n=[[e.i,n,""]]);var a={insert:"head",singleton:!1},c=(o(n,a),n.locals?n.locals:{});e.exports=c},function(e,t,r){"use strict";var o,n=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},a=function(){var e={};return function(t){if(void 0===e[t]){var r=document.querySelector(t);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}e[t]=r}return e[t]}}(),c=[];function i(e){for(var t=-1,r=0;re.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(M))),M.isiOS||E){var I=M.visits+1>=l;if((M.visits+1e.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(M)));var I=M.visits+1>=l,H=M.visits+1 Date: Mon, 7 Feb 2022 23:40:10 +0330 Subject: [PATCH 4/9] Fix count error --- src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index e93a878..f974b6a 100644 --- a/src/index.js +++ b/src/index.js @@ -14,7 +14,7 @@ const deviceCheck = () => { return (isiOS || isiPadOS) && !isStandalone; }; -export default ({ +export default React.memo(({ timesToShow = 1, promptOnVisit = 1, permanentlyHideOnDismiss = true, @@ -76,4 +76,4 @@ export default ({ } return null; -}; +}); From 0bcd6d88460f2be69db265b3e8b3d23923d4c3a9 Mon Sep 17 00:00:00 2001 From: Mostafa Date: Mon, 7 Feb 2022 23:43:00 +0330 Subject: [PATCH 5/9] Build the source --- dist/react-ios-pwa-prompt.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dist/react-ios-pwa-prompt.js b/dist/react-ios-pwa-prompt.js index fb80f1c..2705b66 100644 --- a/dist/react-ios-pwa-prompt.js +++ b/dist/react-ios-pwa-prompt.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("react-ios-pwa-prompt",["React"],t):"object"==typeof exports?exports["react-ios-pwa-prompt"]=t(require("react")):e["react-ios-pwa-prompt"]=t(e.React)}(global,(function(e){return function(e){var t={};function r(o){if(t[o])return t[o].exports;var n=t[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,o){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(o,n,function(t){return e[t]}.bind(null,n));return o},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/dist/",r(r.s=5)}([function(t,r){t.exports=e},function(e,t,r){var o=r(2),n=r(3);"string"==typeof(n=n.__esModule?n.default:n)&&(n=[[e.i,n,""]]);var a={insert:"head",singleton:!1},c=(o(n,a),n.locals?n.locals:{});e.exports=c},function(e,t,r){"use strict";var o,n=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},a=function(){var e={};return function(t){if(void 0===e[t]){var r=document.querySelector(t);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}e[t]=r}return e[t]}}(),c=[];function i(e){for(var t=-1,r=0;re.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(M)));var I=M.visits+1>=l,H=M.visits+1e.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(M)));var I=M.visits+1>=l,H=M.visits+1 Date: Fri, 11 Feb 2022 15:34:27 +0330 Subject: [PATCH 6/9] Add support for RTL --- dist/react-ios-pwa-prompt.js | 2 +- src/components/PWAPrompt.js | 15 ++++++++++++--- src/components/PWAPrompt.styles.scss | 3 --- src/index.js | 5 ++++- 4 files changed, 17 insertions(+), 8 deletions(-) diff --git a/dist/react-ios-pwa-prompt.js b/dist/react-ios-pwa-prompt.js index 2705b66..dfdff7e 100644 --- a/dist/react-ios-pwa-prompt.js +++ b/dist/react-ios-pwa-prompt.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("react-ios-pwa-prompt",["React"],t):"object"==typeof exports?exports["react-ios-pwa-prompt"]=t(require("react")):e["react-ios-pwa-prompt"]=t(e.React)}(global,(function(e){return function(e){var t={};function r(o){if(t[o])return t[o].exports;var n=t[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,o){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(o,n,function(t){return e[t]}.bind(null,n));return o},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/dist/",r(r.s=5)}([function(t,r){t.exports=e},function(e,t,r){var o=r(2),n=r(3);"string"==typeof(n=n.__esModule?n.default:n)&&(n=[[e.i,n,""]]);var a={insert:"head",singleton:!1},c=(o(n,a),n.locals?n.locals:{});e.exports=c},function(e,t,r){"use strict";var o,n=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},a=function(){var e={};return function(t){if(void 0===e[t]){var r=document.querySelector(t);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}e[t]=r}return e[t]}}(),c=[];function i(e){for(var t=-1,r=0;re.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(M)));var I=M.visits+1>=l,H=M.visits+1e.length)&&(t=e.length);for(var r=0,o=new Array(t);r1,o="standalone"in window.navigator&&window.navigator.standalone,(t||r)&&!o),visits:0},localStorage.setItem("iosPwaPrompt",JSON.stringify(H)));var B=H.visits+1>=l,L=H.visits+1 { const [isVisible, setVisibility] = useState(!Boolean(delay)); @@ -41,6 +43,8 @@ const PWAPrompt = ({ const isiOS13AndUp = /OS (13|14)/.test(window.navigator.userAgent); const visibilityClass = isVisible ? styles.visible : styles.hidden; const iOSClass = isiOS13AndUp ? styles.modern : "legacy"; + const marginText = dir === "ltr" ? {marginLeft : 32} : {marginRight: 32}; + const customFontFamily = {fontFamily: font_family}; const dismissPrompt = (evt) => { document.body.classList.remove(styles.noScroll); @@ -83,31 +87,34 @@ const PWAPrompt = ({ role="dialog" onTransitionEnd={onTransitionOut} > -
+

{copyTitle}

-
+

{copyBody}

-
+

{copyShareButtonLabel}

@@ -126,6 +134,7 @@ const PWAPrompt = ({ />

{copyAddHomeButtonLabel}

diff --git a/src/components/PWAPrompt.styles.scss b/src/components/PWAPrompt.styles.scss index d88ab5e..08aca20 100644 --- a/src/components/PWAPrompt.styles.scss +++ b/src/components/PWAPrompt.styles.scss @@ -125,7 +125,6 @@ $blue-color-modern-dark: rgba(9, 132, 255, 1); .pwaPromptTitle { color: $title-color-legacy; - font-family: $font-family; font-size: 18px; font-weight: 500; line-height: 1.125; @@ -192,7 +191,6 @@ $blue-color-modern-dark: rgba(9, 132, 255, 1); .pwaPromptCopy { color: $font-color-legacy; - font-family: $font-family; font-size: 13px; line-height: 17px; margin: 0; @@ -236,7 +234,6 @@ $blue-color-modern-dark: rgba(9, 132, 255, 1); .pwaPromptHomeIcon { flex: 0 0 auto; height: 30px; - margin-right: 32px; width: 25px; } diff --git a/src/index.js b/src/index.js index f974b6a..218d70d 100644 --- a/src/index.js +++ b/src/index.js @@ -27,9 +27,10 @@ export default React.memo(({ debug = false, onClose = () => {}, willNotShowPrompt = () => {}, + dir = "ltr", + font_family = "-apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto,'Helvetica Neue', Arial, sans-serif", }) => { let promptData = JSON.parse(localStorage.getItem("iosPwaPrompt")); - if (promptData === null) { promptData = { isiOS: deviceCheck(), visits: 0 }; localStorage.setItem("iosPwaPrompt", JSON.stringify(promptData)); @@ -62,6 +63,8 @@ export default React.memo(({ promptData={promptData} maxVisits={timesToShow + promptOnVisit} onClose={onClose} + dir={dir} + font_family={font_family} /> ); } From 6d17d2f703b7fd08162793bd74de39a72c05f11f Mon Sep 17 00:00:00 2001 From: Mostafa Date: Fri, 11 Feb 2022 15:39:03 +0330 Subject: [PATCH 7/9] Update creator --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 1d2059e..f678983 100644 --- a/package.json +++ b/package.json @@ -1,10 +1,10 @@ { "name": "react-ios-pwa-prompt", - "version": "1.8.5", + "version": "1.8.4", "description": "A React component to prompt the user to add the app as a PWA to the home screen with native iOS styles.", "repository": { "type": "git", - "url": "https://github.com/flashift/react-ios-pwa-prompt.git" + "url": "https://github.com/chrisdancee/react-ios-pwa-prompt.git" }, "main": "./dist/react-ios-pwa-prompt.js", "scripts": { From f8f2f1147a23685f00a8e28e647dd76eb3082f48 Mon Sep 17 00:00:00 2001 From: Mostafa Date: Tue, 5 Apr 2022 19:20:37 +0430 Subject: [PATCH 8/9] Fix: update the README file --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index d70649f..69e7f0b 100644 --- a/README.md +++ b/README.md @@ -21,6 +21,8 @@ A React component that provides a customisable Progressive Web App (PWA) prompt - ⚡️ Efficient. Very little overhead for non-iOS devices and does as little work as needed for each page load. - 📱 Detects user's iOS version to provide the correct icon set. - 🌕 Will display a dark mode if enabled on iOS 13 and 14. +- Support RTL languages like Arabic, Farsi, Persian, ... +- Custom font ## Usage From ead94244a01eb5181ac6a4ef206d75fb143f93e9 Mon Sep 17 00:00:00 2001 From: Mostafa Date: Thu, 5 May 2022 02:53:22 +0430 Subject: [PATCH 9/9] Fix: update dependencies --- package.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index f678983..a8e67e5 100644 --- a/package.json +++ b/package.json @@ -27,11 +27,11 @@ "react-dom": ">=16.8.0" }, "devDependencies": { - "@babel/cli": "^7.8.4", - "@babel/core": "^7.9.0", - "@babel/preset-env": "^7.9.0", + "@babel/cli": "^7.17.10", + "@babel/core": "^7.17.10", + "@babel/preset-env": "^7.17.10", "@babel/preset-react": "^7.9.4", - "babel-loader": "^8.1.0", + "babel-loader": "^8.2.5", "css-loader": "^3.4.2", "node-sass": "^4.13.1", "path": "^0.12.7",