@enbox/browser 0.0.1

package/README.md

@@ -0,0 +1,61 @@
+# Web5 Browser package
+
+| Web5 tools and features to use in the browser |
+| --------------------------------------------- |
+
+[![NPM Package][browser-npm-badge]][browser-npm-link]
+[![NPM Downloads][browser-downloads-badge]][browser-npm-link]
+
+[![Build Status][browser-build-badge]][browser-build-link]
+[![Open Issues][browser-issues-badge]][browser-issues-link]
+[![Code Coverage][browser-coverage-badge]][browser-coverage-link]
+
+---
+
+- [Web5 Browser](#introduction)
+  - [Activate Polyfills](#activate-polyfills)
+  - [Project Resources](#project-resources)
+
+---
+
+<a id="introduction"></a>
+
+This package contains browser-specific helpers for building DWAs (Decentralized Web Apps).
+
+### Activate Polyfills
+
+This enables a service worker that can handle Web5 features in the browser such as resolving DRLs that look like: `http://dweb/did:dht:abc123/protocols/read/aHR0cHM6Ly9hcmV3ZXdlYjV5ZXQuY29tL3NjaGVtYXMvcHJvdG9jb2xz/avatar`
+
+To enable this functionality import and run `activatePolyfills()` at the entrypoint of your project, or within an existing service worker.
+
+## Project Resources
+
+| Resource                                | Description                                                                   |
+| --------------------------------------- | ----------------------------------------------------------------------------- |
+| [CODEOWNERS][codeowners-link]           | Outlines the project lead(s)                                                  |
+| [CODE OF CONDUCT][code-of-conduct-link] | Expected behavior for project contributors, promoting a welcoming environment |
+| [CONTRIBUTING][contributing-link]       | Developer guide to build, test, run, access CI, chat, discuss, file issues    |
+| [GOVERNANCE][governance-link]           | Project governance                                                            |
+| [LICENSE][license-link]                 | Apache License, Version 2.0                                                   |
+
+[browser-npm-badge]: https://img.shields.io/npm/v/@enbox/browser.svg?style=flat&color=blue&santize=true
+[browser-npm-link]: https://www.npmjs.com/package/@enbox/browser
+[browser-downloads-badge]: https://img.shields.io/npm/dt/@enbox/browser?&color=blue
+[browser-build-badge]: https://img.shields.io/github/actions/workflow/status/enboxorg/enbox/enbox/tests-ci.yml?branch=main&label=build
+[browser-build-link]: https://github.com/enboxorg/enbox/enbox/actions/workflows/tests-ci.yml
+[browser-coverage-badge]: https://img.shields.io/codecov/c/gh/enboxorg/enbox/enbox/main?style=flat&token=YI87CKF1LI
+[browser-coverage-link]: https://app.codecov.io/github/enboxorg/enbox/enbox/tree/main/packages%2Fbrowser
+[browser-issues-badge]: https://img.shields.io/github/issues/enboxorg/enbox/enbox/package:%20browser?label=issues
+[browser-issues-link]: https://github.com/enboxorg/enbox/enbox/issues?q=is%3Aopen+is%3Aissue+label%3A"package%3A+browser"
+[browser-repo-link]: https://github.com/enboxorg/enbox/enbox/tree/main/packages/browser
+[browser-jsdelivr-link]: https://www.jsdelivr.com/package/npm/@enbox/browser
+[browser-jsdelivr-browser]: https://cdn.jsdelivr.net/npm/@enbox/browser/dist/browser.mjs
+[browser-unpkg-link]: https://unpkg.com/@enbox/browser
+[browser-unpkg-browser]: https://unpkg.com/@enbox/browser/dist/browser.mjs
+[codeowners-link]: https://github.com/enboxorg/enbox/enbox/blob/main/CODEOWNERS
+[code-of-conduct-link]: https://github.com/enboxorg/enbox/enbox/blob/main/CODE_OF_CONDUCT.md
+[contributing-link]: https://github.com/enboxorg/enbox/enbox/blob/main/CONTRIBUTING.md
+[governance-link]: https://github.com/enboxorg/enbox/enbox/blob/main/GOVERNANCE.md
+[license-link]: https://github.com/enboxorg/enbox/enbox/blob/main/LICENSE
+[discord-badge]: https://img.shields.io/discord/937858703112155166?color=5865F2&logo=discord&logoColor=white
+[discord-link]: https://discord.com/channels/937858703112155166/969272658501976117

package/dist/esm/index.js

@@ -0,0 +1,2 @@
+export * from './web-features.js';
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/dist/esm/web-features.js

@@ -0,0 +1,481 @@
+//@ts-nocheck
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+/*
+  This file is run in dual environments to make installation of the Service Worker code easier.
+  Be mindful that code placed in any open excution space may be evaluated multiple times in different contexts,
+  so take care to gate additions to only activate code in the right env, such as a Service Worker scope or page window.
+*/
+import { UniversalResolver, DidDht, DidWeb } from '@enbox/dids';
+// This is in place to prevent our `bundler-bonanza` repo from failing for Node CJS builds
+// Not sure if this is working as expected in all environments, crated an issue
+// TODO: https://github.com/TBD54566975/web5-js/issues/767
+function importMetaIfSupported() {
+    try {
+        return new Function('return import.meta')();
+    }
+    catch (_error) {
+        return undefined;
+    }
+}
+const DidResolver = new UniversalResolver({ didResolvers: [DidDht, DidWeb] });
+const didUrlRegex = /^https?:\/\/dweb\/([^/]+)\/?(.*)?$/;
+const httpToHttpsRegex = /^http:/;
+const trailingSlashRegex = /\/$/;
+function getDwnEndpoints(did) {
+    var _a, _b;
+    return __awaiter(this, void 0, void 0, function* () {
+        const { didDocument } = yield DidResolver.resolve(did);
+        const endpoints = (_b = (_a = didDocument === null || didDocument === void 0 ? void 0 : didDocument.service) === null || _a === void 0 ? void 0 : _a.find((service) => service.type === 'DecentralizedWebNode')) === null || _b === void 0 ? void 0 : _b.serviceEndpoint;
+        return (Array.isArray(endpoints) ? endpoints : [endpoints]).filter((url) => url.startsWith('http'));
+    });
+}
+function handleEvent(event, did, path, options) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const drl = event.request.url
+            .replace(httpToHttpsRegex, 'https:')
+            .replace(trailingSlashRegex, '');
+        const responseCache = yield caches.open('drl');
+        const cachedResponse = yield responseCache.match(drl);
+        if (cachedResponse) {
+            if (!navigator.onLine)
+                return cachedResponse;
+            const match = yield (options === null || options === void 0 ? void 0 : options.onCacheCheck(event, drl));
+            if (match) {
+                const cacheTime = cachedResponse.headers.get('dwn-cache-time');
+                if (cacheTime &&
+                    Date.now() < Number(cacheTime) + (Number(match.ttl) || 0)) {
+                    return cachedResponse;
+                }
+            }
+        }
+        try {
+            if (!path) {
+                const response = yield DidResolver.resolve(did);
+                return new Response(JSON.stringify(response), {
+                    status: 200,
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+            else
+                return yield fetchResource(event, did, drl, path, responseCache, options);
+        }
+        catch (error) {
+            if (error instanceof Response) {
+                return error;
+            }
+            console.log(`Error in DID URL fetch: ${error}`);
+            return new Response('DID URL fetch error', { status: 500 });
+        }
+    });
+}
+function fetchResource(event, did, drl, path, responseCache, options) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const endpoints = yield getDwnEndpoints(did);
+        if (!(endpoints === null || endpoints === void 0 ? void 0 : endpoints.length)) {
+            throw new Response('DWeb Node resolution failed: no valid endpoints found.', { status: 530 });
+        }
+        for (const endpoint of endpoints) {
+            try {
+                const url = `${endpoint.replace(trailingSlashRegex, '')}/${did}/${path}`;
+                const response = yield fetch(url, { headers: event.request.headers });
+                if (response.ok) {
+                    const match = yield (options === null || options === void 0 ? void 0 : options.onCacheCheck(event, drl));
+                    if (match) {
+                        cacheResponse(drl, url, response, responseCache);
+                    }
+                    return response;
+                }
+                console.log(`DWN endpoint error: ${response.status}`);
+                return new Response('DWeb Node request failed', {
+                    status: response.status,
+                });
+            }
+            catch (error) {
+                console.log(`DWN endpoint error: ${error}`);
+                return new Response('DWeb Node request failed: ' + error, {
+                    status: 500,
+                });
+            }
+        }
+    });
+}
+function cacheResponse(drl, url, response, cache) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const clonedResponse = response.clone();
+        const headers = new Headers(clonedResponse.headers);
+        headers.append('dwn-cache-time', Date.now().toString());
+        headers.append('dwn-composed-url', url);
+        const modifiedResponse = new Response(clonedResponse.body, { headers });
+        cache.put(drl, modifiedResponse);
+    });
+}
+/* Service Worker-based features */
+function installWorker(options = {}) {
+    var _a, _b, _c;
+    return __awaiter(this, void 0, void 0, function* () {
+        const workerSelf = self;
+        try {
+            // Check to see if we are in a Service Worker already, if so, proceed
+            // You can call the activatePolyfills() function in your own worker, or standalone as a root worker
+            if (typeof ServiceWorkerGlobalScope !== 'undefined' &&
+                workerSelf instanceof ServiceWorkerGlobalScope) {
+                workerSelf.skipWaiting();
+                workerSelf.addEventListener('activate', (event) => {
+                    // Claim clients to make the service worker take control immediately
+                    event.waitUntil(workerSelf.clients.claim());
+                });
+                workerSelf.addEventListener('fetch', (event) => {
+                    const match = event.request.url.match(didUrlRegex);
+                    if (match) {
+                        event.respondWith(handleEvent(event, match[1], match[2], options));
+                    }
+                });
+            }
+            // If the code gets here, it is not a SW env, it is likely DOM, but check to be sure
+            else if ((_a = globalThis === null || globalThis === void 0 ? void 0 : globalThis.navigator) === null || _a === void 0 ? void 0 : _a.serviceWorker) {
+                const registration = yield navigator.serviceWorker.getRegistration('/');
+                // You can only have one worker per path, so check to see if one is already registered
+                if (!registration) {
+                    // @ts-ignore
+                    const installUrl = options.path ||
+                        (globalThis.document
+                            ? (_b = document === null || document === void 0 ? void 0 : document.currentScript) === null || _b === void 0 ? void 0 : _b.src
+                            : (_c = importMetaIfSupported()) === null || _c === void 0 ? void 0 : _c.url);
+                    if (installUrl)
+                        navigator.serviceWorker
+                            .register(installUrl, { type: 'module' })
+                            .catch((error) => {
+                            console.error('DWeb networking feature installation failed: ', error);
+                        });
+                }
+            }
+            else {
+                throw new Error('DWeb networking features are not available for install in this environment');
+            }
+        }
+        catch (error) {
+            console.error('Error in installing networking features:', error);
+        }
+    });
+}
+/* DOM Environment Features */
+const loaderStyles = `
+  .drl-loading-overlay {
+    position: fixed;
+    inset: 0;
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    font-size: 22px;
+    color: #fff;
+    background: rgba(0, 0, 0, 0.75);
+    backdrop-filter: blur(15px);
+    -webkit-backdrop-filter: blur(15px);
+    z-index: 1000000;
+  }
+
+  .drl-loading-overlay > div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .drl-loading-spinner {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+    .drl-loading-spinner div {
+      position: relative;
+      width: 2em;
+      height: 2em;
+      margin: 0.1em 0.25em 0 0;
+    }
+    .drl-loading-spinner div::after,
+    .drl-loading-spinner div::before {
+      content: '';  
+      box-sizing: border-box;
+      width: 100%;
+      height: 100%;
+      border-radius: 50%;
+      border: 0.1em solid #FFF;
+      position: absolute;
+      left: 0;
+      top: 0;
+      opacity: 0;
+      animation: drl-loading-spinner 2s linear infinite;
+    }
+    .drl-loading-spinner div::after {
+      animation-delay: 1s;
+    }
+
+  .drl-loading-overlay span {
+    --text-opacity: 2;
+    display: flex;
+    align-items: center;
+    margin: 2em auto 0;
+    padding: 0.2em 0.75em 0.25em;
+    text-align: center;
+    border-radius: 5em;
+    background: rgba(255 255 255 / 8%);
+    opacity: 0.8;
+    transition: opacity 0.3s ease;
+    cursor: pointer;
+  }
+
+    .drl-loading-overlay span:focus {
+      opacity: 1;
+    }
+
+    .drl-loading-overlay span:hover {
+      opacity: 1;
+    }
+
+    .drl-loading-overlay span::before {
+      content: '✕ ';
+      margin: 0 0.4em 0 0;
+      color: red;
+      font-size: 65%;
+      font-weight: bold;
+    }
+
+    .drl-loading-overlay span::after {
+      content: 'stop';
+      display: block;
+      font-size: 60%;
+      line-height: 0;
+      color: rgba(255 255 255 / 60%);
+    }
+
+    .drl-loading-overlay.new-tab-overlay span::after {
+      content: 'close';
+    }
+  
+  @keyframes drl-loading-spinner {
+    0% {
+      transform: scale(0);
+      opacity: 1;
+    }
+    100% {
+      transform: scale(1);
+      opacity: 0;
+    }
+  }
+`;
+const tabContent = `
+<!DOCTYPE html>
+<html lang='en'>
+<head>
+  <meta charset='UTF-8'>
+  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
+  <title>Loading DRL...</title>
+  <style>
+    html, body {
+      background-color: #151518;
+      height: 100%;
+      margin: 0;
+      padding: 0;
+      font-family: Arial, sans-serif;
+      text-align: center;
+    }
+    ${loaderStyles}
+  </style>
+</head>
+<body>
+  <div class='drl-loading-overlay new-tab-overlay'>
+    <div class='drl-loading-spinner'>
+      <div></div>
+      Loading DRL
+    </div>
+    <span onclick='window.close()' tabindex='0'></span>
+  </div>
+</body>
+</html>
+`;
+let elementsInjected = false;
+function injectElements() {
+    if (elementsInjected)
+        return;
+    const style = document.createElement('style');
+    style.innerHTML = `
+    ${loaderStyles}
+
+    .drl-loading-overlay {
+      opacity: 0;
+      transition: opacity 0.3s ease;
+      pointer-events: none;
+    }
+
+    :root[drl-link-loading] .drl-loading-overlay {
+      opacity: 1;
+      pointer-events: all;
+    }
+  `;
+    document.head.append(style);
+    const overlay = document.createElement('div');
+    overlay.classList.add('drl-loading-overlay');
+    overlay.innerHTML = `
+    <div class='drl-loading-spinner'>
+      <div></div>
+      Loading DRL
+    </div> 
+    <span tabindex='0'></span>
+  `;
+    overlay.lastElementChild.addEventListener('click', cancelNavigation);
+    document.body.prepend(overlay);
+    elementsInjected = true;
+}
+function cancelNavigation() {
+    document.documentElement.removeAttribute('drl-link-loading');
+    activeNavigation = null;
+}
+let activeNavigation;
+let linkFeaturesActive = false;
+function addLinkFeatures() {
+    if (!linkFeaturesActive) {
+        document.addEventListener('click', (event) => __awaiter(this, void 0, void 0, function* () {
+            const anchor = event.target.closest('a');
+            if (anchor) {
+                const href = anchor.href;
+                const match = href.match(didUrlRegex);
+                if (match) {
+                    const did = match[1];
+                    const path = match[2];
+                    const openAsTab = anchor.target === '_blank';
+                    event.preventDefault();
+                    try {
+                        let tab;
+                        if (openAsTab) {
+                            tab = window.open('', '_blank');
+                            tab.document.write(tabContent);
+                        }
+                        else {
+                            activeNavigation = path;
+                            // this is to allow for cached DIDs to instantly load without any flash of loading UI
+                            setTimeout(() => document.documentElement.setAttribute('drl-link-loading', ''), 50);
+                        }
+                        const endpoints = yield getDwnEndpoints(did);
+                        if (!endpoints.length)
+                            throw null;
+                        const url = `${endpoints[0].replace(trailingSlashRegex, '')}/${did}/${path}`;
+                        if (openAsTab) {
+                            if (!tab.closed)
+                                tab.location.href = url;
+                        }
+                        else if (activeNavigation === path) {
+                            window.location.href = url;
+                        }
+                    }
+                    catch (e) {
+                        if (activeNavigation === path) {
+                            cancelNavigation();
+                        }
+                        throw new Error(`DID endpoint resolution failed for the DRL: ${href}`);
+                    }
+                }
+            }
+        }));
+        document.addEventListener('pointercancel', resetContextMenuTarget);
+        document.addEventListener('pointerdown', (event) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const target = event.composedPath()[0];
+            if ((event.pointerType === 'mouse' && event.button === 2) ||
+                (event.pointerType === 'touch' && event.isPrimary)) {
+                resetContextMenuTarget();
+                if (target && ((_a = target === null || target === void 0 ? void 0 : target.src) === null || _a === void 0 ? void 0 : _a.match(didUrlRegex))) {
+                    contextMenuTarget = target;
+                    target.__src__ = target.src;
+                    const drl = target.src
+                        .replace(httpToHttpsRegex, 'https:')
+                        .replace(trailingSlashRegex, '');
+                    const responseCache = yield caches.open('drl');
+                    const response = yield responseCache.match(drl);
+                    const url = response.headers.get('dwn-composed-url');
+                    if (url)
+                        target.src = url;
+                    target.addEventListener('pointerup', resetContextMenuTarget, {
+                        once: true,
+                    });
+                }
+            }
+            else if (target === contextMenuTarget) {
+                resetContextMenuTarget();
+            }
+        }));
+        linkFeaturesActive = true;
+    }
+}
+let contextMenuTarget;
+function resetContextMenuTarget(e) {
+    return __awaiter(this, void 0, void 0, function* () {
+        if ((e === null || e === void 0 ? void 0 : e.type) === 'pointerup') {
+            yield new Promise((r) => requestAnimationFrame(r));
+        }
+        if (contextMenuTarget) {
+            contextMenuTarget.src = contextMenuTarget.__src__;
+            delete contextMenuTarget.__src__;
+            contextMenuTarget = null;
+        }
+    });
+}
+/**
+ * Activates various polyfills to enable Web5 features in Web environments.
+ *
+ * @param {object} [options={}] - Configuration options to control the activation of polyfills.
+ * @param {boolean} [options.serviceWorker=true] - Option to avoid installation of the Service Worker. Defaults to true, installing the Service Worker.
+ * @param {boolean} [options.injectStyles=true] - Option to skip injection of styles for UI related UX polyfills. Defaults to true, injecting styles.
+ * @param {boolean} [options.links=true] - Option to skip activation of DRL link features. Defaults to true, activating link features.
+ * @param {function} [options.onCacheCheck] - Callback function to handle cache check events, allowing fine-grained control over what DRL request to cache, and for how long.
+ * @param {object} [options.onCacheCheck.event] - The event object passed to the callback.
+ * @param {object} [options.onCacheCheck.route] - The route object passed to the callback.
+ * @returns {object} [options.onCacheCheck.return] - The return object from the callback.
+ * @returns {number} [options.onCacheCheck.return.ttl] - Time-to-live for the cached DRL response, in milliseconds.
+ *
+ * @returns {void}
+ *
+ * @example
+ * // Activate all polyfills with default options, and cache every DRL for 1 minute
+ * activatePolyfills({
+ *   onCacheCheck(event, route){
+ *     return {
+ *       ttl: 60_000
+ *     }
+ *   }
+ * });
+ *
+ * @example
+ * // Activate polyfills, but without Service Worker activation
+ * activatePolyfills({ serviceWorker: false });
+ */
+export function activatePolyfills(options = {}) {
+    if (options.serviceWorker !== false) {
+        installWorker(options);
+    }
+    if (typeof window !== 'undefined' && typeof window.document !== 'undefined') {
+        if (options.injectStyles !== false) {
+            if (document.readyState !== 'loading')
+                injectElements();
+            else {
+                document.addEventListener('DOMContentLoaded', injectElements, {
+                    once: true,
+                });
+            }
+        }
+        if (options.links !== false)
+            addLinkFeatures();
+    }
+}
+//# sourceMappingURL=web-features.js.map

