-
-
Notifications
You must be signed in to change notification settings - Fork 93
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
e72d98c
commit e462c4f
Showing
22 changed files
with
310 additions
and
24 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. | ||
|
||
# dependencies | ||
node_modules | ||
|
||
# testing | ||
coverage | ||
|
||
# production | ||
dist | ||
|
||
# misc | ||
.DS_Store | ||
|
||
# local env files | ||
.env.local | ||
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
|
||
# lock files | ||
yarn.lock | ||
package-lock.json | ||
|
||
# debug files | ||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* | ||
|
||
# extension.js | ||
extension-env.d.ts |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
console.log('Hello from the background script!') |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,82 @@ | ||
import React from 'react' | ||
import ReactLogo from '../images/logo.svg' | ||
import tailwindBg from '../images/tailwind_bg.png' | ||
import typescriptLogo from '../images/typescript.png' | ||
import tailwindLogo from '../images/tailwind.png' | ||
import chromeWindowBg from '../images/chromeWindow.png' | ||
|
||
export default function ContentApp() { | ||
const [isdialogOpen, setIsDialogOpen] = React.useState(true) | ||
|
||
if (!isdialogOpen) { | ||
return ( | ||
<div className="mx-auto p-6"> | ||
<button | ||
onClick={() => setIsDialogOpen(true)} | ||
className="bg-white rounded-md p-3 text-sm font-semibold text-gray-900 shadow-sm hover:bg-gray-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white" | ||
> | ||
🧩 Open content script hint <span aria-hidden="true">+</span> | ||
</button> | ||
</div> | ||
) | ||
} | ||
|
||
return ( | ||
<div className="mx-auto max-w-7xl md:px-0 lg:p-6"> | ||
<div className="relative isolate overflow-hidden bg-gray-900 px-6 pt-16 shadow-2xl lg:rounded-3xl md:pt-24 md:h-full sm:h-[100vh] lg:flex lg:gap-x-20 lg:px-24 lg:pt-0"> | ||
<div className="absolute z-20 top-0 inset-x-0 flex justify-center overflow-hidden pointer-events-none"> | ||
<div className="w-[108rem] flex-none flex justify-end"> | ||
<picture> | ||
<img | ||
src={tailwindBg} | ||
alt="" | ||
className="w-[90rem] flex-none max-w-none hidden dark:block" | ||
decoding="async" | ||
/> | ||
</picture> | ||
</div> | ||
</div> | ||
<div className="mx-auto max-w-md text-center lg:py-12 lg:mx-0 lg:flex-auto lg:text-left"> | ||
<div className="flex items-center justify-center space-x-4 my-4 mx-auto"> | ||
<ReactLogo className="relative inline-block w-12" /> | ||
<div className="text-3xl text-white">+</div> | ||
<img | ||
alt="TypeScript logo" | ||
src={typescriptLogo} | ||
className="relative inline-block w-12" | ||
/> | ||
<div className="text-3xl text-white">+</div> | ||
<img | ||
alt="Tailwind logo" | ||
src={tailwindLogo} | ||
className="relative inline-block w-12" | ||
/> | ||
</div> | ||
<h2 className="text-3xl font-bold tracking-tight text-white sm:text-4xl"> | ||
This is a content script running React, TypeScript, and Tailwind.css | ||
</h2> | ||
<p className="mt-6 text-lg leading-8 text-gray-300"> | ||
Learn more about creating cross-browser extensions by{' '} | ||
<button | ||
onClick={() => setIsDialogOpen(false)} | ||
className="underline hover:no-underline | ||
" | ||
> | ||
closing this hint | ||
</button> | ||
. | ||
</p> | ||
</div> | ||
<div className="relative mt-16 h-80 lg:mt-8"> | ||
<img | ||
className="absolute left-0 top-0 w-[57rem] max-w-none rounded-md bg-white/5 ring-1 ring-white/10" | ||
src={chromeWindowBg} | ||
alt="Chrome window screenshot" | ||
width="1824" | ||
height="1080" | ||
/> | ||
</div> | ||
</div> | ||
</div> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import ReactDOM from 'react-dom/client' | ||
import ContentApp from './ContentApp' | ||
import './styles.css' | ||
|
||
setTimeout(initial, 1000) | ||
|
||
function initial() { | ||
// Create a new div element and append it to the document's body | ||
const rootDiv = document.createElement('div') | ||
rootDiv.id = 'extension-root' | ||
document.body.appendChild(rootDiv) | ||
|
||
// Use `createRoot` to create a root, then render the <App /> component | ||
// Note that `createRoot` takes the container DOM node, not the React element | ||
const root = ReactDOM.createRoot(rootDiv) | ||
root.render(<ContentApp />) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
@tailwind base; | ||
@tailwind components; | ||
@tailwind utilities; | ||
|
||
#extension-root { | ||
position: fixed; | ||
bottom: 0; | ||
right: 0; | ||
z-index: 99999; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
/** @type {import('extension-develop').FileConfig} */ | ||
module.exports = { | ||
config: (config) => { | ||
config.module.rules.push( | ||
{ | ||
test: /\.svg$/i, | ||
type: 'asset', | ||
// *.svg?url | ||
resourceQuery: /url/ | ||
}, | ||
{ | ||
test: /\.svg$/i, | ||
issuer: /\.[jt]sx?$/, | ||
// exclude react component if *.svg?url | ||
resourceQuery: {not: [/url/]}, | ||
use: ['@svgr/webpack'] | ||
} | ||
) | ||
|
||
return config | ||
} | ||
} |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
{ | ||
"manifest_version": 3, | ||
"version": "0.0.1", | ||
"name": "content-react-svgr", | ||
"description": "An Extension.js example.", | ||
"background": { | ||
"chromium:service_worker": "background.ts", | ||
"firefox:scripts": ["background.ts"] | ||
}, | ||
"content_scripts": [ | ||
{ | ||
"matches": ["https://extension.js.org/*"], | ||
"js": ["./content/scripts.tsx"] | ||
} | ||
], | ||
"icons": { | ||
"16": "images/extension_16.png", | ||
"48": "images/extension_48.png", | ||
"128": "images/extension_128.png" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
{ | ||
"private": true, | ||
"license": "MIT", | ||
"repository": { | ||
"type": "git", | ||
"url": "https://github.com/cezaraugusto/extension.git", | ||
"directory": "programs/create/templates/content-react-svgr" | ||
}, | ||
"name": "content-react-svgr", | ||
"description": "An Extension.js example.", | ||
"version": "0.0.1", | ||
"author": { | ||
"name": "Cezar Augusto", | ||
"email": "boss@cezaraugusto.net", | ||
"url": "https://cezaraugusto.com" | ||
}, | ||
"dependencies": { | ||
"@svgr/webpack": "^8.1.0", | ||
"react": "^18.1.0", | ||
"react-dom": "^18.1.0", | ||
"tailwindcss": "^3.4.1" | ||
}, | ||
"devDependencies": { | ||
"@types/react": "^18.0.9", | ||
"@types/react-dom": "^18.0.5", | ||
"typescript": "5.3.3" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
module.exports = { | ||
plugins: { | ||
tailwindcss: {}, | ||
autoprefixer: {} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
/** @type {import('tailwindcss').Config} */ | ||
module.exports = { | ||
content: ['./content/**/*.tsx'], | ||
theme: { | ||
extend: {} | ||
}, | ||
plugins: [] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
{ | ||
"compilerOptions": { | ||
"allowJs": true, | ||
"allowSyntheticDefaultImports": true, | ||
"esModuleInterop": true, | ||
"forceConsistentCasingInFileNames": true, | ||
"isolatedModules": true, | ||
"jsx": "react-jsx", | ||
"lib": ["dom", "dom.iterable", "esnext"], | ||
"moduleResolution": "node", | ||
"module": "esnext", | ||
"noEmit": true, | ||
"resolveJsonModule": true, | ||
"strict": true, | ||
"target": "esnext", | ||
"verbatimModuleSyntax": true, | ||
"useDefineForClassFields": true, | ||
"skipLibCheck": true | ||
}, | ||
"include": ["./"], | ||
"exclude": ["node_modules", "dist"] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.