├── .gitignore ├── .idea ├── .gitignore ├── cssplugin.iml ├── deployment.xml ├── inspectionProfiles │ └── Project_Default.xml ├── misc.xml ├── modules.xml └── vcs.xml ├── README.md ├── build ├── asset-manifest.json ├── background.js ├── content.js ├── favicon.png ├── icon128.png ├── icon16.png ├── icon48.png ├── index.html ├── jquery.js ├── manifest.json ├── precache-manifest.93475abc6bb8a041da4e8a160ed243ba.js ├── service-worker.js └── static │ ├── css │ ├── main.f1ae687b.chunk.css │ └── main.f1ae687b.chunk.css.map │ └── js │ ├── 2.1195147c.chunk.js │ ├── 2.1195147c.chunk.js.map │ ├── main.2223e5fe.chunk.js │ ├── main.2223e5fe.chunk.js.map │ ├── runtime-main.0d1674f1.js │ └── runtime-main.0d1674f1.js.map ├── package-lock.json ├── package.json ├── public ├── background.js ├── content.js ├── favicon.png ├── icon128.png ├── icon16.png ├── icon48.png ├── index.html ├── jquery.js └── manifest.json ├── react-chrome-extension.png └── src ├── App.css ├── App.js ├── Components └── Modal.js ├── Contexts └── ModalProvider.js ├── Hooks └── useWindowPosition.js └── index.js /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | 9 | # Diagnostic reports (https://nodejs.org/api/report.html) 10 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 11 | 12 | # Runtime data 13 | pids 14 | *.pid 15 | *.seed 16 | *.pid.lock 17 | 18 | # Directory for instrumented libs generated by jscoverage/JSCover 19 | lib-cov 20 | 21 | # Coverage directory used by tools like istanbul 22 | coverage 23 | *.lcov 24 | 25 | # nyc test coverage 26 | .nyc_output 27 | 28 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 29 | .grunt 30 | 31 | # Bower dependency directory (https://bower.io/) 32 | bower_components 33 | 34 | # node-waf configuration 35 | .lock-wscript 36 | 37 | # Compiled binary addons (https://nodejs.org/api/addons.html) 38 | build/Release 39 | 40 | # Dependency directories 41 | node_modules/ 42 | jspm_packages/ 43 | 44 | # TypeScript v1 declaration files 45 | typings/ 46 | 47 | # TypeScript cache 48 | *.tsbuildinfo 49 | 50 | # Optional npm cache directory 51 | .npm 52 | 53 | # Optional eslint cache 54 | .eslintcache 55 | 56 | # Microbundle cache 57 | .rpt2_cache/ 58 | .rts2_cache_cjs/ 59 | .rts2_cache_es/ 60 | .rts2_cache_umd/ 61 | 62 | # Optional REPL history 63 | .node_repl_history 64 | 65 | # Output of 'npm pack' 66 | *.tgz 67 | 68 | # Yarn Integrity file 69 | .yarn-integrity 70 | 71 | # dotenv environment variables file 72 | .env 73 | .env.test 74 | 75 | # parcel-bundler cache (https://parceljs.org/) 76 | .cache 77 | 78 | # Next.js build output 79 | .next 80 | 81 | # Nuxt.js build / generate output 82 | .nuxt 83 | dist 84 | 85 | # Gatsby files 86 | .cache/ 87 | # Comment in the public line in if your project uses Gatsby and *not* Next.js 88 | # https://nextjs.org/blog/next-9-1#public-directory-support 89 | # public 90 | 91 | # vuepress build output 92 | .vuepress/dist 93 | 94 | # Serverless directories 95 | .serverless/ 96 | 97 | # FuseBox cache 98 | .fusebox/ 99 | 100 | # DynamoDB Local files 101 | .dynamodb/ 102 | 103 | # TernJS port file 104 | .tern-port 105 | -------------------------------------------------------------------------------- /.idea/.gitignore: -------------------------------------------------------------------------------- 1 | # Default ignored files 2 | /workspace.xml -------------------------------------------------------------------------------- /.idea/cssplugin.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/deployment.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /.idea/inspectionProfiles/Project_Default.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | -------------------------------------------------------------------------------- /.idea/misc.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## react-chrome-extension 2 | ![Alt text](./react-chrome-extension.png?raw=true "Optional Title") 3 | 4 | This is the first in a series of React boilerplate projects to help web developers learn and understand React. This project actually came about as I was creating my latest project, [StyleStash - Save Your favorite CSS Styles](https://stylestash.dev). 5 | 6 | ## Video Code Walkthrough 7 | 8 | If you're more of a visual learner, I've recorded a [20 minute video walkthrough of this project](https://www.youtube.com/watch?v=4x0lQu1TOCQ). 9 | 10 | ### Local Testing 11 | 12 | `npm start` 13 | 14 | Runs the app in the development mode.
15 | Open [http://localhost:3000](http://localhost:3000) to view it in the browser. 16 | 17 | ### Testing Inside Chrome 18 | 19 | This project needs to be built in order to take advantage of the Chrome Extension API, such as using the Content script to get the extension's ID, or using the Chrome Storage API. These features cannot be used when running this project locally. 20 | 21 | To load as a developer extension inside of Chrome: 22 | 23 | 1. `npm run build`
24 | 2. Navigate to `chrome://extensions/` in your browser
25 | 3. Toggle the `Developer mode` switch on in the top right hand corner
26 | 4. Click the `Load unpacked` button in the top left corner
27 | 5. Select the `build` folder inside of this project folder
28 | 29 | Builds the app for Chrome to the `build` folder.
30 | 31 | -------------------------------------------------------------------------------- /build/asset-manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "files": { 3 | "main.css": "/static/css/main.f1ae687b.chunk.css", 4 | "main.js": "/static/js/main.2223e5fe.chunk.js", 5 | "main.js.map": "/static/js/main.2223e5fe.chunk.js.map", 6 | "runtime-main.js": "/static/js/runtime-main.0d1674f1.js", 7 | "runtime-main.js.map": "/static/js/runtime-main.0d1674f1.js.map", 8 | "static/js/2.1195147c.chunk.js": "/static/js/2.1195147c.chunk.js", 9 | "static/js/2.1195147c.chunk.js.map": "/static/js/2.1195147c.chunk.js.map", 10 | "index.html": "/index.html", 11 | "precache-manifest.93475abc6bb8a041da4e8a160ed243ba.js": "/precache-manifest.93475abc6bb8a041da4e8a160ed243ba.js", 12 | "service-worker.js": "/service-worker.js", 13 | "static/css/main.f1ae687b.chunk.css.map": "/static/css/main.f1ae687b.chunk.css.map" 14 | } 15 | } -------------------------------------------------------------------------------- /build/background.js: -------------------------------------------------------------------------------- 1 | /* global chrome */ 2 | 3 | chrome.browserAction.onClicked.addListener(function(tab) { 4 | chrome.tabs.sendMessage(tab.id, { message: 'load' }); 5 | }); 6 | -------------------------------------------------------------------------------- /build/content.js: -------------------------------------------------------------------------------- 1 | /* global chrome */ 2 | 3 | chrome.runtime.onMessage.addListener(function(request, sender, callback) { 4 | main(); 5 | }); 6 | 7 | function main() { 8 | // eslint-disable-next-line no-undef 9 | const extensionOrigin = 'chrome-extension://' + chrome.runtime.id; 10 | // eslint-disable-next-line no-restricted-globals 11 | if (!location.ancestorOrigins.contains(extensionOrigin)) { 12 | // Fetch the local React index.html page 13 | // eslint-disable-next-line no-undef 14 | fetch(chrome.runtime.getURL('index.html') /*, options */) 15 | .then((response) => response.text()) 16 | .then((html) => { 17 | const styleStashHTML = html.replace(/\/static\//g, `${extensionOrigin}/static/`); 18 | // eslint-disable-next-line no-undef 19 | $(styleStashHTML).appendTo('body'); 20 | }) 21 | .catch((error) => { 22 | console.warn(error); 23 | }); 24 | } 25 | } 26 | 27 | window.addEventListener("message", function(event) { 28 | if (event.source !== window) return; 29 | onDidReceiveMessage(event); 30 | }); 31 | 32 | async function onDidReceiveMessage(event) { 33 | if (event.data.type && (event.data.type === "GET_EXTENSION_ID")) { 34 | window.postMessage({ type: "EXTENSION_ID_RESULT", extensionId: chrome.runtime.id }, "*"); 35 | } 36 | } 37 | 38 | 39 | -------------------------------------------------------------------------------- /build/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/build/favicon.png -------------------------------------------------------------------------------- /build/icon128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/build/icon128.png -------------------------------------------------------------------------------- /build/icon16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/build/icon16.png -------------------------------------------------------------------------------- /build/icon48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/build/icon48.png -------------------------------------------------------------------------------- /build/index.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /build/jquery.js: -------------------------------------------------------------------------------- 1 | /*! jQuery v3.4.1 | (c) JS Foundation and other contributors | jquery.org/license */ 2 | !function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],E=C.document,r=Object.getPrototypeOf,s=t.slice,g=t.concat,u=t.push,i=t.indexOf,n={},o=n.toString,v=n.hasOwnProperty,a=v.toString,l=a.call(Object),y={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType},x=function(e){return null!=e&&e===e.window},c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.4.1",k=function(e,t){return new k.fn.init(e,t)},p=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function d(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp($),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+$),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\([\\da-f]{1,6}"+M+"?|("+M+")|.)","ig"),ne=function(e,t,n){var r="0x"+t-65536;return r!=r||n?t:r<0?String.fromCharCode(r+65536):String.fromCharCode(r>>10|55296,1023&r|56320)},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(m.childNodes),m.childNodes),t[m.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&((e?e.ownerDocument||e:m)!==C&&T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&y(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!A[t+" "]&&(!v||!v.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&U.test(t)){(s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=k),o=(l=h(t)).length;while(o--)l[o]="#"+s+" "+xe(l[o]);c=l.join(","),f=ee.test(t)&&ye(e.parentNode)||e}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){A(t,!0)}finally{s===k&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[k]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ve(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ye(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e.namespaceURI,n=(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:m;return r!==C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),m!==C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=k,!C.getElementsByName||!C.getElementsByName(k).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],v=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){a.appendChild(e).innerHTML="",e.querySelectorAll("[msallowcapture^='']").length&&v.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||v.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+k+"-]").length||v.push("~="),e.querySelectorAll(":checked").length||v.push(":checked"),e.querySelectorAll("a#"+k+"+*").length||v.push(".#.+[+~]")}),ce(function(e){e.innerHTML="";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&v.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&v.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&v.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),v.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",$)}),v=v.length&&new RegExp(v.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),y=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},D=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)===(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e===C||e.ownerDocument===m&&y(m,e)?-1:t===C||t.ownerDocument===m&&y(m,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e===C?-1:t===C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]===m?-1:s[r]===m?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if((e.ownerDocument||e)!==C&&T(e),d.matchesSelector&&E&&!A[t+" "]&&(!s||!s.test(t))&&(!v||!v.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){A(t,!0)}return 0":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=p[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&p(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?k.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?k.grep(e,function(e){return e===n!==r}):"string"!=typeof n?k.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(k.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||q,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:L.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof k?t[0]:t,k.merge(this,k.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),D.test(r[1])&&k.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(k):k.makeArray(e,this)}).prototype=k.fn,q=k(E);var H=/^(?:parents|prev(?:Until|All))/,O={children:!0,contents:!0,next:!0,prev:!0};function P(e,t){while((e=e[t])&&1!==e.nodeType);return e}k.fn.extend({has:function(e){var t=k(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i,ge={option:[1,""],thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function ve(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?k.merge([e],n):n}function ye(e,t){for(var n=0,r=e.length;nx",y.noCloneChecked=!!me.cloneNode(!0).lastChild.defaultValue;var Te=/^key/,Ce=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,Ee=/^([^.]*)(?:\.(.+)|)/;function ke(){return!0}function Se(){return!1}function Ne(e,t){return e===function(){try{return E.activeElement}catch(e){}}()==("focus"===t)}function Ae(e,t,n,r,i,o){var a,s;if("object"==typeof t){for(s in"string"!=typeof n&&(r=r||n,n=void 0),t)Ae(e,s,n,r,t[s],o);return e}if(null==r&&null==i?(i=n,r=n=void 0):null==i&&("string"==typeof n?(i=r,r=void 0):(i=r,r=n,n=void 0)),!1===i)i=Se;else if(!i)return e;return 1===o&&(a=i,(i=function(e){return k().off(e),a.apply(this,arguments)}).guid=a.guid||(a.guid=k.guid++)),e.each(function(){k.event.add(this,t,i,r,n)})}function De(e,i,o){o?(Q.set(e,i,!1),k.event.add(e,i,{namespace:!1,handler:function(e){var t,n,r=Q.get(this,i);if(1&e.isTrigger&&this[i]){if(r.length)(k.event.special[i]||{}).delegateType&&e.stopPropagation();else if(r=s.call(arguments),Q.set(this,i,r),t=o(this,i),this[i](),r!==(n=Q.get(this,i))||t?Q.set(this,i,!1):n={},r!==n)return e.stopImmediatePropagation(),e.preventDefault(),n.value}else r.length&&(Q.set(this,i,{value:k.event.trigger(k.extend(r[0],k.Event.prototype),r.slice(1),this)}),e.stopImmediatePropagation())}})):void 0===Q.get(e,i)&&k.event.add(e,i,ke)}k.event={global:{},add:function(t,e,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.get(t);if(v){n.handler&&(n=(o=n).handler,i=o.selector),i&&k.find.matchesSelector(ie,i),n.guid||(n.guid=k.guid++),(u=v.events)||(u=v.events={}),(a=v.handle)||(a=v.handle=function(e){return"undefined"!=typeof k&&k.event.triggered!==e.type?k.event.dispatch.apply(t,arguments):void 0}),l=(e=(e||"").match(R)||[""]).length;while(l--)d=g=(s=Ee.exec(e[l])||[])[1],h=(s[2]||"").split(".").sort(),d&&(f=k.event.special[d]||{},d=(i?f.delegateType:f.bindType)||d,f=k.event.special[d]||{},c=k.extend({type:d,origType:g,data:r,handler:n,guid:n.guid,selector:i,needsContext:i&&k.expr.match.needsContext.test(i),namespace:h.join(".")},o),(p=u[d])||((p=u[d]=[]).delegateCount=0,f.setup&&!1!==f.setup.call(t,r,h,a)||t.addEventListener&&t.addEventListener(d,a)),f.add&&(f.add.call(t,c),c.handler.guid||(c.handler.guid=n.guid)),i?p.splice(p.delegateCount++,0,c):p.push(c),k.event.global[d]=!0)}},remove:function(e,t,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.hasData(e)&&Q.get(e);if(v&&(u=v.events)){l=(t=(t||"").match(R)||[""]).length;while(l--)if(d=g=(s=Ee.exec(t[l])||[])[1],h=(s[2]||"").split(".").sort(),d){f=k.event.special[d]||{},p=u[d=(r?f.delegateType:f.bindType)||d]||[],s=s[2]&&new RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"),a=o=p.length;while(o--)c=p[o],!i&&g!==c.origType||n&&n.guid!==c.guid||s&&!s.test(c.namespace)||r&&r!==c.selector&&("**"!==r||!c.selector)||(p.splice(o,1),c.selector&&p.delegateCount--,f.remove&&f.remove.call(e,c));a&&!p.length&&(f.teardown&&!1!==f.teardown.call(e,h,v.handle)||k.removeEvent(e,d,v.handle),delete u[d])}else for(d in u)k.event.remove(e,d+t[l],n,r,!0);k.isEmptyObject(u)&&Q.remove(e,"handle events")}},dispatch:function(e){var t,n,r,i,o,a,s=k.event.fix(e),u=new Array(arguments.length),l=(Q.get(this,"events")||{})[s.type]||[],c=k.event.special[s.type]||{};for(u[0]=s,t=1;t\x20\t\r\n\f]*)[^>]*)\/>/gi,qe=/\s*$/g;function Oe(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&k(e).children("tbody")[0]||e}function Pe(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function Re(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Me(e,t){var n,r,i,o,a,s,u,l;if(1===t.nodeType){if(Q.hasData(e)&&(o=Q.access(e),a=Q.set(t,o),l=o.events))for(i in delete a.handle,a.events={},l)for(n=0,r=l[i].length;n")},clone:function(e,t,n){var r,i,o,a,s,u,l,c=e.cloneNode(!0),f=oe(e);if(!(y.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||k.isXMLDoc(e)))for(a=ve(c),r=0,i=(o=ve(e)).length;r").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Vt,Gt=[],Yt=/(=)\?(?=&|$)|\?\?/;k.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Gt.pop()||k.expando+"_"+kt++;return this[e]=!0,e}}),k.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Yt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Yt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Yt,"$1"+r):!1!==e.jsonp&&(e.url+=(St.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||k.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?k(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Gt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),y.createHTMLDocument=((Vt=E.implementation.createHTMLDocument("").body).innerHTML="
",2===Vt.childNodes.length),k.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(y.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=D.exec(e))?[t.createElement(i[1])]:(i=we([e],t,o),o&&o.length&&k(o).remove(),k.merge([],i.childNodes)));var r,i,o},k.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(k.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},k.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){k.fn[t]=function(e){return this.on(t,e)}}),k.expr.pseudos.animated=function(t){return k.grep(k.timers,function(e){return t===e.elem}).length},k.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=k.css(e,"position"),c=k(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=k.css(e,"top"),u=k.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,k.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},k.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){k.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===k.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===k.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=k(e).offset()).top+=k.css(e,"borderTopWidth",!0),i.left+=k.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-k.css(r,"marginTop",!0),left:t.left-i.left-k.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===k.css(e,"position"))e=e.offsetParent;return e||ie})}}),k.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;k.fn[t]=function(e){return _(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),k.each(["top","left"],function(e,n){k.cssHooks[n]=ze(y.pixelPosition,function(e,t){if(t)return t=_e(e,n),$e.test(t)?k(e).position()[n]+"px":t})}),k.each({Height:"height",Width:"width"},function(a,s){k.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){k.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return _(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?k.css(e,t,i):k.style(e,t,n,i)},s,n?e:void 0,n)}})}),k.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){k.fn[n]=function(e,t){return 0"], 21 | "all_frames": true, 22 | "js": [ 23 | "./content.js", 24 | "./jquery.js" 25 | ], 26 | "run_at": "document_end" 27 | }], 28 | "permissions": [ 29 | "activeTab" 30 | ], 31 | "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", 32 | "web_accessible_resources": [ 33 | "index.html", 34 | "/static/*" 35 | ] 36 | } 37 | -------------------------------------------------------------------------------- /build/precache-manifest.93475abc6bb8a041da4e8a160ed243ba.js: -------------------------------------------------------------------------------- 1 | self.__precacheManifest = (self.__precacheManifest || []).concat([ 2 | { 3 | "revision": "94edd759adf37dd50401f755fc29f635", 4 | "url": "/index.html" 5 | }, 6 | { 7 | "revision": "61ee65fcb7b95859df28", 8 | "url": "/static/css/main.f1ae687b.chunk.css" 9 | }, 10 | { 11 | "revision": "eb5428dbf24a874e1f47", 12 | "url": "/static/js/2.1195147c.chunk.js" 13 | }, 14 | { 15 | "revision": "61ee65fcb7b95859df28", 16 | "url": "/static/js/main.2223e5fe.chunk.js" 17 | }, 18 | { 19 | "revision": "e52355ce7cf88029702e", 20 | "url": "/static/js/runtime-main.0d1674f1.js" 21 | } 22 | ]); -------------------------------------------------------------------------------- /build/service-worker.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Welcome to your Workbox-powered service worker! 3 | * 4 | * You'll need to register this file in your web app and you should 5 | * disable HTTP caching for this file too. 6 | * See https://goo.gl/nhQhGp 7 | * 8 | * The rest of the code is auto-generated. Please don't update this file 9 | * directly; instead, make changes to your Workbox build configuration 10 | * and re-run your build process. 11 | * See https://goo.gl/2aRDsh 12 | */ 13 | 14 | importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js"); 15 | 16 | importScripts( 17 | "/precache-manifest.93475abc6bb8a041da4e8a160ed243ba.js" 18 | ); 19 | 20 | self.addEventListener('message', (event) => { 21 | if (event.data && event.data.type === 'SKIP_WAITING') { 22 | self.skipWaiting(); 23 | } 24 | }); 25 | 26 | workbox.core.clientsClaim(); 27 | 28 | /** 29 | * The workboxSW.precacheAndRoute() method efficiently caches and responds to 30 | * requests for URLs in the manifest. 31 | * See https://goo.gl/S9QRab 32 | */ 33 | self.__precacheManifest = [].concat(self.__precacheManifest || []); 34 | workbox.precaching.precacheAndRoute(self.__precacheManifest, {}); 35 | 36 | workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL("/index.html"), { 37 | 38 | blacklist: [/^\/_/,/\/[^\/?]+\.[^\/]+$/], 39 | }); 40 | -------------------------------------------------------------------------------- /build/static/css/main.f1ae687b.chunk.css: -------------------------------------------------------------------------------- 1 | #modal-window{position:absolute;width:99%;top:0;z-index:99999;font-family:sans-serif}.modal-window{top:0;left:0;will-change:transform;margin-top:2em;position:absolute;background:rgba(30,32,44,.99);min-width:150px;height:auto;border-radius:3px;box-shadow:0 .5rem 1rem rgba(0,0,0,.15)!important;z-index:9999;border:1px solid #333748}.modal-window-inner-border{min-height:200px;height:auto;display:flex;border-radius:3px;box-shadow:0 0 0 .4px #222132}.modal-window-inner-border:before{position:absolute;top:.4px;left:.4px;right:.4px;bottom:.4px;border:.5px solid #57566d;border-radius:3px}.modal-handle{cursor:move;height:15px;border-radius:3px;width:100%;justify-content:flex-end}.modal-content,.modal-handle{display:flex;align-items:center}.modal-content{justify-content:center;flex-direction:column;color:#fff;padding:.5rem .5rem 2.5rem;font-size:14px;line-height:24px;height:275px;min-width:400px;overflow:auto}.modal-content-drawer-handle{height:100%;width:20px;position:absolute;display:flex;justify-content:center;align-items:center}.modal-close-button{cursor:pointer}.modal-body{display:flex;flex-direction:column}.modal-button{background-image:-webkit-linear-gradient(65deg,#21d4fd,#b721ff 50%,#017eff);background-image:linear-gradient(25deg,#21d4fd,#b721ff 50%,#017eff);background-size:500%;border:none;border-radius:3px;box-shadow:0 3px 0 0 #5664a7;color:#fff;font-size:14px;font-weight:600;height:40px;width:150px} 2 | /*# sourceMappingURL=main.f1ae687b.chunk.css.map */ -------------------------------------------------------------------------------- /build/static/css/main.f1ae687b.chunk.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["App.css"],"names":[],"mappings":"AAAA,cACE,iBAAkB,CAClB,SAAU,CACV,KAAM,CACN,aAAc,CACd,sBACF,CAEA,cACE,KAAM,CACN,MAAO,CACP,qBAAsB,CACtB,cAAe,CACf,iBAAkB,CAClB,6BAAiC,CACjC,eAAgB,CAChB,WAAe,CACf,iBAAkB,CAClB,iDAAmD,CACnD,YAAa,CACb,wBACF,CAEA,2BACE,gBAAiB,CACjB,WAAe,CACf,YAAa,CACb,iBAAkB,CAClB,6BACF,CAEA,kCACE,iBAAkB,CAClB,QAAS,CACT,SAAU,CACV,UAAW,CACX,WAAY,CACZ,yBAA0B,CAC1B,iBACF,CAEA,cACE,WAAY,CACZ,WAAY,CACZ,iBAAkB,CAClB,UAAW,CAGX,wBACF,CAEA,6BALE,YAAa,CACb,kBAgBF,CAZA,eAEE,sBAAuB,CACvB,qBAAsB,CAEtB,UAAY,CACZ,0BAAkC,CAClC,cAAe,CACf,gBAAiB,CACjB,YAAa,CACb,eAAgB,CAChB,aACF,CAEA,6BACE,WAAY,CACZ,UAAW,CACX,iBAAkB,CAClB,YAAa,CACb,sBAAuB,CACvB,kBACF,CAEA,oBACE,cACF,CAEA,YACE,YAAa,CACb,qBACF,CAEA,cACE,2EAAoE,CAApE,mEAAoE,CACpE,oBAAqB,CACrB,WAAY,CACZ,iBAAkB,CAClB,4BAA6B,CAC7B,UAAW,CACX,cAAe,CACf,eAAgB,CAChB,WAAY,CACZ,WACF","file":"main.f1ae687b.chunk.css","sourcesContent":["#modal-window {\r\n position: absolute;\r\n width: 99%;\r\n top: 0;\r\n z-index: 99999;\r\n font-family: sans-serif;\r\n}\r\n\r\n.modal-window {\r\n top: 0;\r\n left: 0;\r\n will-change: transform;\r\n margin-top: 2em;\r\n position: absolute;\r\n background: rgba(30, 32, 44, .99);\r\n min-width: 150px;\r\n height: initial;\r\n border-radius: 3px;\r\n box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;\r\n z-index: 9999;\r\n border: 1px solid #333748;\r\n}\r\n\r\n.modal-window-inner-border {\r\n min-height: 200px;\r\n height: initial;\r\n display: flex;\r\n border-radius: 3px;\r\n box-shadow: 0 0 0 0.4px #222132;\r\n}\r\n\r\n.modal-window-inner-border:before {\r\n position: absolute;\r\n top: .4px;\r\n left: .4px;\r\n right: .4px;\r\n bottom: .4px;\r\n border: .5px solid #57566d;\r\n border-radius: 3px;\r\n}\r\n\r\n.modal-handle {\r\n cursor: move;\r\n height: 15px;\r\n border-radius: 3px;\r\n width: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: flex-end;\r\n}\r\n\r\n.modal-content {\r\n display: flex;\r\n justify-content: center;\r\n flex-direction: column;\r\n align-items: center;\r\n color: white;\r\n padding: 0.5rem .5rem 2.5rem .5rem;\r\n font-size: 14px;\r\n line-height: 24px;\r\n height: 275px;\r\n min-width: 400px;\r\n overflow: auto;\r\n}\r\n\r\n.modal-content-drawer-handle {\r\n height: 100%;\r\n width: 20px;\r\n position: absolute;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.modal-close-button {\r\n cursor: pointer;\r\n}\r\n\r\n.modal-body {\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.modal-button {\r\n background-image: linear-gradient(25deg,#21d4fd,#b721ff 50%,#017eff);\r\n background-size: 500%;\r\n border: none;\r\n border-radius: 3px;\r\n box-shadow: 0 3px 0 0 #5664a7;\r\n color: #fff;\r\n font-size: 14px;\r\n font-weight: 600;\r\n height: 40px;\r\n width: 150px;\r\n}\r\n\r\n"]} -------------------------------------------------------------------------------- /build/static/js/main.2223e5fe.chunk.js: -------------------------------------------------------------------------------- 1 | (window["webpackJsonpreact-chrome-extension-boilerplate"]=window["webpackJsonpreact-chrome-extension-boilerplate"]||[]).push([[0],{11:function(e,n,t){},14:function(e,n,t){"use strict";t.r(n);var a=t(0),o=t.n(a),l=t(2),i=t.n(l),r=(t(11),t(16)),c=t(4),d=t.n(c),s=t(5),m=function(){return{windowPosition:{x:100,y:100}}},u=o.a.createContext({}),E=function(e){var n=e.children,t=m().windowPosition,l=Object(a.useState)(void 0),i=Object(s.a)(l,2),r=i[0],c=i[1];return Object(a.useEffect)((function(){window.addEventListener("message",(function(e){e.source===window&&e.data.type&&"EXTENSION_ID_RESULT"===e.data.type&&c(e.data.extensionId)}))}),[]),o.a.createElement(u.Provider,{value:{extensionId:r,getExtensionId:function(){window.postMessage({type:"GET_EXTENSION_ID"},"*")},windowPosition:t}},n)},w=function(){return o.a.createElement(u.Consumer,null,(function(e){var n=e.windowPosition,t=e.hasDraggedWindowPosition,a=e.extensionId,l=e.getExtensionId;return o.a.createElement(d.a,{handle:".modal-handle",defaultPosition:{x:n.x,y:n.y},position:t?{x:n.x,y:n.y}:null},o.a.createElement("div",{id:"modal",className:"modal-window",style:{transform:n}},o.a.createElement("div",{className:"modal-window-inner-border"},o.a.createElement(o.a.Fragment,null,o.a.createElement("div",{className:"modal-body"},o.a.createElement("div",{className:"modal-handle"},o.a.createElement("div",{className:"modal-close-button"},o.a.createElement(r.a,{color:"#5d6484",size:"14"}))),o.a.createElement("div",{className:"modal-content"},o.a.createElement("h3",null,a),o.a.createElement("button",{onClick:l,className:"modal-button"},"Get Extension ID")))))))}))};var f=function(){return o.a.createElement(E,null,o.a.createElement(w,null))};i.a.render(o.a.createElement(o.a.Fragment,null,o.a.createElement(f,null)),document.getElementById("modal-window"))},6:function(e,n,t){e.exports=t(14)}},[[6,1,2]]]); 2 | //# sourceMappingURL=main.2223e5fe.chunk.js.map -------------------------------------------------------------------------------- /build/static/js/main.2223e5fe.chunk.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["Hooks/useWindowPosition.js","Contexts/ModalProvider.js","Components/Modal.js","App.js","index.js"],"names":["useWindowPosition","windowPosition","x","y","ModalContext","React","createContext","ModalProvider","children","useState","undefined","extensionId","setExtensionId","useEffect","window","addEventListener","event","source","data","type","Provider","value","getExtensionId","postMessage","Modal","Consumer","hasDraggedWindowPosition","handle","defaultPosition","position","id","className","style","transform","color","size","onClick","App","ReactDOM","render","document","getElementById"],"mappings":"0QAOeA,EANW,WACxB,MAAO,CACLC,eAAiB,CAAEC,EAAG,IAAKC,EAAG,OCArBC,EAAeC,IAAMC,cAAc,IAiCjCC,EA/BO,SAAC,GAAkB,IAAhBC,EAAe,EAAfA,SACfP,EAAmBD,IAAnBC,eAD8B,EAEAQ,wBAASC,GAFT,mBAE/BC,EAF+B,KAElBC,EAFkB,KAkBtC,OAVAC,qBAAU,WAERC,OAAOC,iBAAiB,WAAW,SAASC,GACtCA,EAAMC,SAAWH,QACjBE,EAAME,KAAKC,MAA6B,wBAApBH,EAAME,KAAKC,MACjCP,EAAeI,EAAME,KAAKP,kBAG7B,IAGD,kBAACP,EAAagB,SAAd,CACEC,MAAO,CACLV,cACAW,eAlBN,WACER,OAAOS,YAAY,CAAEJ,KAAM,oBAAsB,MAkB7ClB,mBAGDO,ICaQgB,EAvCD,WACZ,OACE,kBAACpB,EAAaqB,SAAd,MACG,gBAAGxB,EAAH,EAAGA,eAAgByB,EAAnB,EAAmBA,yBAA0Bf,EAA7C,EAA6CA,YAAaW,EAA1D,EAA0DA,eAA1D,OACC,kBAAC,IAAD,CACEK,OAAO,gBACPC,gBAAiB,CAAC1B,EAAGD,EAAeC,EAAGC,EAAGF,EAAeE,GACzD0B,SAAUH,EAA2B,CAAExB,EAAGD,EAAeC,EAAGC,EAAGF,EAAeE,GAAM,MAEpF,yBAAK2B,GAAG,QAAQC,UAAU,eAAeC,MAAO,CAC9CC,UAAWhC,IAEX,yBAAK8B,UAAU,6BACX,oCACE,yBAAKA,UAAU,cACb,yBAAKA,UAAU,gBACb,yBAAKA,UAAU,sBACb,kBAAC,IAAD,CAAGG,MAAM,UAAUC,KAAK,SAG5B,yBAAKJ,UAAU,iBACb,4BAAKpB,GACL,4BACEyB,QAASd,EACTS,UAAU,gBAFZ,8BCXPM,MARf,WACE,OACE,kBAAC,EAAD,KACE,kBAAC,EAAD,QCPNC,IAASC,OACP,oCACE,kBAAC,EAAD,OACGC,SAASC,eAAe,kB","file":"static/js/main.2223e5fe.chunk.js","sourcesContent":["\r\nconst useWindowPosition = () => {\r\n return {\r\n windowPosition: { x: 100, y: 100 },\r\n }\r\n};\r\n\r\nexport default useWindowPosition;\r\n","import React, { useEffect, useState } from 'react';\r\nimport useWindowPosition from '../Hooks/useWindowPosition';\r\n\r\nexport const ModalContext = React.createContext({});\r\n\r\nconst ModalProvider = ({ children }) => {\r\n const { windowPosition } = useWindowPosition();\r\n const [extensionId, setExtensionId] = useState(undefined);\r\n\r\n function getExtensionId() {\r\n window.postMessage({ type: \"GET_EXTENSION_ID\" }, \"*\");\r\n }\r\n\r\n useEffect(() => {\r\n // Set up event listeners from Content script\r\n window.addEventListener(\"message\", function(event) {\r\n if (event.source !== window) return;\r\n if (event.data.type && (event.data.type === \"EXTENSION_ID_RESULT\")) {\r\n setExtensionId(event.data.extensionId);\r\n }\r\n });\r\n }, []);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n};\r\n\r\nexport default ModalProvider;\r\n","import React from 'react';\r\nimport { X } from 'react-feather';\r\nimport Draggable from 'react-draggable';\r\nimport { ModalContext } from '../Contexts/ModalProvider';\r\n\r\nconst Modal = () => {\r\n return (\r\n \r\n {({ windowPosition, hasDraggedWindowPosition, extensionId, getExtensionId }) => (\r\n \r\n
\r\n
\r\n <>\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n