package/dist/esm/web-features.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"web-features.js","sourceRoot":"","sources":["../../src/web-features.ts"],"names":[],"mappings":"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"}

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './web-features.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/dist/types/web-features.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Activates various polyfills to enable Web5 features in Web environments.
+ *
+ * @param {object} [options={}] - Configuration options to control the activation of polyfills.
+ * @param {boolean} [options.serviceWorker=true] - Option to avoid installation of the Service Worker. Defaults to true, installing the Service Worker.
+ * @param {boolean} [options.injectStyles=true] - Option to skip injection of styles for UI related UX polyfills. Defaults to true, injecting styles.
+ * @param {boolean} [options.links=true] - Option to skip activation of DRL link features. Defaults to true, activating link features.
+ * @param {function} [options.onCacheCheck] - Callback function to handle cache check events, allowing fine-grained control over what DRL request to cache, and for how long.
+ * @param {object} [options.onCacheCheck.event] - The event object passed to the callback.
+ * @param {object} [options.onCacheCheck.route] - The route object passed to the callback.
+ * @returns {object} [options.onCacheCheck.return] - The return object from the callback.
+ * @returns {number} [options.onCacheCheck.return.ttl] - Time-to-live for the cached DRL response, in milliseconds.
+ *
+ * @returns {void}
+ *
+ * @example
+ * // Activate all polyfills with default options, and cache every DRL for 1 minute
+ * activatePolyfills({
+ *   onCacheCheck(event, route){
+ *     return {
+ *       ttl: 60_000
+ *     }
+ *   }
+ * });
+ *
+ * @example
+ * // Activate polyfills, but without Service Worker activation
+ * activatePolyfills({ serviceWorker: false });
+ */
+export declare function activatePolyfills(options?: any): void;
+//# sourceMappingURL=web-features.d.ts.map

