diff --git a/apps/content/package.json b/apps/content/package.json
index 40d4942..5e21431 100644
--- a/apps/content/package.json
+++ b/apps/content/package.json
@@ -26,7 +26,7 @@
     "svelte-preprocess": "^5.1.3",
     "svelte-sequential-preprocessor": "^2.0.1",
     "ts-loader": "^9.5.1",
-    "typescript": "^5.3.3",
+    "typescript": "^5.4.5",
     "webpack": "^5.89.0",
     "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^4.15.1",
diff --git a/apps/content/src/browser/browserImports.js b/apps/content/src/browser/browserImports.js
index b18962a..97843a6 100644
--- a/apps/content/src/browser/browserImports.js
+++ b/apps/content/src/browser/browserImports.js
@@ -7,6 +7,7 @@ import { lazyESModuleGetters } from '../shared/lazy.js'
 export const browserImports = lazyESModuleGetters({
   AppConstants: 'resource://gre/modules/AppConstants.sys.mjs',
   E10SUtils: 'resource://gre/modules/E10SUtils.sys.mjs',
+  EBrowserActions: 'resource://app/modules/EBrowserActions.sys.mjs',
   EPageActions: 'resource://app/modules/EPageActions.sys.mjs',
   NetUtil: 'resource://gre/modules/NetUtil.sys.mjs',
   PageThumbs: 'resource://gre/modules/PageThumbs.sys.mjs',
diff --git a/apps/content/src/browser/components/BrowserAction.svelte b/apps/content/src/browser/components/BrowserAction.svelte
new file mode 100644
index 0000000..7f1465f
--- /dev/null
+++ b/apps/content/src/browser/components/BrowserAction.svelte
@@ -0,0 +1,62 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+
+<script>
+  import { writable } from 'svelte/store'
+
+  // @ts-check
+  import ToolbarButton from './ToolbarButton.svelte'
+
+  const actionPanel = import('./browserAction.js').then(
+    (module) => module.actionPanel,
+  )
+
+  /** @type {import("resource://app/modules/EBrowserActions.sys.mjs").IBrowserAction} */
+  export let action
+  /** @type {WebsiteView} */
+  export let browserView
+
+  let launchTarget
+  let open = writable(false)
+
+  const iconSrc = action.getIcon(16)
+  const url = action.getPopupUrl()
+</script>
+
+<ToolbarButton
+  bind:buttonElement={launchTarget}
+  on:click={async (e) => {
+    open = true
+    const { clickModifiersFromEvent } = await import('./browserAction.js')
+    action.getEmiter().emit('click', {
+      tabId: browserView.browserId,
+      clickData: clickModifiersFromEvent(e),
+    })
+  }}
+>
+  <img src={$iconSrc} />
+</ToolbarButton>
+
+{#if $url}
+  {#await actionPanel then ap}
+    <xul:panel
+      use:ap={{ url: $url, launchTarget, open }}
+      on:close={() => (open = false)}
+      class="popup"
+      id={`page-action-panel__${action.getExtensionId()}--${
+        browserView.browserId
+      }`}
+    ></xul:panel>
+  {/await}
+{/if}
+
+<style>
+  .popup {
+    --panel-padding: 0;
+    --panel-border-radius: 1rem;
+    --panel-border-color: transperent;
+    --panel-shadow-margin: 1rem;
+    --panel-background: transperent;
+  }
+</style>
diff --git a/apps/content/src/browser/components/ToolbarButton.svelte b/apps/content/src/browser/components/ToolbarButton.svelte
index aa8aa81..dd4b4cb 100644
--- a/apps/content/src/browser/components/ToolbarButton.svelte
+++ b/apps/content/src/browser/components/ToolbarButton.svelte
@@ -4,9 +4,11 @@
 
 <script>
   export let disabled = false
+  /** @type {HTMLButtonElement} */
+  export let buttonElement = undefined
 </script>
 
-<button on:click {disabled}>
+<button on:click {disabled} bind:this={buttonElement}>
   <slot />
 </button>
 
diff --git a/apps/content/src/browser/components/WebsiteView.svelte b/apps/content/src/browser/components/WebsiteView.svelte
index 51f013b..cae4afe 100644
--- a/apps/content/src/browser/components/WebsiteView.svelte
+++ b/apps/content/src/browser/components/WebsiteView.svelte
@@ -5,6 +5,7 @@
 <script>
   // @ts-check
   import { onMount } from 'svelte'
+  import { derived } from 'svelte/store'
 
   import RiRefreshLine from 'svelte-remixicon/RiRefreshLine.svelte'
   import RiArrowLeftLine from 'svelte-remixicon/RiArrowLeftLine.svelte'
@@ -16,12 +17,16 @@
   import ToolbarSpacer from './ToolbarSpacer.svelte'
   import UrlBox from './UrlBox.svelte'
   import HamburgurMenu from './HamburgurMenu.svelte'
+  import { browserImports } from '../browserImports'
+  import BrowserAction from './BrowserAction.svelte'
 
   /** @type {WebsiteView} */
   export let view
   /** @type {HTMLDivElement} */
   let browserContainer
 
+  const actions = browserImports.EBrowserActions.actions
+
   const canGoBack = WebsiteViewApi.locationProperty(
     view,
     (browser) => browser.canGoBack,
@@ -64,6 +69,9 @@
 
     <ToolbarSpacer />
 
+    {#each Object.entries($actions) as [extId, action] (extId)}
+      <BrowserAction browserView={view} {action} />
+    {/each}
     <HamburgurMenu />
   </div>
 
diff --git a/apps/content/src/browser/components/browserAction.js b/apps/content/src/browser/components/browserAction.js
new file mode 100644
index 0000000..ccb1f4c
--- /dev/null
+++ b/apps/content/src/browser/components/browserAction.js
@@ -0,0 +1,159 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+// @ts-check
+/// <reference types="@browser/link" />
+import { browserImports } from '../browserImports.js'
+import { createBrowser } from '../utils/browserElement.js'
+
+const ABOUT_BLANK = browserImports.NetUtil.newURI('about:blank')
+const EXTENSION_CONTENT_SCRIPT =
+  'chrome://extensions/content/ext-browser-content.js'
+
+/**
+ * @template {XULPanel} Node
+ * @template {{ url: string, launchTarget: HTMLElement, open: boolean }} Parameters
+ * @template {{ 'on:close': (e: CustomEvent<null>) => void }} Attributes
+ *
+ * @param {Node} panel
+ * @param {Parameters} param1
+ *
+ * @returns {import('svelte/action').ActionReturn<Parameters, Attributes>}
+ */
+export function actionPanel(panel, { url, launchTarget }) {
+  let extensionUri = browserImports.NetUtil.newURI(url)
+  let browser = createBrowser(ABOUT_BLANK, {
+    disableglobalhistory: 'true',
+    messagemanagergroup: 'webext-browsers',
+    'webextension-view-type': 'popup',
+  })
+  let messageReceiver = new MessageReceiver(browser)
+  panel.appendChild(browser)
+
+  function setupBrowser() {
+    browser.messageManager.addMessageListener(
+      'Extension:BrowserResized',
+      messageReceiver,
+    )
+    browser.messageManager.loadFrameScript(
+      EXTENSION_CONTENT_SCRIPT,
+      false,
+      true,
+    )
+    browser.messageManager.sendAsyncMessage('Extension:InitBrowser', {
+      allowScriptsToClose: true,
+      maxWidth: 800,
+      maxHeight: 600,
+    })
+  }
+
+  function triggerOpen(/** @type {boolean} */ open) {
+    if (!open) {
+      panel.hidePopup()
+      return
+    }
+
+    panel.openPopup(launchTarget, 'bottomright topright')
+    browser.source = extensionUri.spec
+    try {
+      browser.loadURI(extensionUri, {
+        triggeringPrincipal:
+          Services.scriptSecurityManager.getSystemPrincipal(),
+      })
+    } catch (e) {
+      console.debug('Debug info for changing url')
+      console.debug(browser, extensionUri)
+      console.error(e)
+    }
+
+    return () => {}
+  }
+
+  function handleClose() {
+    panel.dispatchEvent(new CustomEvent('close', { detail: null }))
+    browser.source = ABOUT_BLANK.spec
+    try {
+      browser.loadURI(ABOUT_BLANK, {})
+    } catch (e) {
+      console.debug('Debug info for changing url')
+      console.debug(browser, extensionUri)
+      console.error(e)
+    }
+
+    return () => {}
+  }
+
+  setupBrowser()
+  browser.addEventListener('DidChangeBrowserRemoteness', setupBrowser)
+  panel.addEventListener('popuphidden', handleClose)
+
+  return {
+    update({ url: newUrl, launchTarget: lt, open }) {
+      if (newUrl != url) extensionUri = browserImports.NetUtil.newURI(newUrl)
+      launchTarget = lt
+
+      triggerOpen(open)
+    },
+
+    destroy() {
+      browser.messageManager?.removeMessageListener(
+        'Extension:BrowserResized',
+        messageReceiver,
+      )
+      browser.removeEventListener('DidChangeBrowserRemoteness', setupBrowser)
+      browser.remove()
+
+      panel.removeEventListener('popuphidden', handleClose)
+    },
+  }
+}
+
+/**
+ * @param {MouseEvent} event
+ */
+export function clickModifiersFromEvent(event) {
+  const map = {
+    shiftKey: 'Shift',
+    altKey: 'Alt',
+    metaKey: 'Command',
+    ctrlKey: 'Ctrl',
+  }
+
+  const modifiers = Object.keys(map)
+    .filter((key) => event[key])
+    .map((key) => map[key])
+
+  if (event.ctrlKey && browserImports.AppConstants.platform === 'macosx') {
+    modifiers.push('MacCtrl')
+  }
+
+  return modifiers
+}
+
+/**
+ * @implements {MessageListener}
+ */
+class MessageReceiver {
+  /** @type {XULBrowserElement} */
+  browser
+
+  /** @param {XULBrowserElement} browser  */
+  constructor(browser) {
+    this.browser = browser
+  }
+
+  /**
+   * @param {ReceiveMessageArgument} data
+   */
+  receiveMessage(data) {
+    if (data.name === 'Extension:BrowserResized') {
+      const { width, height } = data.data
+      if (this.browser) {
+        this.browser.style.width = `${width}px`
+        this.browser.style.height = `${height}px`
+      }
+
+      return
+    }
+  }
+}
diff --git a/apps/content/src/browser/utils/browserElement.js b/apps/content/src/browser/utils/browserElement.js
index eb1d125..c915efc 100644
--- a/apps/content/src/browser/utils/browserElement.js
+++ b/apps/content/src/browser/utils/browserElement.js
@@ -18,6 +18,8 @@ const DEFAULT_BROWSER_ATTRIBUTES = {
 /**
  * @param {nsIURIType} uri
  * @param {Record<string, string>} [attributes={}]
+ *
+ * @returns {XULBrowserElement}
  */
 export function createBrowser(uri, attributes = {}) {
   let originAttributes = browserImports.E10SUtils.predictOriginAttributes({
diff --git a/apps/content/tsconfig.json b/apps/content/tsconfig.json
index f8e260b..ec0f7b1 100644
--- a/apps/content/tsconfig.json
+++ b/apps/content/tsconfig.json
@@ -1,10 +1,12 @@
 {
+  "$schema": "https://json.schemastore.org/tsconfig.json",
   "extends": "@tsconfig/svelte/tsconfig.json",
   "compilerOptions": {
     "target": "es2022",
     "allowArbitraryExtensions": true,
     "paths": {},
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "types": ["@browser/link"]
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules/*", "static/*"]
diff --git a/apps/extensions/lib/ext-browser.json b/apps/extensions/lib/ext-browser.json
index e9ebae6..50f819b 100644
--- a/apps/extensions/lib/ext-browser.json
+++ b/apps/extensions/lib/ext-browser.json
@@ -1,4 +1,11 @@
 {
+  "browserAction": {
+    "url": "chrome://bextensions/content/parent/ext-browserAction.js",
+    "schema": "chrome://bextensions/content/schemas/browser_action.json",
+    "scopes": ["addon_parent"],
+    "manifest": ["browser_action"],
+    "paths": [["browserAction"]]
+  },
   "pageAction": {
     "url": "chrome://bextensions/content/parent/ext-pageAction.js",
     "schema": "chrome://extensions/content/schemas/page_action.json",
diff --git a/apps/extensions/lib/parent/ext-browser.js b/apps/extensions/lib/parent/ext-browser.js
index 5f2a7b2..85754dc 100644
--- a/apps/extensions/lib/parent/ext-browser.js
+++ b/apps/extensions/lib/parent/ext-browser.js
@@ -13,6 +13,7 @@ const { lazyESModuleGetters } = typedImportUtils
 
 const lazy = lazyESModuleGetters({
   WindowTracker: 'resource://app/modules/BrowserWindowTracker.sys.mjs',
+  EBrowserActions: 'resource://app/modules/EBrowserActions.sys.mjs',
   EPageActions: 'resource://app/modules/EPageActions.sys.mjs',
   ExtensionParent: 'resource://gre/modules/ExtensionParent.sys.mjs',
 })
@@ -36,8 +37,10 @@ class TabTracker extends TabTrackerBase {
   }
 
   /**
+   * @template {import('@browser/tabs').WindowTab | null} T
    * @param {number} tabId
-   * @param {import('@browser/tabs').WindowTab} default_
+   * @param {T} default_
+   * @returns {T}
    */
   getTab(tabId, default_) {
     const { tab } = lazy.WindowTracker.getWindowWithBrowserId(tabId) || {
@@ -47,6 +50,28 @@ class TabTracker extends TabTrackerBase {
     return tab
   }
 
+  /**
+   * @param {import('resource://gre/modules/Extension.sys.mjs').Extension} extension
+   * @param {import('@browser/tabs').WindowTab} tab
+   * @param {Window} window
+   *
+   * @returns {tabs__tabs.Tab}
+   */
+  serializeTab(extension, tab, window) {
+    // TODO: Active tab & host permissions
+    const hasTabPermission = extension.hasPermission('tabs')
+
+    return {
+      id: tab.view.browserId,
+      index: window.windowTabs().findIndex((wTab) => wTab === tab),
+      active: window.activeTab() === tab,
+      highlighted: false, // TODO
+      title: (hasTabPermission && tab.view.title) || undefined,
+      url: (hasTabPermission && tab.view.uri.asciiSpec) || undefined,
+      windowId: window.windowId,
+    }
+  }
+
   /**
    * @param {XULBrowserElement} browser
    */
@@ -61,4 +86,6 @@ class TabTracker extends TabTrackerBase {
   }
 }
 
-Object.assign(global, { tabTracker: new TabTracker() })
+/** @global */
+let tabTracker = new TabTracker()
+Object.assign(global, { tabTracker })
diff --git a/apps/extensions/lib/parent/ext-browserAction.js b/apps/extensions/lib/parent/ext-browserAction.js
new file mode 100644
index 0000000..e675983
--- /dev/null
+++ b/apps/extensions/lib/parent/ext-browserAction.js
@@ -0,0 +1,129 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// @ts-check
+/// <reference path="../types/index.d.ts" />
+/// <reference path="./ext-browser.js" />
+/// <reference types="@browser/link" />
+
+this.browserAction = class extends ExtensionAPIPersistent {
+  /** @type {import("resource://app/modules/EBrowserActions.sys.mjs").IBrowserAction | undefined} */
+  browserAction
+
+  async onManifestEntry() {
+    const { extension } = this
+    /** @type {browser_action__manifest.WebExtensionManifest__extended['browser_action']} */
+    const options = extension.manifest.browser_action
+
+    if (!options) {
+      return
+    }
+
+    this.browserAction = lazy.EBrowserActions.BrowserAction(extension.id, {
+      icons: lazy.ExtensionParent.IconDetails.normalize(
+        {
+          path: options.default_icon || extension.manifest.icons,
+          iconType: 'browserAction',
+          themeIcon: options.theme_icons,
+        },
+        extension,
+      ),
+      title: options.default_title || extension.id,
+      popupUrl: options.default_popup,
+    })
+    this.browserAction.getEmiter().on('click', (v) => this.emit('click', v))
+
+    lazy.EBrowserActions.actions.addKey(extension.id, this.browserAction)
+  }
+
+  onShutdown() {
+    lazy.EBrowserActions.actions.removeKey(this.extension.id)
+  }
+
+  PERSISTENT_EVENTS = {
+    /**
+     * @param {object}             options
+     * @param {object}             options.fire
+     * @param {function}           options.fire.async
+     * @param {function}           options.fire.sync
+     * @param {function}           options.fire.raw
+     *        For primed listeners `fire.async`/`fire.sync`/`fire.raw` will
+     *        collect the pending events to be send to the background context
+     *        and implicitly wake up the background context (Event Page or
+     *        Background Service Worker), or forward the event right away if
+     *        the background context is running.
+     * @param {function}           [options.fire.wakeup = undefined]
+     *        For primed listeners, the `fire` object also provide a `wakeup` method
+     *        which can be used by the primed listener to explicitly `wakeup` the
+     *        background context (Event Page or Background Service Worker) and wait for
+     *        it to be running (by awaiting on the Promise returned by wakeup to be
+     *        resolved).
+     * @param {ProxyContextParent} [options.context=undefined]
+     *        This property is expected to be undefined for primed listeners (which
+     *        are created while the background extension context does not exist) and
+     *        to be set to a ProxyContextParent instance (the same got by the getAPI
+     *        method) when the method is called for a listener registered by a
+     *        running extension context.
+     */
+    onClicked({ fire }) {
+      const { extension } = this
+
+      /**
+       * @param {import("resource://app/modules/EBrowserActions.sys.mjs").IBrowserActionEvents['click']} clickInfo
+       */
+      const callback = async (_name, clickInfo) => {
+        if (fire.wakeup) await fire.wakeup()
+        const { tab, window } = lazy.WindowTracker.getWindowWithBrowserId(
+          clickInfo.tabId,
+        ) || { tab: null, window: null }
+
+        if (!tab || !window) {
+          return fire.sync(null, clickInfo.clickData)
+        }
+
+        fire.sync(
+          tabTracker.serializeTab(extension, tab, window),
+          clickInfo.clickData,
+        )
+      }
+
+      this.on('click', callback)
+      return {
+        unregister: () => {
+          this.off('click', callback)
+        },
+        convert(newFire) {
+          fire = newFire
+        },
+      }
+    },
+  }
+
+  /** @returns {browser_action__browserAction.ApiGetterReturn} */
+  // eslint-disable-next-line no-unused-vars
+  getAPI(context) {
+    const { browserAction } = this
+
+    return {
+      browserAction: {
+        setTitle({ title }) {
+          // TODO: Tab & Window implementation
+          browserAction?.setTitle(title)
+        },
+        async getTitle() {
+          // TODO: Tab & Window impl
+          return browserAction?.getTitle().get()
+        },
+
+        onClicked: new EventManager({
+          context,
+          module: 'browserAction',
+          event: 'onClicked',
+          inputHandling: true,
+          extensionApi: this,
+        }).api(),
+      },
+    }
+  }
+}
diff --git a/apps/extensions/lib/parent/ext-pageAction.js b/apps/extensions/lib/parent/ext-pageAction.js
index 5339ca1..9dd939e 100644
--- a/apps/extensions/lib/parent/ext-pageAction.js
+++ b/apps/extensions/lib/parent/ext-pageAction.js
@@ -14,6 +14,10 @@ this.pageAction = class extends ExtensionAPIPersistent {
     const { extension } = this
     const options = extension.manifest.page_action
 
+    if (!options) {
+      return
+    }
+
     this.pageAction = new lazy.EPageActions.PageAction({
       extensionId: extension.id,
       tooltip: options.default_title,
@@ -27,7 +31,7 @@ this.pageAction = class extends ExtensionAPIPersistent {
         {
           path: options.default_icon || extension.manifest.icons,
           iconType: 'browserAction',
-          themeIcon: options.theme_icons || extension.theme_icons,
+          themeIcon: options.theme_icons,
         },
         extension,
       ),
diff --git a/apps/extensions/lib/parent/ext-tabs.js b/apps/extensions/lib/parent/ext-tabs.js
index a2d209e..ab00470 100644
--- a/apps/extensions/lib/parent/ext-tabs.js
+++ b/apps/extensions/lib/parent/ext-tabs.js
@@ -5,7 +5,7 @@
 // @ts-check
 /// <reference path="../types/index.d.ts"  />
 /// <reference path="./ext-browser.js"  />
-/// <reference path="../schemaTypes/tabs.d.ts"  />
+/// <reference types="@browser/link" />
 
 /**
  * @param {tabs__tabs.QueryInfo} queryInfo
@@ -60,20 +60,8 @@ const serialize =
    * @param {[import("@browser/tabs").WindowTab, Window]} in
    * @returns {tabs__tabs.Tab}
    */
-  ([tab, window]) => {
-    // TODO: Active tab & host permissions
-    const hasTabPermission = extension.hasPermission('tabs')
-
-    return {
-      id: tab.view.browserId,
-      index: window.windowTabs().findIndex((wTab) => wTab === tab),
-      active: window.activeTab() === tab,
-      highlighted: false, // TODO
-      title: hasTabPermission && tab.view.title,
-      url: hasTabPermission && tab.view.uri.asciiSpec,
-      windowId: window.windowId,
-    }
-  }
+  ([tab, window]) =>
+    tabTracker.serializeTab(extension, tab, window)
 
 this.tabs = class extends ExtensionAPIPersistent {
   PERSISTENT_EVENTS = {}
diff --git a/apps/extensions/lib/schemas/browser_action.json b/apps/extensions/lib/schemas/browser_action.json
new file mode 100644
index 0000000..98f36df
--- /dev/null
+++ b/apps/extensions/lib/schemas/browser_action.json
@@ -0,0 +1,126 @@
+[
+  {
+    "namespace": "manifest",
+    "types": [
+      {
+        "$extend": "WebExtensionManifest",
+        "properties": {
+          "browser_action": {
+            "type": "object",
+            "optional": true,
+            "properties": {
+              "default_icon": {
+                "optional": true,
+                "$ref": "IconPath"
+              },
+              "default_popup": {
+                "optional": true,
+                "type": "string",
+                "format": "relativeUrl"
+              },
+              "default_title": {
+                "optional": true,
+                "type": "string"
+              },
+              "theme_icons": {
+                "optional": true,
+                "type": "array",
+                "items": { "$ref": "ThemeIcons" }
+              },
+              "browser_style": {
+                "optional": true,
+                "type": "boolean"
+              },
+              "default_area": {
+                "optional": true,
+                "type": "string"
+              }
+            }
+          }
+        }
+      }
+    ]
+  },
+  {
+    "namespace": "browserAction",
+    "description": "",
+    "types": [],
+    "events": [
+      {
+        "name": "onClicked",
+        "type": "function",
+        "description": "Notify when the browser action is clicked",
+        "parameters": [
+          {
+            "name": "tab",
+            "$ref": "Tab"
+          },
+          {
+            "name": "OnClickData",
+            "type": "object",
+            "properties": {
+              "modifiers": {
+                "type": "array",
+                "items": { "type": "string" }
+              },
+              "button": { "type": "integer" }
+            }
+          }
+        ]
+      }
+    ],
+    "functions": [
+      {
+        "name": "setTitle",
+        "type": "function",
+        "async": true,
+        "parameters": [
+          {
+            "name": "details",
+            "type": "object",
+            "properties": {
+              "title": {
+                "type": "string",
+                "optional": true
+              },
+              "tabId": {
+                "type": "integer",
+                "optional": true
+              },
+              "windowId": {
+                "type": "integer",
+                "optional": true
+              }
+            }
+          }
+        ]
+      },
+      {
+        "name": "getTitle",
+        "type": "function",
+        "async": true,
+        "parameters": [
+          {
+            "name": "details",
+            "type": "object",
+            "optional": true,
+            "properties": {
+              "tabId": {
+                "type": "integer",
+                "optional": true
+              },
+              "windowId": {
+                "type": "integer",
+                "optional": true
+              }
+            }
+          }
+        ],
+        "returns": {
+          "type": "string",
+          "optional": true
+        }
+      }
+    ]
+  }
+]
diff --git a/apps/extensions/lib/schemas/tabs.json b/apps/extensions/lib/schemas/tabs.json
index 40b0ef7..064190b 100644
--- a/apps/extensions/lib/schemas/tabs.json
+++ b/apps/extensions/lib/schemas/tabs.json
@@ -8,7 +8,6 @@
     "types": [
       {
         "$extend": "OptionalPermission",
-        "id": "ExtraPerms1",
         "choices": [
           {
             "type": "string",
diff --git a/apps/extensions/lib/types/utils.d.ts b/apps/extensions/lib/types/utils.d.ts
index 67febf3..42ffd57 100644
--- a/apps/extensions/lib/types/utils.d.ts
+++ b/apps/extensions/lib/types/utils.d.ts
@@ -4,6 +4,8 @@
 
 /* eslint-disable @typescript-eslint/ban-types */
 /// <reference types="gecko-types" />
+import { Module } from 'module'
+
 import { ConduitAddress } from 'resource://gre/modules/ConduitsParent.sys.mjs'
 import { Extension } from 'resource://gre/modules/Extension.sys.mjs'
 import { SchemaRoot } from 'resource://gre/modules/Schemas.sys.mjs'
@@ -155,6 +157,7 @@ declare global {
     [LISTENERS]: Map<any, any>;
     [ONCE_MAP]: WeakMap<object, any>
   }
+
   /**
    * Base class for WebExtension APIs.  Each API creates a new class
    * that inherits from this class, the derived class is instantiated
@@ -162,7 +165,7 @@ declare global {
    */
   class ExtensionAPI extends EventEmitter {
     constructor(extension: any)
-    extension: any
+    extension: Extension
     destroy(): void
     onManifestEntry(entry: any): void
     getAPI(context: any): void
@@ -739,6 +742,16 @@ declare global {
      */
     loadScript(scriptUrl: string): void
   }
+
+  type EventApi<Module extends string, Event extends string> = {
+    [x: number]: () => void
+    addListener: (...args: any[]) => void
+    removeListener: (...args: any[]) => void
+    hasListener: (...args: any[]) => boolean
+    setUserInput: any
+    _typechecking: { module: Module; event: Event }
+  }
+
   /**
    * This is a generic class for managing event listeners.
    *
@@ -765,7 +778,7 @@ declare global {
    * ExtensionContext in the chrome process or ExtensionContext in a
    * content process).
    */
-  class EventManager {
+  class EventManager<Module extends string, Event extends string> {
     static _initPersistentListeners(extension: any): boolean
     static _writePersistentListeners(extension: any): void
     static primeListeners(extension: any, isInStartup?: boolean): void
@@ -799,7 +812,13 @@ declare global {
       key?: any,
       primeId?: any,
     ): void
-    constructor(params: any)
+    constructor(params: {
+      context: any
+      module: Module
+      event: Event
+      inputHandling: boolean
+      extensionApi: ExtensionAPI
+    })
     context: any
     module: any
     event: any
@@ -815,13 +834,7 @@ declare global {
     hasListener(callback: any): boolean
     revoke(): void
     close(): void
-    api(): {
-      [x: number]: () => void
-      addListener: (...args: any[]) => void
-      removeListener: (...args: any[]) => void
-      hasListener: (...args: any[]) => boolean
-      setUserInput: any
-    }
+    api(): EventApi<Module, Event>
   }
   const LISTENERS: unique symbol
   const ONCE_MAP: unique symbol
diff --git a/apps/extensions/package.json b/apps/extensions/package.json
index b49203b..2cd0d68 100644
--- a/apps/extensions/package.json
+++ b/apps/extensions/package.json
@@ -1,10 +1,10 @@
 {
-  "name": "extensions",
+  "name": "@browser/extensions",
   "type": "module",
   "version": "1.0.0",
   "scripts": {
     "build": "node ./scripts/buildTypes.js",
-    "dev": "watch 'pnpm build' ./lib/schemas/"
+    "dev": "watch 'pnpm build' ./lib/schemas/ ./scripts/"
   },
   "dependencies": {
     "@browser/link": "workspace:*"
diff --git a/apps/extensions/scripts/buildTypes.js b/apps/extensions/scripts/buildTypes.js
index 1f2a339..89bf255 100644
--- a/apps/extensions/scripts/buildTypes.js
+++ b/apps/extensions/scripts/buildTypes.js
@@ -23,6 +23,7 @@ const {
  * @property {string} description
  * @property {Type[]} [types]
  * @property {FunctionType[]} [functions]
+ * @property {FunctionType[]} [events]
  */
 
 /**
@@ -54,7 +55,7 @@ const {
 /**
  * @typedef {object} StringType
  * @property {'string'} type
- * @property {{ name: string }[]} [enum]
+ * @property {({ name: string } | string)[]} [enum]
  */
 
 /**
@@ -78,7 +79,12 @@ const {
  */
 
 const schemaFolder = path.join(process.cwd(), 'lib', 'schemas')
-const outFolder = path.join(process.cwd(), 'lib', 'schemaTypes')
+const outFolder = path.join(
+  process.cwd(),
+  '../..',
+  'libs/link/types',
+  'schemaTypes',
+)
 
 const printer = createPrinter({
   newLine: NewLineKind.LineFeed,
@@ -86,9 +92,14 @@ const printer = createPrinter({
 })
 
 const QUESTION_TOKEN = factory.createToken(SyntaxKind.QuestionToken)
+const UNDEFINED_TOKEN = factory.createKeywordTypeNode(
+  SyntaxKind.UndefinedKeyword,
+)
 
+const modules = []
 for (const file of fs.readdirSync(schemaFolder)) {
   const fileName = file.replace('.json', '')
+  modules.push(fileName)
   let text = fs.readFileSync(path.join(schemaFolder, file), 'utf8')
   const sourceFile = createSourceFile(file, text, ScriptTarget.Latest)
 
@@ -111,7 +122,11 @@ for (const file of fs.readdirSync(schemaFolder)) {
           undefined,
           'ApiGetterReturn',
           undefined,
-          generateApiGetter(namespace.functions || [], namespace.namespace),
+          generateApiGetter(
+            namespace.functions || [],
+            namespace.events || [],
+            namespace.namespace,
+          ),
         ),
       ])
 
@@ -132,6 +147,12 @@ for (const file of fs.readdirSync(schemaFolder)) {
   )
 }
 
+fs.writeFileSync(
+  path.join(outFolder, 'index.d.ts'),
+  '// @not-mpl \n' +
+    modules.map((m) => `/// <reference path="./${m}.d.ts" />`).join('\n'),
+)
+
 /**
  * @param {Type[]} types
  * @returns {import('typescript').TypeAliasDeclaration[]}
@@ -139,7 +160,10 @@ for (const file of fs.readdirSync(schemaFolder)) {
 function generateTypes(types) {
   return types
     .map((type) => {
-      if (type.$extend) return null
+      if (type.$extend) {
+        type.id = `${type.$extend}__extended`
+        type.type = 'object'
+      }
 
       return factory.createTypeAliasDeclaration(
         undefined,
@@ -153,16 +177,17 @@ function generateTypes(types) {
 
 /**
  * @param {FunctionType[]} functions
+ * @param {FunctionType[]} events
  * @param {string} apiName
  */
-function generateApiGetter(functions, apiName) {
+function generateApiGetter(functions, events, apiName) {
   return factory.createTypeLiteralNode([
     factory.createPropertySignature(
       undefined,
       factory.createIdentifier(apiName),
       undefined,
-      factory.createTypeLiteralNode(
-        functions.map((fn) =>
+      factory.createTypeLiteralNode([
+        ...functions.map((fn) =>
           factory.createPropertySignature(
             undefined,
             factory.createIdentifier(fn.name),
@@ -170,7 +195,25 @@ function generateApiGetter(functions, apiName) {
             generateTypeNode(fn),
           ),
         ),
-      ),
+        ...events.map((event) =>
+          factory.createPropertySignature(
+            undefined,
+            factory.createIdentifier(event.name),
+            undefined,
+            factory.createExpressionWithTypeArguments(
+              factory.createIdentifier('EventApi'),
+              [
+                factory.createLiteralTypeNode(
+                  factory.createStringLiteral(apiName),
+                ),
+                factory.createLiteralTypeNode(
+                  factory.createStringLiteral(event.name),
+                ),
+              ],
+            ),
+          ),
+        ),
+      ]),
     ),
   ])
 }
@@ -243,7 +286,14 @@ function generateTypeNode(type) {
           ? typeof type.async !== 'undefined' && type.async
             ? factory.createTypeReferenceNode(
                 factory.createIdentifier('Promise'),
-                [generateTypeNode(type.returns)],
+                [
+                  type.returns.optional
+                    ? factory.createUnionTypeNode([
+                        generateTypeNode(type.returns),
+                        UNDEFINED_TOKEN,
+                      ])
+                    : generateTypeNode(type.returns),
+                ],
               )
             : generateTypeNode(type.returns)
           : factory.createKeywordTypeNode(SyntaxKind.UnknownKeyword),
@@ -256,7 +306,9 @@ function generateTypeNode(type) {
       if (type.enum) {
         return factory.createUnionTypeNode(
           type.enum.map((e) =>
-            factory.createLiteralTypeNode(factory.createStringLiteral(e.name)),
+            factory.createLiteralTypeNode(
+              factory.createStringLiteral(typeof e === 'string' ? e : e.name),
+            ),
           ),
         )
       }
diff --git a/apps/modules/lib/EBrowserActions.sys.mjs b/apps/modules/lib/EBrowserActions.sys.mjs
new file mode 100644
index 0000000..188f333
--- /dev/null
+++ b/apps/modules/lib/EBrowserActions.sys.mjs
@@ -0,0 +1,99 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+// @ts-check
+/// <reference types="@browser/link" />
+import { map, writable } from 'resource://app/modules/SvelteStore.sys.mjs'
+import mitt from 'resource://app/modules/mitt.sys.mjs'
+
+import { derived } from './SvelteStore.sys.mjs'
+
+/** @typedef {import('resource://app/modules/EBrowserActions.sys.mjs').IBrowserAction} IBrowserAction */
+/** @implements {IBrowserAction} */
+class BrowserAction {
+  id
+  /** @type {ReturnType<IBrowserAction['getEmiter']>} */
+  emiter = mitt()
+
+  /** @type{import('resource://app/modules/SvelteStore.sys.mjs').IWritable<Record<number, string>>} */
+  icons = writable({})
+  /** @type {import('resource://app/modules/SvelteStore.sys.mjs').IWritable<string>} */
+  title = writable('')
+  /** @type {import('resource://app/modules/SvelteStore.sys.mjs').IWritable<string | undefined>} */
+  popupUrl = writable(undefined)
+
+  /**
+   * @param {string} id
+   */
+  constructor(id) {
+    this.id = id
+  }
+
+  getEmiter() {
+    return this.emiter
+  }
+
+  getExtensionId() {
+    return this.id
+  }
+
+  /**
+   * @param {Record<number, string>} icons
+   */
+  setIcons(icons) {
+    this.icons.set(icons)
+  }
+  getIcons() {
+    return this.icons
+  }
+  /** @param {number} preferredSize */
+  getIcon(preferredSize) {
+    return derived([this.icons], (icon) => {
+      let bestSize
+
+      if (icon[preferredSize]) {
+        bestSize = preferredSize
+      } else if (icon[preferredSize * 2]) {
+        bestSize = preferredSize * 2
+      } else {
+        const sizes = Object.keys(icon)
+          .map((key) => parseInt(key, 10))
+          .sort((a, b) => a - b)
+        bestSize =
+          sizes.find((candidate) => candidate > preferredSize) ||
+          sizes.pop() ||
+          0
+      }
+
+      return icon[bestSize]
+    })
+  }
+
+  setTitle(title) {
+    this.title.set(title)
+  }
+  getTitle() {
+    return this.title
+  }
+
+  setPopupUrl(url) {
+    this.popupUrl.set(url)
+  }
+  getPopupUrl() {
+    return this.popupUrl
+  }
+}
+
+/** @type {typeof import('resource://app/modules/EBrowserActions.sys.mjs').EBrowserActions} */
+export const EBrowserActions = {
+  BrowserAction: (id, options) => {
+    const action = new BrowserAction(id)
+
+    action.setIcons(options.icons)
+    action.setTitle(options.title)
+    action.setPopupUrl(options.popupUrl)
+
+    return action
+  },
+  actions: map({}),
+}
diff --git a/apps/modules/lib/SvelteStore.sys.mjs b/apps/modules/lib/SvelteStore.sys.mjs
new file mode 100644
index 0000000..8d9ccba
--- /dev/null
+++ b/apps/modules/lib/SvelteStore.sys.mjs
@@ -0,0 +1,120 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// @ts-check
+/// <reference types="@browser/link" />
+
+/** @type {import('resource://app/modules/SvelteStore.sys.mjs').ReadableFn} */
+export function readable(initial, update) {
+  let value = initial
+
+  let nextSubscription = 0
+  let subscriptions = {}
+
+  const init = !update
+    ? () => {}
+    : () =>
+        update((v) => {
+          value = v
+          for (const id in subscriptions) {
+            subscriptions[id](value)
+          }
+        })
+
+  return {
+    subscribe(cb) {
+      if (nextSubscription === 0) init()
+
+      const id = nextSubscription++
+      subscriptions[id] = cb
+      cb(value)
+      return () => delete subscriptions[id]
+    },
+    get: () => value,
+  }
+}
+
+/** @type {import('resource://app/modules/SvelteStore.sys.mjs').WritableFn} */
+export function writable(initial) {
+  let value = initial
+
+  let nextSubscription = 0
+  let subscriptions = {}
+
+  /** @param {typeof value} v */
+  function set(v) {
+    value = v
+    for (const id in subscriptions) {
+      subscriptions[id](value)
+    }
+  }
+
+  return {
+    set,
+
+    subscribe(cb) {
+      const id = nextSubscription++
+      subscriptions[id] = cb
+      cb(value)
+      return () => delete subscriptions[id]
+    },
+    update: (cb) => set(cb(value)),
+    get: () => value,
+  }
+}
+
+/** @type {import('resource://app/modules/SvelteStore.sys.mjs').MapFn} */
+export function map(initial) {
+  let value = initial
+
+  let nextGlobalSubscription = 0
+  let globalSubscriptions = {}
+
+  function triggerGlobalUpdate() {
+    for (const id in globalSubscriptions) {
+      globalSubscriptions[id](value)
+    }
+  }
+
+  return {
+    get: () => ({ ...value }),
+    /** @param {(value: typeof initial) => void} cb  */
+    subscribe(cb) {
+      const id = nextGlobalSubscription++
+      globalSubscriptions[id] = cb
+      cb(value)
+      return () => delete globalSubscriptions[id]
+    },
+
+    /** @param {keyof typeof initial} k */
+    key: (k) => value[k],
+    /**
+     * @param {keyof typeof initial} key
+     * @param {typeof initial[keyof typeof initial]} v
+     */
+    addKey(key, v) {
+      value[key] = v
+      triggerGlobalUpdate()
+      return v
+    },
+    /** @param {keyof typeof initial} key */
+    removeKey(key) {
+      const v = value[key]
+      delete value[key]
+      triggerGlobalUpdate()
+      return v
+    },
+  }
+}
+
+/** @type {import('resource://app/modules/SvelteStore.sys.mjs').DerivedFn} */
+export function derived(stores, update) {
+  return readable(update(...stores.map((store) => store.get())), (set) => {
+    const performUpdate = () =>
+      set(update(...stores.map((store) => store.get())))
+    for (const store of stores) {
+      store.subscribe(performUpdate)
+    }
+  })
+}
diff --git a/apps/tests/integrations/_index.sys.mjs b/apps/tests/integrations/_index.sys.mjs
index c1a4e99..b42d005 100644
--- a/apps/tests/integrations/_index.sys.mjs
+++ b/apps/tests/integrations/_index.sys.mjs
@@ -1,5 +1,6 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+import './extensions/browserAction.mjs'
 import './extensions/pageAction.mjs'
 import './extensions/tabs.mjs'
diff --git a/apps/tests/integrations/extensions/browserAction.mjs b/apps/tests/integrations/extensions/browserAction.mjs
new file mode 100644
index 0000000..6dfcc81
--- /dev/null
+++ b/apps/tests/integrations/extensions/browserAction.mjs
@@ -0,0 +1,121 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+// @ts-check
+import { ExtensionTestUtils } from 'resource://app/modules/ExtensionTestUtils.sys.mjs'
+import { TestManager } from 'resource://app/modules/TestManager.sys.mjs'
+import { lazyESModuleGetters } from 'resource://app/modules/TypedImportUtils.sys.mjs'
+
+const lazy = lazyESModuleGetters({
+  EBrowserActions: 'resource://app/modules/EBrowserActions.sys.mjs',
+})
+
+/** @param {number} len */
+const delay =
+  (len) =>
+  /**
+   * @template T
+   * @param {T} v
+   * @returns {Promise<T>}
+   */ (v) =>
+    new Promise((res) => setTimeout(() => res(v), len))
+
+/**
+ * @param {() => Promise<unknown>} fn
+ * @param {number} timeout
+ */
+const timeoutFail = (fn, timeout) =>
+  Promise.race([delay(timeout)(false), fn().then(() => true)])
+
+await TestManager.withBrowser(['http://example.com/'], async (window) => {
+  await TestManager.test('browserAction - Icon & Panel', async (test) => {
+    const extension = ExtensionTestUtils.loadExtension(
+      {
+        manifest: {
+          browser_action: {
+            default_icon: './flask-line.svg',
+            default_popup: 'browseraction.html',
+            default_title: 'pageaction title',
+          },
+        },
+        async background() {
+          /** @type {import('resource://app/modules/ExtensionTestUtils.sys.mjs').TestBrowser} */
+          const b = this.browser
+
+          b.test.onMessage.addListener(async () => {
+            b.test.assertEq(
+              'pageaction title',
+              await b.browserAction.getTitle({}),
+              'Page action title should match default',
+            )
+
+            await b.browserAction.setTitle({ title: 'new title' })
+
+            b.test.assertEq(
+              'new title',
+              await b.browserAction.getTitle({}),
+              'Page action title should have updated',
+            )
+            b.test.sendMessage('done')
+          })
+
+          b.browserAction.onClicked.addListener((tab, info) => {
+            b.test.sendMessage('clicked')
+          })
+        },
+        files: {
+          'flask-line.svg': `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M15.9994 2V4H14.9994V7.24291C14.9994 8.40051 15.2506 9.54432 15.7357 10.5954L20.017 19.8714C20.3641 20.6236 20.0358 21.5148 19.2836 21.8619C19.0865 21.9529 18.8721 22 18.655 22H5.34375C4.51532 22 3.84375 21.3284 3.84375 20.5C3.84375 20.2829 3.89085 20.0685 3.98181 19.8714L8.26306 10.5954C8.74816 9.54432 8.99939 8.40051 8.99939 7.24291V4H7.99939V2H15.9994ZM13.3873 10.0012H10.6115C10.5072 10.3644 10.3823 10.7221 10.2371 11.0724L10.079 11.4335L6.12439 20H17.8734L13.9198 11.4335C13.7054 10.9691 13.5276 10.4902 13.3873 10.0012ZM10.9994 7.24291C10.9994 7.49626 10.9898 7.7491 10.9706 8.00087H13.0282C13.0189 7.87982 13.0119 7.75852 13.0072 7.63704L12.9994 7.24291V4H10.9994V7.24291Z"></path></svg>`,
+          'browseraction.html': `
+          <!DOCTYPE html>
+          <html lang="en">
+            <head>
+              <meta charset="UTF-8" />
+              <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+            </head>
+            <body>
+              <h1>Hello world</h1>
+            </body>
+          </html>`,
+        },
+      },
+      test,
+    )
+
+    await extension
+      .testCount(2)
+      .startup()
+      .then(delay(100))
+      .then((e) => {
+        test.truthy(
+          lazy.EBrowserActions.actions.key(extension.extension.id),
+          'Browser action should be registered',
+        )
+        test.equals(
+          lazy.EBrowserActions.actions
+            .key(extension.extension.id)
+            ?.getTitle()
+            .get(),
+          'pageaction title',
+          'Title is saved correctly',
+        )
+        return e
+      })
+      .then((e) => e.sendMsg(''))
+      .then((e) => e.awaitMsg('done'))
+      .then(async (e) => {
+        const action = lazy.EBrowserActions.actions.key(extension.extension.id)
+        test.equals(action?.getTitle().get(), 'new title', 'Title updated')
+
+        action
+          ?.getEmiter()
+          .emit('click', { clickData: { modifiers: [], button: 0 } })
+        test.truthy(
+          await timeoutFail(() => e.awaitMsg('clicked'), 10),
+          'Click event was passed in a timely manner',
+        )
+
+        return e
+      })
+      .then((e) => e.unload())
+  })
+})
diff --git a/apps/tests/integrations/extensions/pageAction.mjs b/apps/tests/integrations/extensions/pageAction.mjs
index 76ecdbc..5b8acbe 100644
--- a/apps/tests/integrations/extensions/pageAction.mjs
+++ b/apps/tests/integrations/extensions/pageAction.mjs
@@ -17,6 +17,17 @@ async function spinLock(predicate) {
 }
 
 await TestManager.withBrowser(['http://example.com/'], async (window) => {
+  await spinLock(() =>
+    window
+      ?.windowTabs()
+      .map(
+        (tab) =>
+          tab.view.browser?.mInitialized &&
+          tab.view.websiteState === 'complete',
+      )
+      .reduce((p, c) => p && c, true),
+  )
+
   await TestManager.test('pageAction - Icon & Panel', async (test) => {
     const extension = ExtensionTestUtils.loadExtension(
       {
diff --git a/libs/link/package.json b/libs/link/package.json
index b8f5316..51a31c8 100644
--- a/libs/link/package.json
+++ b/libs/link/package.json
@@ -1,8 +1,9 @@
 {
+  "$schema": "https://json.schemastore.org/package.json",
   "name": "@browser/link",
   "version": "1.0.0",
   "description": "",
-  "types": "./types/_link.d.ts",
+  "types": "./types",
   "keywords": [],
   "author": "",
   "license": "ISC",
diff --git a/libs/link/types/_link.d.ts b/libs/link/types/_link.d.ts
index a0cf9a9..bb3820a 100644
--- a/libs/link/types/_link.d.ts
+++ b/libs/link/types/_link.d.ts
@@ -8,6 +8,8 @@
 /// <reference types="gecko-types" />
 /// <reference types="@types/firefox-webext-browser" />
 
+/// <reference path="./schemaTypes/index.d.ts" />
+
 /// <reference path="./globals/ChromeUtils.d.ts" />
 /// <reference path="./globals/Cr.d.ts" />
 /// <reference path="./globals/Elements.d.ts" />
@@ -21,10 +23,12 @@
 
 /// <reference path="./modules/AppConstants.d.ts" />
 /// <reference path="./modules/BrowserWindowTracker.d.ts" />
+/// <reference path="./modules/EBrowserActions.d.ts" />
 /// <reference path="./modules/EPageActions.d.ts" />
 /// <reference path="./modules/ExtensionTestUtils.d.ts" />
 /// <reference path="./modules/mitt.d.ts" />
 /// <reference path="./modules/PlacesUtils.d.ts" />
+/// <reference path="./modules/SvelteStore.d.ts" />
 /// <reference path="./modules/typedImport.d.ts" />
 /// <reference path="./modules/TestManager.d.ts" />
 /// <reference path="./modules/ZoomStore.d.ts" />
diff --git a/libs/link/types/globals/Elements.d.ts b/libs/link/types/globals/Elements.d.ts
index d1ad86f..52e1fdc 100644
--- a/libs/link/types/globals/Elements.d.ts
+++ b/libs/link/types/globals/Elements.d.ts
@@ -91,6 +91,7 @@ declare interface XULFindBarElement extends HTMLElement {
 }
 
 declare interface XULPanel extends HTMLElement {
+  hidePopup(): void
   openPopup(target: HTMLElement, anchor: string)
 }
 
diff --git a/libs/link/types/index.d.ts b/libs/link/types/index.d.ts
new file mode 100644
index 0000000..ff00be5
--- /dev/null
+++ b/libs/link/types/index.d.ts
@@ -0,0 +1,5 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/// <reference path="./_link.d.ts" />
diff --git a/libs/link/types/modules/EBrowserActions.d.ts b/libs/link/types/modules/EBrowserActions.d.ts
new file mode 100644
index 0000000..5712699
--- /dev/null
+++ b/libs/link/types/modules/EBrowserActions.d.ts
@@ -0,0 +1,54 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+declare module 'resource://app/modules/EBrowserActions.sys.mjs' {
+  import type { Emitter } from 'mitt'
+  import type {
+    IMapStore,
+    IReadable,
+  } from 'resource://app/modules/SvelteStore.sys.mjs'
+
+  export type IBrowserActionEvents = {
+    click: {
+      tabId: number
+      clickData: { modifiers: string[]; button: number }
+    }
+  }
+
+  export interface IBrowserAction {
+    getEmiter(): Emitter<IBrowserActionEvents>
+
+    getExtensionId(): string
+
+    setIcons(icons: Record<number, string>): void
+    getIcons(): IReadable<Record<number, string>>
+    getIcon(resolution: number): IReadable<string>
+
+    setTitle(title: string | undefined): void
+    getTitle(): IReadable<string | undefined>
+
+    setPopupUrl(url: string): void
+    getPopupUrl(): IReadable<string | undefined>
+  }
+
+  export const EBrowserActions: {
+    BrowserAction: (
+      id: string,
+      options: {
+        title: string
+        icons: Record<number, string>
+        popupUrl?: string
+      },
+    ) => IBrowserAction
+    actions: IMapStore<string, IBrowserAction>
+  }
+}
+
+declare interface MozESMExportFile {
+  EBrowserActions: 'resource://app/modules/EBrowserActions.sys.mjs'
+}
+
+declare interface MozESMExportType {
+  EBrowserActions: typeof import('resource://app/modules/EBrowserActions.sys.mjs').EBrowserActions
+}
diff --git a/libs/link/types/modules/ExtensionTestUtils.d.ts b/libs/link/types/modules/ExtensionTestUtils.d.ts
index 2630dce..27352c2 100644
--- a/libs/link/types/modules/ExtensionTestUtils.d.ts
+++ b/libs/link/types/modules/ExtensionTestUtils.d.ts
@@ -38,6 +38,10 @@ declare module 'resource://app/modules/ExtensionTestUtils.sys.mjs' {
         expectedError: ExpectedError,
         message: string,
       ) => unknown
+
+      onMessage: {
+        addListener: (fn: Function) => void
+      }
     }
   }
 
diff --git a/libs/link/types/modules/SvelteStore.d.ts b/libs/link/types/modules/SvelteStore.d.ts
new file mode 100644
index 0000000..25693fe
--- /dev/null
+++ b/libs/link/types/modules/SvelteStore.d.ts
@@ -0,0 +1,62 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+declare module 'resource://app/modules/SvelteStore.sys.mjs' {
+  export interface BasicStore<T> {
+    /**
+     * Svelte will assume that the store is undefined until update is called.
+     * A sane implementaiton would call it once on subscribe
+     *
+     * @returns A method for unsubscribing from the store
+     */
+    subscribe(update: (value: T) => void): () => void
+  }
+
+  export interface BasicWritableStore<T> extends BasicStore<T> {
+    set(value: T): void
+  }
+
+  export interface IReadable<T> extends BasicStore<T> {
+    get(): T
+  }
+
+  export interface IWritable<T> extends IReadable<T>, BasicWritableStore<T> {
+    update(call: (value: T) => T): void
+  }
+
+  /**
+   * Get notified when keys are added or removed, but not changed. For changes,
+   * you should make the values stores
+   */
+  export interface IMapStore<K extends string, V>
+    extends IReadable<Record<K, V>> {
+    addKey(key: K, value: V): V
+    removeKey(key: K): V
+    key(key: K): V | undefined
+  }
+
+  export type ReadableFn = <T>(
+    value: T,
+    update?: (set: (value: T) => void) => void,
+  ) => IReadable<T>
+  export const readable: ReadableFn
+
+  export type WritableFn = <T>(value: T) => IWritable<T>
+  export const writable: WritableFn
+
+  export type MapFn = <K extends string, V>(
+    value: Record<K, V>,
+  ) => IMapStore<K, V>
+  export const map: MapFn
+
+  export type StoreValues<T> = T extends IReadable<infer U>
+    ? U
+    : { [K in keyof T]: T[K] extends IReadable<infer U> ? U : never }
+
+  export type DerivedFn = <Stores extends Array<IReadable<any>>, V>(
+    stores: Stores,
+    update: (...values: StoreValues<Stores>) => V,
+  ) => IReadable<V>
+  export const derived: DerivedFn
+}
diff --git a/libs/link/types/schemaTypes/browser_action.d.ts b/libs/link/types/schemaTypes/browser_action.d.ts
new file mode 100644
index 0000000..6f6ec23
--- /dev/null
+++ b/libs/link/types/schemaTypes/browser_action.d.ts
@@ -0,0 +1,37 @@
+// @not-mpl
+// This file is generated from '../schemas/browser_action.json'. This file inherits its license
+// Please check that file's license
+//
+// DO NOT MODIFY MANUALLY
+
+declare module browser_action__manifest {
+  type WebExtensionManifest__extended = {
+    browser_action?: {
+      default_icon?: IconPath
+      default_popup?: string
+      default_title?: string
+      theme_icons?: ThemeIcons[]
+      browser_style?: boolean
+      default_area?: string
+    }
+  }
+  type ApiGetterReturn = {
+    manifest: {}
+  }
+}
+declare module browser_action__browserAction {
+  type ApiGetterReturn = {
+    browserAction: {
+      setTitle: (details: {
+        title?: string
+        tabId?: number
+        windowId?: number
+      }) => unknown
+      getTitle: (details?: {
+        tabId?: number
+        windowId?: number
+      }) => Promise<string | undefined>
+      onClicked: EventApi<'browserAction', 'onClicked'>
+    }
+  }
+}
diff --git a/libs/link/types/schemaTypes/index.d.ts b/libs/link/types/schemaTypes/index.d.ts
new file mode 100644
index 0000000..24201db
--- /dev/null
+++ b/libs/link/types/schemaTypes/index.d.ts
@@ -0,0 +1,3 @@
+// @not-mpl
+/// <reference path="./browser_action.d.ts" />
+/// <reference path="./tabs.d.ts" />
diff --git a/apps/extensions/lib/schemaTypes/tabs.d.ts b/libs/link/types/schemaTypes/tabs.d.ts
similarity index 95%
rename from apps/extensions/lib/schemaTypes/tabs.d.ts
rename to libs/link/types/schemaTypes/tabs.d.ts
index 1d13734..8e196c1 100644
--- a/apps/extensions/lib/schemaTypes/tabs.d.ts
+++ b/libs/link/types/schemaTypes/tabs.d.ts
@@ -5,6 +5,7 @@
 // DO NOT MODIFY MANUALLY
 
 declare module tabs__manifest {
+  type OptionalPermission__extended = 'tabs' | 'tabHide'
   type ApiGetterReturn = {
     manifest: {}
   }
diff --git a/package.json b/package.json
index 4532abe..930b23b 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "prettier-plugin-svelte": "^3.0.3",
     "tap-parser": "^15.3.2",
     "turbo": "^1.11.2",
-    "typescript": "^5.2.2"
+    "typescript": "^5.4.5"
   },
   "pnpm": {
     "patchedDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b9d21c7..2375a0a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -54,7 +54,7 @@ importers:
         version: 3.0.3
       prettier-plugin-organize-imports:
         specifier: ^3.2.3
-        version: 3.2.3(prettier@3.0.3)(typescript@5.2.2)
+        version: 3.2.3(prettier@3.0.3)(typescript@5.4.5)
       prettier-plugin-svelte:
         specifier: ^3.0.3
         version: 3.0.3(prettier@3.0.3)(svelte@4.2.12)
@@ -65,8 +65,8 @@ importers:
         specifier: ^1.11.2
         version: 1.11.2
       typescript:
-        specifier: ^5.2.2
-        version: 5.2.2
+        specifier: ^5.4.5
+        version: 5.4.5
 
   apps/actors:
     dependencies:
@@ -87,7 +87,7 @@ importers:
         version: 0.5.0
       fnts:
         specifier: ^2.1.0
-        version: 2.1.0(typescript@5.3.3)
+        version: 2.1.0(typescript@5.4.5)
       mitt:
         specifier: ^3.0.1
         version: 3.0.1
@@ -133,7 +133,7 @@ importers:
         version: 2.7.6(webpack@5.89.0)
       postcss-loader:
         specifier: ^7.3.4
-        version: 7.3.4(postcss@8.4.31)(typescript@5.3.3)(webpack@5.89.0)
+        version: 7.3.4(postcss@8.4.31)(typescript@5.4.5)(webpack@5.89.0)
       style-loader:
         specifier: ^3.3.3
         version: 3.3.3(webpack@5.89.0)
@@ -145,16 +145,16 @@ importers:
         version: 3.2.0(svelte@4.2.12)
       svelte-preprocess:
         specifier: ^5.1.3
-        version: 5.1.3(postcss@8.4.31)(svelte@4.2.12)(typescript@5.3.3)
+        version: 5.1.3(postcss@8.4.31)(svelte@4.2.12)(typescript@5.4.5)
       svelte-sequential-preprocessor:
         specifier: ^2.0.1
         version: 2.0.1
       ts-loader:
         specifier: ^9.5.1
-        version: 9.5.1(typescript@5.3.3)(webpack@5.89.0)
+        version: 9.5.1(typescript@5.4.5)(webpack@5.89.0)
       typescript:
-        specifier: ^5.3.3
-        version: 5.3.3
+        specifier: ^5.4.5
+        version: 5.4.5
       webpack:
         specifier: ^5.89.0
         version: 5.89.0(webpack-cli@5.1.4)
@@ -1407,7 +1407,7 @@ packages:
     resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
     dev: true
 
-  /cosmiconfig@8.3.6(typescript@5.3.3):
+  /cosmiconfig@8.3.6(typescript@5.4.5):
     resolution: {integrity: sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==}
     engines: {node: '>=14'}
     peerDependencies:
@@ -1420,7 +1420,7 @@ packages:
       js-yaml: 4.1.0
       parse-json: 5.2.0
       path-type: 4.0.0
-      typescript: 5.3.3
+      typescript: 5.4.5
     dev: true
 
   /cross-spawn@7.0.3:
@@ -2018,7 +2018,7 @@ packages:
     resolution: {integrity: sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==}
     dev: true
 
-  /fnts@2.1.0(typescript@5.3.3):
+  /fnts@2.1.0(typescript@5.4.5):
     resolution: {integrity: sha512-+KFw3//Dbxw3R5xCzP+3BMsjhNiRaJ8w1Al/1aCzI7OqrqzIHCpNZShY1nUFPciqHqe8Z3URo+aA595ePa7Kqw==}
     peerDependencies:
       typescript: '>=4.7'
@@ -2026,7 +2026,7 @@ packages:
       typescript:
         optional: true
     dependencies:
-      typescript: 5.3.3
+      typescript: 5.4.5
     dev: false
 
   /follow-redirects@1.15.3:
@@ -3081,14 +3081,14 @@ packages:
       find-up: 4.1.0
     dev: true
 
-  /postcss-loader@7.3.4(postcss@8.4.31)(typescript@5.3.3)(webpack@5.89.0):
+  /postcss-loader@7.3.4(postcss@8.4.31)(typescript@5.4.5)(webpack@5.89.0):
     resolution: {integrity: sha512-iW5WTTBSC5BfsBJ9daFMPVrLT36MrNiC6fqOZTTaHjBNX6Pfd5p+hSBqe/fEeNd7pc13QiAyGt7VdGMw4eRC4A==}
     engines: {node: '>= 14.15.0'}
     peerDependencies:
       postcss: ^7.0.0 || ^8.0.1
       webpack: ^5.0.0
     dependencies:
-      cosmiconfig: 8.3.6(typescript@5.3.3)
+      cosmiconfig: 8.3.6(typescript@5.4.5)
       jiti: 1.20.0
       postcss: 8.4.31
       semver: 7.5.4
@@ -3164,7 +3164,7 @@ packages:
     engines: {node: '>= 0.8.0'}
     dev: true
 
-  /prettier-plugin-organize-imports@3.2.3(prettier@3.0.3)(typescript@5.2.2):
+  /prettier-plugin-organize-imports@3.2.3(prettier@3.0.3)(typescript@5.4.5):
     resolution: {integrity: sha512-KFvk8C/zGyvUaE3RvxN2MhCLwzV6OBbFSkwZ2OamCrs9ZY4i5L77jQ/w4UmUr+lqX8qbaqVq6bZZkApn+IgJSg==}
     peerDependencies:
       '@volar/vue-language-plugin-pug': ^1.0.4
@@ -3178,7 +3178,7 @@ packages:
         optional: true
     dependencies:
       prettier: 3.0.3
-      typescript: 5.2.2
+      typescript: 5.4.5
     dev: true
 
   /prettier-plugin-svelte@3.0.3(prettier@3.0.3)(svelte@4.2.12):
@@ -3786,7 +3786,7 @@ packages:
       svelte-hmr: 0.14.12(svelte@4.2.12)
     dev: true
 
-  /svelte-preprocess@5.1.3(postcss@8.4.31)(svelte@4.2.12)(typescript@5.3.3):
+  /svelte-preprocess@5.1.3(postcss@8.4.31)(svelte@4.2.12)(typescript@5.4.5):
     resolution: {integrity: sha512-xxAkmxGHT+J/GourS5mVJeOXZzne1FR5ljeOUAMXUkfEhkLEllRreXpbl3dIYJlcJRfL1LO1uIAPpBpBfiqGPw==}
     engines: {node: '>= 16.0.0', pnpm: ^8.0.0}
     requiresBuild: true
@@ -3831,7 +3831,7 @@ packages:
       sorcery: 0.11.0
       strip-indent: 3.0.0
       svelte: 4.2.12(patch_hash=cm43hmf4gczhssi3isoosy53r4)
-      typescript: 5.3.3
+      typescript: 5.4.5
     dev: true
 
   /svelte-remixicon@2.4.0(svelte@4.2.12):
@@ -3963,7 +3963,7 @@ packages:
       utf8-byte-length: 1.0.4
     dev: true
 
-  /ts-loader@9.5.1(typescript@5.3.3)(webpack@5.89.0):
+  /ts-loader@9.5.1(typescript@5.4.5)(webpack@5.89.0):
     resolution: {integrity: sha512-rNH3sK9kGZcH9dYzC7CewQm4NtxJTjSEVRJ2DyBZR7f8/wcta+iV44UPCXc5+nzDzivKtlzV6c9P4e+oFhDLYg==}
     engines: {node: '>=12.0.0'}
     peerDependencies:
@@ -3975,7 +3975,7 @@ packages:
       micromatch: 4.0.5
       semver: 7.5.4
       source-map: 0.7.4
-      typescript: 5.3.3
+      typescript: 5.4.5
       webpack: 5.89.0(webpack-cli@5.1.4)
     dev: true
 
@@ -4063,22 +4063,10 @@ packages:
       mime-types: 2.1.35
     dev: true
 
-  /typescript@5.2.2:
-    resolution: {integrity: sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==}
-    engines: {node: '>=14.17'}
-    hasBin: true
-    dev: true
-
-  /typescript@5.3.3:
-    resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==}
-    engines: {node: '>=14.17'}
-    hasBin: true
-
   /typescript@5.4.5:
     resolution: {integrity: sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==}
     engines: {node: '>=14.17'}
     hasBin: true
-    dev: true
 
   /undici-types@5.25.3:
     resolution: {integrity: sha512-Ga1jfYwRn7+cP9v8auvEXN1rX3sWqlayd4HP7OKk4mZWylEmu3KzXDUGrQUN6Ol7qo1gPvB2e5gX6udnyEPgdA==}
diff --git a/scripts/unit-test.ts b/scripts/unit-test.ts
index 5d5020b..254dd40 100644
--- a/scripts/unit-test.ts
+++ b/scripts/unit-test.ts
@@ -31,7 +31,7 @@ function runner(testPage: string) {
     testProcess?.kill()
     console.error('Process timed out')
     exit(1)
-  }, 10_000)
+  }, 100_000)
 
   testProcess.on('exit', () => clearTimeout(timeout))