{extensionId}

\r\n \r\n Get Extension ID\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default Modal;\r\n","import React from 'react';\r\nimport './App.css';\r\nimport Modal from './Components/Modal';\r\nimport ModalProvider from './Contexts/ModalProvider';\r\n\r\n/**\r\n * @return {null}\r\n */\r\nfunction App() {\r\n return (\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default App;\r\n","import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport App from './App';\r\n\r\nReactDOM.render(\r\n <>\r\n \r\n , document.getElementById('modal-window'));\r\n\r\n// If you want your app to work offline and load faster, you can change\r\n// unregister() to register() below. Note this comes with some pitfalls.\r\n// Learn more about service workers: https://bit.ly/CRA-PWA\r\n// serviceWorker.unregister();\r\n"],"sourceRoot":""} -------------------------------------------------------------------------------- /build/static/js/runtime-main.0d1674f1.js: -------------------------------------------------------------------------------- 1 | !function(e){function r(r){for(var n,l,i=r[0],a=r[1],c=r[2],f=0,s=[];f0.2%", 29 | "not dead", 30 | "not op_mini all" 31 | ], 32 | "development": [ 33 | "last 1 chrome version", 34 | "last 1 firefox version", 35 | "last 1 safari version" 36 | ] 37 | }, 38 | "devDependencies": { 39 | "cross-env": "7.0.2" 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /public/background.js: -------------------------------------------------------------------------------- 1 | /* global chrome */ 2 | 3 | chrome.browserAction.onClicked.addListener(function(tab) { 4 | chrome.tabs.sendMessage(tab.id, { message: 'load' }); 5 | }); 6 | -------------------------------------------------------------------------------- /public/content.js: -------------------------------------------------------------------------------- 1 | /* global chrome */ 2 | 3 | chrome.runtime.onMessage.addListener(function(request, sender, callback) { 4 | main(); 5 | }); 6 | 7 | function main() { 8 | // eslint-disable-next-line no-undef 9 | const extensionOrigin = 'chrome-extension://' + chrome.runtime.id; 10 | // eslint-disable-next-line no-restricted-globals 11 | if (!location.ancestorOrigins.contains(extensionOrigin)) { 12 | // Fetch the local React index.html page 13 | // eslint-disable-next-line no-undef 14 | fetch(chrome.runtime.getURL('index.html') /*, options */) 15 | .then((response) => response.text()) 16 | .then((html) => { 17 | const styleStashHTML = html.replace(/\/static\//g, `${extensionOrigin}/static/`); 18 | // eslint-disable-next-line no-undef 19 | $(styleStashHTML).appendTo('body'); 20 | }) 21 | .catch((error) => { 22 | console.warn(error); 23 | }); 24 | } 25 | } 26 | 27 | window.addEventListener("message", function(event) { 28 | if (event.source !== window) return; 29 | onDidReceiveMessage(event); 30 | }); 31 | 32 | async function onDidReceiveMessage(event) { 33 | if (event.data.type && (event.data.type === "GET_EXTENSION_ID")) { 34 | window.postMessage({ type: "EXTENSION_ID_RESULT", extensionId: chrome.runtime.id }, "*"); 35 | } 36 | } 37 | 38 | 39 | -------------------------------------------------------------------------------- /public/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/public/favicon.png -------------------------------------------------------------------------------- /public/icon128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/public/icon128.png -------------------------------------------------------------------------------- /public/icon16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/public/icon16.png -------------------------------------------------------------------------------- /public/icon48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/public/icon48.png -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /public/jquery.js: -------------------------------------------------------------------------------- 1 | /*! jQuery v3.4.1 | (c) JS Foundation and other contributors | jquery.org/license */ 2 | !function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],E=C.document,r=Object.getPrototypeOf,s=t.slice,g=t.concat,u=t.push,i=t.indexOf,n={},o=n.toString,v=n.hasOwnProperty,a=v.toString,l=a.call(Object),y={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType},x=function(e){return null!=e&&e===e.window},c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.4.1",k=function(e,t){return new k.fn.init(e,t)},p=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function d(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp($),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+$),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\([\\da-f]{1,6}"+M+"?|("+M+")|.)","ig"),ne=function(e,t,n){var r="0x"+t-65536;return r!=r||n?t:r<0?String.fromCharCode(r+65536):String.fromCharCode(r>>10|55296,1023&r|56320)},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(m.childNodes),m.childNodes),t[m.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&((e?e.ownerDocument||e:m)!==C&&T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&y(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!A[t+" "]&&(!v||!v.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&U.test(t)){(s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=k),o=(l=h(t)).length;while(o--)l[o]="#"+s+" "+xe(l[o]);c=l.join(","),f=ee.test(t)&&ye(e.parentNode)||e}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){A(t,!0)}finally{s===k&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[k]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ve(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ye(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e.namespaceURI,n=(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:m;return r!==C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),m!==C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=k,!C.getElementsByName||!C.getElementsByName(k).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],v=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){a.appendChild(e).innerHTML="",e.querySelectorAll("[msallowcapture^='']").length&&v.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||v.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+k+"-]").length||v.push("~="),e.querySelectorAll(":checked").length||v.push(":checked"),e.querySelectorAll("a#"+k+"+*").length||v.push(".#.+[+~]")}),ce(function(e){e.innerHTML="";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&v.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&v.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&v.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),v.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",$)}),v=v.length&&new RegExp(v.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),y=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},D=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)===(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e===C||e.ownerDocument===m&&y(m,e)?-1:t===C||t.ownerDocument===m&&y(m,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e===C?-1:t===C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]===m?-1:s[r]===m?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if((e.ownerDocument||e)!==C&&T(e),d.matchesSelector&&E&&!A[t+" "]&&(!s||!s.test(t))&&(!v||!v.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){A(t,!0)}return 0":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=p[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&p(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?k.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?k.grep(e,function(e){return e===n!==r}):"string"!=typeof n?k.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(k.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||q,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:L.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof k?t[0]:t,k.merge(this,k.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),D.test(r[1])&&k.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(k):k.makeArray(e,this)}).prototype=k.fn,q=k(E);var H=/^(?:parents|prev(?:Until|All))/,O={children:!0,contents:!0,next:!0,prev:!0};function P(e,t){while((e=e[t])&&1!==e.nodeType);return e}k.fn.extend({has:function(e){var t=k(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i,ge={option:[1,""],thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function ve(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?k.merge([e],n):n}function ye(e,t){for(var n=0,r=e.length;nx",y.noCloneChecked=!!me.cloneNode(!0).lastChild.defaultValue;var Te=/^key/,Ce=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,Ee=/^([^.]*)(?:\.(.+)|)/;function ke(){return!0}function Se(){return!1}function Ne(e,t){return e===function(){try{return E.activeElement}catch(e){}}()==("focus"===t)}function Ae(e,t,n,r,i,o){var a,s;if("object"==typeof t){for(s in"string"!=typeof n&&(r=r||n,n=void 0),t)Ae(e,s,n,r,t[s],o);return e}if(null==r&&null==i?(i=n,r=n=void 0):null==i&&("string"==typeof n?(i=r,r=void 0):(i=r,r=n,n=void 0)),!1===i)i=Se;else if(!i)return e;return 1===o&&(a=i,(i=function(e){return k().off(e),a.apply(this,arguments)}).guid=a.guid||(a.guid=k.guid++)),e.each(function(){k.event.add(this,t,i,r,n)})}function De(e,i,o){o?(Q.set(e,i,!1),k.event.add(e,i,{namespace:!1,handler:function(e){var t,n,r=Q.get(this,i);if(1&e.isTrigger&&this[i]){if(r.length)(k.event.special[i]||{}).delegateType&&e.stopPropagation();else if(r=s.call(arguments),Q.set(this,i,r),t=o(this,i),this[i](),r!==(n=Q.get(this,i))||t?Q.set(this,i,!1):n={},r!==n)return e.stopImmediatePropagation(),e.preventDefault(),n.value}else r.length&&(Q.set(this,i,{value:k.event.trigger(k.extend(r[0],k.Event.prototype),r.slice(1),this)}),e.stopImmediatePropagation())}})):void 0===Q.get(e,i)&&k.event.add(e,i,ke)}k.event={global:{},add:function(t,e,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.get(t);if(v){n.handler&&(n=(o=n).handler,i=o.selector),i&&k.find.matchesSelector(ie,i),n.guid||(n.guid=k.guid++),(u=v.events)||(u=v.events={}),(a=v.handle)||(a=v.handle=function(e){return"undefined"!=typeof k&&k.event.triggered!==e.type?k.event.dispatch.apply(t,arguments):void 0}),l=(e=(e||"").match(R)||[""]).length;while(l--)d=g=(s=Ee.exec(e[l])||[])[1],h=(s[2]||"").split(".").sort(),d&&(f=k.event.special[d]||{},d=(i?f.delegateType:f.bindType)||d,f=k.event.special[d]||{},c=k.extend({type:d,origType:g,data:r,handler:n,guid:n.guid,selector:i,needsContext:i&&k.expr.match.needsContext.test(i),namespace:h.join(".")},o),(p=u[d])||((p=u[d]=[]).delegateCount=0,f.setup&&!1!==f.setup.call(t,r,h,a)||t.addEventListener&&t.addEventListener(d,a)),f.add&&(f.add.call(t,c),c.handler.guid||(c.handler.guid=n.guid)),i?p.splice(p.delegateCount++,0,c):p.push(c),k.event.global[d]=!0)}},remove:function(e,t,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,v=Q.hasData(e)&&Q.get(e);if(v&&(u=v.events)){l=(t=(t||"").match(R)||[""]).length;while(l--)if(d=g=(s=Ee.exec(t[l])||[])[1],h=(s[2]||"").split(".").sort(),d){f=k.event.special[d]||{},p=u[d=(r?f.delegateType:f.bindType)||d]||[],s=s[2]&&new RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"),a=o=p.length;while(o--)c=p[o],!i&&g!==c.origType||n&&n.guid!==c.guid||s&&!s.test(c.namespace)||r&&r!==c.selector&&("**"!==r||!c.selector)||(p.splice(o,1),c.selector&&p.delegateCount--,f.remove&&f.remove.call(e,c));a&&!p.length&&(f.teardown&&!1!==f.teardown.call(e,h,v.handle)||k.removeEvent(e,d,v.handle),delete u[d])}else for(d in u)k.event.remove(e,d+t[l],n,r,!0);k.isEmptyObject(u)&&Q.remove(e,"handle events")}},dispatch:function(e){var t,n,r,i,o,a,s=k.event.fix(e),u=new Array(arguments.length),l=(Q.get(this,"events")||{})[s.type]||[],c=k.event.special[s.type]||{};for(u[0]=s,t=1;t\x20\t\r\n\f]*)[^>]*)\/>/gi,qe=/\s*$/g;function Oe(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&k(e).children("tbody")[0]||e}function Pe(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function Re(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Me(e,t){var n,r,i,o,a,s,u,l;if(1===t.nodeType){if(Q.hasData(e)&&(o=Q.access(e),a=Q.set(t,o),l=o.events))for(i in delete a.handle,a.events={},l)for(n=0,r=l[i].length;n")},clone:function(e,t,n){var r,i,o,a,s,u,l,c=e.cloneNode(!0),f=oe(e);if(!(y.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||k.isXMLDoc(e)))for(a=ve(c),r=0,i=(o=ve(e)).length;r").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Vt,Gt=[],Yt=/(=)\?(?=&|$)|\?\?/;k.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Gt.pop()||k.expando+"_"+kt++;return this[e]=!0,e}}),k.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Yt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Yt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Yt,"$1"+r):!1!==e.jsonp&&(e.url+=(St.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||k.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?k(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Gt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),y.createHTMLDocument=((Vt=E.implementation.createHTMLDocument("").body).innerHTML="
",2===Vt.childNodes.length),k.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(y.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=D.exec(e))?[t.createElement(i[1])]:(i=we([e],t,o),o&&o.length&&k(o).remove(),k.merge([],i.childNodes)));var r,i,o},k.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(k.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},k.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){k.fn[t]=function(e){return this.on(t,e)}}),k.expr.pseudos.animated=function(t){return k.grep(k.timers,function(e){return t===e.elem}).length},k.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=k.css(e,"position"),c=k(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=k.css(e,"top"),u=k.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,k.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},k.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){k.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===k.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===k.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=k(e).offset()).top+=k.css(e,"borderTopWidth",!0),i.left+=k.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-k.css(r,"marginTop",!0),left:t.left-i.left-k.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===k.css(e,"position"))e=e.offsetParent;return e||ie})}}),k.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;k.fn[t]=function(e){return _(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),k.each(["top","left"],function(e,n){k.cssHooks[n]=ze(y.pixelPosition,function(e,t){if(t)return t=_e(e,n),$e.test(t)?k(e).position()[n]+"px":t})}),k.each({Height:"height",Width:"width"},function(a,s){k.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){k.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return _(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?k.css(e,t,i):k.style(e,t,n,i)},s,n?e:void 0,n)}})}),k.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){k.fn[n]=function(e,t){return 0"], 21 | "all_frames": true, 22 | "js": [ 23 | "./content.js", 24 | "./jquery.js" 25 | ], 26 | "run_at": "document_end" 27 | }], 28 | "permissions": [ 29 | "activeTab" 30 | ], 31 | "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", 32 | "web_accessible_resources": [ 33 | "index.html", 34 | "/static/*" 35 | ] 36 | } 37 | -------------------------------------------------------------------------------- /react-chrome-extension.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/upmostly/react-chrome-extension/67d7b41fbb92c77f2b43160572627d3727cbaf32/react-chrome-extension.png -------------------------------------------------------------------------------- /src/App.css: -------------------------------------------------------------------------------- 1 | #modal-window { 2 | position: absolute; 3 | width: 99%; 4 | top: 0; 5 | z-index: 99999; 6 | font-family: sans-serif; 7 | } 8 | 9 | .modal-window { 10 | top: 0; 11 | left: 0; 12 | will-change: transform; 13 | margin-top: 2em; 14 | position: absolute; 15 | background: rgba(30, 32, 44, .99); 16 | min-width: 150px; 17 | height: initial; 18 | border-radius: 3px; 19 | box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important; 20 | z-index: 9999; 21 | border: 1px solid #333748; 22 | } 23 | 24 | .modal-window-inner-border { 25 | min-height: 200px; 26 | height: initial; 27 | display: flex; 28 | border-radius: 3px; 29 | box-shadow: 0 0 0 0.4px #222132; 30 | } 31 | 32 | .modal-window-inner-border:before { 33 | position: absolute; 34 | top: .4px; 35 | left: .4px; 36 | right: .4px; 37 | bottom: .4px; 38 | border: .5px solid #57566d; 39 | border-radius: 3px; 40 | } 41 | 42 | .modal-handle { 43 | cursor: move; 44 | height: 15px; 45 | border-radius: 3px; 46 | width: 100%; 47 | display: flex; 48 | align-items: center; 49 | justify-content: flex-end; 50 | } 51 | 52 | .modal-content { 53 | display: flex; 54 | justify-content: center; 55 | flex-direction: column; 56 | align-items: center; 57 | color: white; 58 | padding: 0.5rem .5rem 2.5rem .5rem; 59 | font-size: 14px; 60 | line-height: 24px; 61 | height: 275px; 62 | min-width: 400px; 63 | overflow: auto; 64 | } 65 | 66 | .modal-content-drawer-handle { 67 | height: 100%; 68 | width: 20px; 69 | position: absolute; 70 | display: flex; 71 | justify-content: center; 72 | align-items: center; 73 | } 74 | 75 | .modal-close-button { 76 | cursor: pointer; 77 | } 78 | 79 | .modal-body { 80 | display: flex; 81 | flex-direction: column; 82 | } 83 | 84 | .modal-button { 85 | background-image: linear-gradient(25deg,#21d4fd,#b721ff 50%,#017eff); 86 | background-size: 500%; 87 | border: none; 88 | border-radius: 3px; 89 | box-shadow: 0 3px 0 0 #5664a7; 90 | color: #fff; 91 | font-size: 14px; 92 | font-weight: 600; 93 | height: 40px; 94 | width: 150px; 95 | } 96 | 97 | -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import './App.css'; 3 | import Modal from './Components/Modal'; 4 | import ModalProvider from './Contexts/ModalProvider'; 5 | 6 | /** 7 | * @return {null} 8 | */ 9 | function App() { 10 | return ( 11 | 12 | 13 | 14 | ); 15 | } 16 | 17 | export default App; 18 | -------------------------------------------------------------------------------- /src/Components/Modal.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { X } from 'react-feather'; 3 | import Draggable from 'react-draggable'; 4 | import { ModalContext } from '../Contexts/ModalProvider'; 5 | 6 | const Modal = () => { 7 | return ( 8 | 9 | {({ windowPosition, hasDraggedWindowPosition, extensionId, getExtensionId }) => ( 10 | 15 | 39 | 40 | )} 41 | 42 | ); 43 | }; 44 | 45 | export default Modal; 46 | -------------------------------------------------------------------------------- /src/Contexts/ModalProvider.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from 'react'; 2 | import useWindowPosition from '../Hooks/useWindowPosition'; 3 | 4 | export const ModalContext = React.createContext({}); 5 | 6 | const ModalProvider = ({ children }) => { 7 | const { windowPosition } = useWindowPosition(); 8 | const [extensionId, setExtensionId] = useState(undefined); 9 | 10 | function getExtensionId() { 11 | window.postMessage({ type: "GET_EXTENSION_ID" }, "*"); 12 | } 13 | 14 | useEffect(() => { 15 | // Set up event listeners from Content script 16 | window.addEventListener("message", function(event) { 17 | if (event.source !== window) return; 18 | if (event.data.type && (event.data.type === "EXTENSION_ID_RESULT")) { 19 | setExtensionId(event.data.extensionId); 20 | } 21 | }); 22 | }, []); 23 | 24 | return ( 25 | 32 | {children} 33 | 34 | ); 35 | }; 36 | 37 | export default ModalProvider; 38 | -------------------------------------------------------------------------------- /src/Hooks/useWindowPosition.js: -------------------------------------------------------------------------------- 1 | 2 | const useWindowPosition = () => { 3 | return { 4 | windowPosition: { x: 100, y: 100 }, 5 | } 6 | }; 7 | 8 | export default useWindowPosition; 9 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render( 6 | <> 7 | 8 | , document.getElementById('modal-window')); 9 | 10 | // If you want your app to work offline and load faster, you can change 11 | // unregister() to register() below. Note this comes with some pitfalls. 12 | // Learn more about service workers: https://bit.ly/CRA-PWA 13 | // serviceWorker.unregister(); 14 | --------------------------------------------------------------------------------