package/dist/types/web-features.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"web-features.d.ts","sourceRoot":"","sources":["../../src/web-features.ts"],"names":[],"mappings":"AA4bA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,GAAE,GAAQ,QAelD"}

package/package.json

@@ -0,0 +1,83 @@
+{
+  "name": "@enbox/browser",
+  "version": "0.0.1",
+  "description": "Web5 tools and features to use in the browser",
+  "type": "module",
+  "main": "./dist/esm/index.js",
+  "module": "./dist/esm/index.js",
+  "types": "./dist/types/index.d.ts",
+  "scripts": {
+    "clean": "rimraf dist coverage tests/compiled",
+    "build:tests": "rimraf tests/compiled && node build/esbuild-tests.cjs",
+    "build:esm": "rimraf dist/esm dist/types && pnpm tsc -p tsconfig.json",
+    "build:browser": "pnpm build:esm",
+    "build": "pnpm clean && pnpm build:esm",
+    "lint": "eslint . --max-warnings 0",
+    "lint:fix": "eslint . --fix",
+    "test:browser": "pnpm build:tests && web-test-runner"
+  },
+  "homepage": "https://github.com/enboxorg/enbox/tree/main/packages/browser#readme",
+  "bugs": "https://github.com/enboxorg/enbox/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/enboxorg/enbox.git",
+    "directory": "packages/browser"
+  },
+  "license": "Apache-2.0",
+  "contributors": [
+    {
+      "name": "Daniel Buchner",
+      "url": "https://github.com/csuwildcat"
+    },
+    {
+      "name": "Liran Cohen",
+      "url": "https://github.com/lirancohen"
+    }
+  ],
+  "files": [
+    "dist",
+    "src"
+  ],
+  "keywords": [
+    "decentralized",
+    "decentralized-applications",
+    "decentralized-identity",
+    "decentralized-web",
+    "DID",
+    "sdk",
+    "verifiable-credentials",
+    "web5",
+    "web5-sdk",
+    "browser",
+    "tools"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@enbox/dids": "workspace:*"
+  },
+  "devDependencies": {
+    "@playwright/test": "1.45.3",
+    "@types/chai": "4.3.6",
+    "@types/eslint": "8.56.10",
+    "@types/mocha": "10.0.1",
+    "@types/sinon": "17.0.3",
+    "@typescript-eslint/eslint-plugin": "7.9.0",
+    "@typescript-eslint/parser": "7.14.1",
+    "@web/test-runner": "0.18.2",
+    "@web/test-runner-playwright": "0.11.0",
+    "c8": "9.1.0",
+    "chai": "4.3.10",
+    "esbuild": "0.19.8",
+    "eslint": "9.3.0",
+    "eslint-plugin-mocha": "10.4.3",
+    "mocha": "10.2.0",
+    "mocha-junit-reporter": "2.2.1",
+    "playwright": "1.45.3",
+    "rimraf": "4.4.0",
+    "sinon": "18.0.0",
+    "source-map-loader": "4.0.2",
+    "typescript": "5.1.6"
+  }
+}

