chore: add clipper extension package (#2281)

packages/clipper/src/background/background.ts

@@ -0,0 +1,32 @@
+import { runtime, action, browserAction, windows, storage } from 'webextension-polyfill'
+import { RuntimeMessage, RuntimeMessageTypes } from '../types/message'
+
+const isFirefox = navigator.userAgent.indexOf('Firefox/') !== -1
+
+const openPopupAndClipSelection = async (payload: { title: string; content: string }) => {
+  await storage.local.set({ clip: payload })
+
+  if (isFirefox) {
+    const popupURL = await browserAction.getPopup({})
+    await windows.create({
+      type: 'detached_panel',
+      url: popupURL,
+      width: 350,
+      height: 450,
+    })
+    return
+  }
+
+  const openPopup = runtime.getManifest().manifest_version === 3 ? action.openPopup : browserAction.openPopup
+
+  void openPopup()
+}
+
+runtime.onMessage.addListener((message: RuntimeMessage) => {
+  if (message.type === RuntimeMessageTypes.OpenPopupWithSelection) {
+    if (!message.payload) {
+      return
+    }
+    void openPopupAndClipSelection(message.payload)
+  }
+})