Files
penx/apps/extension/entrypoints/content/index.tsx
2025-04-20 13:03:46 +08:00

33 lines
780 B
TypeScript

import ReactDOM from 'react-dom/client'
import App from './App.tsx'
import './style.css'
export default defineContentScript({
matches: ['*://*/*'],
cssInjectionMode: 'ui',
async main(ctx) {
const ui = await createShadowRootUi(ctx, {
name: 'penx-extension',
position: 'inline',
anchor: 'body',
append: 'first',
onMount: (container) => {
// Don't mount react app directly on <body>
const wrapper = document.createElement('div')
container.append(wrapper)
const root = ReactDOM.createRoot(wrapper)
root.render(<App />)
return { root, wrapper }
},
onRemove: (elements) => {
elements?.root.unmount()
elements?.wrapper.remove()
},
})
ui.mount()
},
})