package/src/index.ts

@@ -0,0 +1 @@
+export * from './web-features.js';

package/src/web-features.ts

@@ -0,0 +1,489 @@
+//@ts-nocheck
+
+/*
+  This file is run in dual environments to make installation of the Service Worker code easier.
+  Be mindful that code placed in any open excution space may be evaluated multiple times in different contexts,
+  so take care to gate additions to only activate code in the right env, such as a Service Worker scope or page window.
+*/
+
+import { UniversalResolver, DidDht, DidWeb } from '@enbox/dids';
+
+// This is in place to prevent our `bundler-bonanza` repo from failing for Node CJS builds
+// Not sure if this is working as expected in all environments, crated an issue
+// TODO: https://github.com/TBD54566975/web5-js/issues/767
+function importMetaIfSupported() {
+  try {
+    return new Function('return import.meta')();
+  } catch (_error) {
+    return undefined;
+  }
+}
+
+declare const ServiceWorkerGlobalScope: any;
+
+const DidResolver = new UniversalResolver({ didResolvers: [DidDht, DidWeb] });
+const didUrlRegex = /^https?:\/\/dweb\/([^/]+)\/?(.*)?$/;
+const httpToHttpsRegex = /^http:/;
+const trailingSlashRegex = /\/$/;
+
+async function getDwnEndpoints(did) {
+  const { didDocument } = await DidResolver.resolve(did);
+  const endpoints = didDocument?.service?.find(
+    (service) => service.type === 'DecentralizedWebNode'
+  )?.serviceEndpoint;
+  return (Array.isArray(endpoints) ? endpoints : [endpoints]).filter((url) =>
+    url.startsWith('http')
+  );
+}
+
+async function handleEvent(event, did, path, options) {
+  const drl = event.request.url
+    .replace(httpToHttpsRegex, 'https:')
+    .replace(trailingSlashRegex, '');
+  const responseCache = await caches.open('drl');
+  const cachedResponse = await responseCache.match(drl);
+  if (cachedResponse) {
+    if (!navigator.onLine) return cachedResponse;
+    const match = await options?.onCacheCheck(event, drl);
+    if (match) {
+      const cacheTime = cachedResponse.headers.get('dwn-cache-time');
+      if (
+        cacheTime &&
+        Date.now() < Number(cacheTime) + (Number(match.ttl) || 0)
+      ) {
+        return cachedResponse;
+      }
+    }
+  }
+  try {
+    if (!path) {
+      const response = await DidResolver.resolve(did);
+      return new Response(JSON.stringify(response), {
+        status  : 200,
+        headers : {
+          'Content-Type': 'application/json',
+        },
+      });
+    } else
+      return await fetchResource(event, did, drl, path, responseCache, options);
+  } catch (error) {
+    if (error instanceof Response) {
+      return error;
+    }
+    console.log(`Error in DID URL fetch: ${error}`);
+    return new Response('DID URL fetch error', { status: 500 });
+  }
+}
+
+async function fetchResource(event, did, drl, path, responseCache, options) {
+  const endpoints = await getDwnEndpoints(did);
+  if (!endpoints?.length) {
+    throw new Response(
+      'DWeb Node resolution failed: no valid endpoints found.',
+      { status: 530 }
+    );
+  }
+  for (const endpoint of endpoints) {
+    try {
+      const url = `${endpoint.replace(trailingSlashRegex, '')}/${did}/${path}`;
+      const response = await fetch(url, { headers: event.request.headers });
+      if (response.ok) {
+        const match = await options?.onCacheCheck(event, drl);
+        if (match) {
+          cacheResponse(drl, url, response, responseCache);
+        }
+        return response;
+      }
+      console.log(`DWN endpoint error: ${response.status}`);
+      return new Response('DWeb Node request failed', {
+        status: response.status,
+      });
+    } catch (error) {
+      console.log(`DWN endpoint error: ${error}`);
+      return new Response('DWeb Node request failed: ' + error, {
+        status: 500,
+      });
+    }
+  }
+}
+
+async function cacheResponse(drl, url, response, cache) {
+  const clonedResponse = response.clone();
+  const headers = new Headers(clonedResponse.headers);
+  headers.append('dwn-cache-time', Date.now().toString());
+  headers.append('dwn-composed-url', url);
+  const modifiedResponse = new Response(clonedResponse.body, { headers });
+  cache.put(drl, modifiedResponse);
+}
+
+/* Service Worker-based features */
+
+async function installWorker(options: any = {}): Promise<void> {
+  const workerSelf = self as any;
+  try {
+    // Check to see if we are in a Service Worker already, if so, proceed
+    // You can call the activatePolyfills() function in your own worker, or standalone as a root worker
+    if (
+      typeof ServiceWorkerGlobalScope !== 'undefined' &&
+      workerSelf instanceof ServiceWorkerGlobalScope
+    ) {
+      workerSelf.skipWaiting();
+      workerSelf.addEventListener('activate', (event) => {
+        // Claim clients to make the service worker take control immediately
+        event.waitUntil(workerSelf.clients.claim());
+      });
+      workerSelf.addEventListener('fetch', (event) => {
+        const match = event.request.url.match(didUrlRegex);
+        if (match) {
+          event.respondWith(handleEvent(event, match[1], match[2], options));
+        }
+      });
+    }
+    // If the code gets here, it is not a SW env, it is likely DOM, but check to be sure
+    else if (globalThis?.navigator?.serviceWorker) {
+      const registration = await navigator.serviceWorker.getRegistration('/');
+      // You can only have one worker per path, so check to see if one is already registered
+      if (!registration) {
+        // @ts-ignore
+        const installUrl =
+        options.path ||
+        (globalThis.document
+          ? document?.currentScript?.src
+          : importMetaIfSupported()?.url);
+        if (installUrl)
+          navigator.serviceWorker
+            .register(installUrl, { type: 'module' })
+            .catch((error) => {
+              console.error(
+                'DWeb networking feature installation failed: ',
+                error
+              );
+            });
+      }
+    } else {
+      throw new Error(
+        'DWeb networking features are not available for install in this environment'
+      );
+    }
+  } catch (error) {
+    console.error('Error in installing networking features:', error);
+  }
+}
+
+/* DOM Environment Features */
+
+const loaderStyles = `
+  .drl-loading-overlay {
+    position: fixed;
+    inset: 0;
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    font-size: 22px;
+    color: #fff;
+    background: rgba(0, 0, 0, 0.75);
+    backdrop-filter: blur(15px);
+    -webkit-backdrop-filter: blur(15px);
+    z-index: 1000000;
+  }
+
+  .drl-loading-overlay > div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .drl-loading-spinner {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+    .drl-loading-spinner div {
+      position: relative;
+      width: 2em;
+      height: 2em;
+      margin: 0.1em 0.25em 0 0;
+    }
+    .drl-loading-spinner div::after,
+    .drl-loading-spinner div::before {
+      content: '';  
+      box-sizing: border-box;
+      width: 100%;
+      height: 100%;
+      border-radius: 50%;
+      border: 0.1em solid #FFF;
+      position: absolute;
+      left: 0;
+      top: 0;
+      opacity: 0;
+      animation: drl-loading-spinner 2s linear infinite;
+    }
+    .drl-loading-spinner div::after {
+      animation-delay: 1s;
+    }
+
+  .drl-loading-overlay span {
+    --text-opacity: 2;
+    display: flex;
+    align-items: center;
+    margin: 2em auto 0;
+    padding: 0.2em 0.75em 0.25em;
+    text-align: center;
+    border-radius: 5em;
+    background: rgba(255 255 255 / 8%);
+    opacity: 0.8;
+    transition: opacity 0.3s ease;
+    cursor: pointer;
+  }
+
+    .drl-loading-overlay span:focus {
+      opacity: 1;
+    }
+
+    .drl-loading-overlay span:hover {
+      opacity: 1;
+    }
+
+    .drl-loading-overlay span::before {
+      content: '✕ ';
+      margin: 0 0.4em 0 0;
+      color: red;
+      font-size: 65%;
+      font-weight: bold;
+    }
+
+    .drl-loading-overlay span::after {
+      content: 'stop';
+      display: block;
+      font-size: 60%;
+      line-height: 0;
+      color: rgba(255 255 255 / 60%);
+    }
+
+    .drl-loading-overlay.new-tab-overlay span::after {
+      content: 'close';
+    }
+  
+  @keyframes drl-loading-spinner {
+    0% {
+      transform: scale(0);
+      opacity: 1;
+    }
+    100% {
+      transform: scale(1);
+      opacity: 0;
+    }
+  }
+`;
+const tabContent = `
+<!DOCTYPE html>
+<html lang='en'>
+<head>
+  <meta charset='UTF-8'>
+  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
+  <title>Loading DRL...</title>
+  <style>
+    html, body {
+      background-color: #151518;
+      height: 100%;
+      margin: 0;
+      padding: 0;
+      font-family: Arial, sans-serif;
+      text-align: center;
+    }
+    ${loaderStyles}
+  </style>
+</head>
+<body>
+  <div class='drl-loading-overlay new-tab-overlay'>
+    <div class='drl-loading-spinner'>
+      <div></div>
+      Loading DRL
+    </div>
+    <span onclick='window.close()' tabindex='0'></span>
+  </div>
+</body>
+</html>
+`;
+
+let elementsInjected = false;
+function injectElements() {
+  if (elementsInjected) return;
+  const style = document.createElement('style');
+  style.innerHTML = `
+    ${loaderStyles}
+
+    .drl-loading-overlay {
+      opacity: 0;
+      transition: opacity 0.3s ease;
+      pointer-events: none;
+    }
+
+    :root[drl-link-loading] .drl-loading-overlay {
+      opacity: 1;
+      pointer-events: all;
+    }
+  `;
+  document.head.append(style);
+
+  const overlay = document.createElement('div');
+  overlay.classList.add('drl-loading-overlay');
+  overlay.innerHTML = `
+    <div class='drl-loading-spinner'>
+      <div></div>
+      Loading DRL
+    </div> 
+    <span tabindex='0'></span>
+  `;
+  overlay.lastElementChild.addEventListener('click', cancelNavigation);
+  document.body.prepend(overlay);
+  elementsInjected = true;
+}
+
+function cancelNavigation() {
+  document.documentElement.removeAttribute('drl-link-loading');
+  activeNavigation = null;
+}
+
+let activeNavigation;
+let linkFeaturesActive = false;
+function addLinkFeatures() {
+  if (!linkFeaturesActive) {
+    document.addEventListener('click', async (event: any) => {
+      const anchor = event.target.closest('a');
+      if (anchor) {
+        const href = anchor.href;
+        const match = href.match(didUrlRegex);
+        if (match) {
+          const did = match[1];
+          const path = match[2];
+          const openAsTab = anchor.target === '_blank';
+          event.preventDefault();
+          try {
+            let tab;
+            if (openAsTab) {
+              tab = window.open('', '_blank');
+              tab.document.write(tabContent);
+            } else {
+              activeNavigation = path;
+              // this is to allow for cached DIDs to instantly load without any flash of loading UI
+              setTimeout(
+                () =>
+                  document.documentElement.setAttribute('drl-link-loading', ''),
+                50
+              );
+            }
+            const endpoints = await getDwnEndpoints(did);
+            if (!endpoints.length) throw null;
+            const url = `${endpoints[0].replace(
+              trailingSlashRegex,
+              ''
+            )}/${did}/${path}`;
+            if (openAsTab) {
+              if (!tab.closed) tab.location.href = url;
+            } else if (activeNavigation === path) {
+              window.location.href = url;
+            }
+          } catch (e) {
+            if (activeNavigation === path) {
+              cancelNavigation();
+            }
+            throw new Error(
+              `DID endpoint resolution failed for the DRL: ${href}`
+            );
+          }
+        }
+      }
+    });
+
+    document.addEventListener('pointercancel', resetContextMenuTarget);
+    document.addEventListener('pointerdown', async (event: any) => {
+      const target = event.composedPath()[0];
+      if (
+        (event.pointerType === 'mouse' && event.button === 2) ||
+        (event.pointerType === 'touch' && event.isPrimary)
+      ) {
+        resetContextMenuTarget();
+        if (target && target?.src?.match(didUrlRegex)) {
+          contextMenuTarget = target;
+          target.__src__ = target.src;
+          const drl = target.src
+            .replace(httpToHttpsRegex, 'https:')
+            .replace(trailingSlashRegex, '');
+          const responseCache = await caches.open('drl');
+          const response = await responseCache.match(drl);
+          const url = response.headers.get('dwn-composed-url');
+          if (url) target.src = url;
+          target.addEventListener('pointerup', resetContextMenuTarget, {
+            once: true,
+          });
+        }
+      } else if (target === contextMenuTarget) {
+        resetContextMenuTarget();
+      }
+    });
+
+    linkFeaturesActive = true;
+  }
+}
+
+let contextMenuTarget;
+async function resetContextMenuTarget(e?: any) {
+  if (e?.type === 'pointerup') {
+    await new Promise((r) => requestAnimationFrame(r));
+  }
+  if (contextMenuTarget) {
+    contextMenuTarget.src = contextMenuTarget.__src__;
+    delete contextMenuTarget.__src__;
+    contextMenuTarget = null;
+  }
+}
+
+/**
+ * Activates various polyfills to enable Web5 features in Web environments.
+ *
+ * @param {object} [options={}] - Configuration options to control the activation of polyfills.
+ * @param {boolean} [options.serviceWorker=true] - Option to avoid installation of the Service Worker. Defaults to true, installing the Service Worker.
+ * @param {boolean} [options.injectStyles=true] - Option to skip injection of styles for UI related UX polyfills. Defaults to true, injecting styles.
+ * @param {boolean} [options.links=true] - Option to skip activation of DRL link features. Defaults to true, activating link features.
+ * @param {function} [options.onCacheCheck] - Callback function to handle cache check events, allowing fine-grained control over what DRL request to cache, and for how long.
+ * @param {object} [options.onCacheCheck.event] - The event object passed to the callback.
+ * @param {object} [options.onCacheCheck.route] - The route object passed to the callback.
+ * @returns {object} [options.onCacheCheck.return] - The return object from the callback.
+ * @returns {number} [options.onCacheCheck.return.ttl] - Time-to-live for the cached DRL response, in milliseconds.
+ *
+ * @returns {void}
+ *
+ * @example
+ * // Activate all polyfills with default options, and cache every DRL for 1 minute
+ * activatePolyfills({
+ *   onCacheCheck(event, route){
+ *     return {
+ *       ttl: 60_000
+ *     }
+ *   }
+ * });
+ *
+ * @example
+ * // Activate polyfills, but without Service Worker activation
+ * activatePolyfills({ serviceWorker: false });
+ */
+export function activatePolyfills(options: any = {}) {
+  if (options.serviceWorker !== false) {
+    installWorker(options);
+  }
+  if (typeof window !== 'undefined' && typeof window.document !== 'undefined') {
+    if (options.injectStyles !== false) {
+      if (document.readyState !== 'loading') injectElements();
+      else {
+        document.addEventListener('DOMContentLoaded', injectElements, {
+          once: true,
+        });
+      }
+    }
+    if (options.links !== false) addLinkFeatures();
+  }
+}