snice 3.6.0 → 3.8.0

package/dist/index.iife.js

@@ -1,5 +1,5 @@
 /*!
- * snice v3.5.0
+ * snice v3.7.0
  * Imperative TypeScript framework for building vanilla web components with decorators, differential rendering, routing, and controllers. No virtual DOM, no build complexity.
  * (c) 2024
  * Released under the MIT License.
@@ -2367,7 +2367,7 @@ var Snice = (function (exports) {
      * Represents the bundled router state that can notify registered elements of changes
      */
     class Context {
-        constructor(context = {}, placards = [], currentRoute = '', routeParams = {}) {
+        constructor(context = {}, placards = [], currentRoute = '', routeParams = {}, fetcher) {
             this[_a] = new WeakMap();
             this[_b] = new Set();
             this[_c] = false;
@@ -2378,6 +2378,16 @@ var Snice = (function (exports) {
                 route: currentRoute,
                 params: routeParams
             };
+            // Initialize fetch with middleware support or fallback to native fetch
+            if (fetcher && typeof fetcher.create === 'function') {
+                this.fetch = fetcher.create(this);
+            }
+            else if (typeof fetch === 'function') {
+                this.fetch = fetch.bind(this);
+            }
+            else {
+                throw new Error('No fetch implementation available');
+            }
         }
         /**
          * Register an element to receive context updates
@@ -4472,7 +4482,7 @@ var Snice = (function (exports) {
         let currentLayoutTimestamp = null; // Track current layout timestamp
         const context = options.context || {}; // Store context for guards
         // Create Context instance for managing router state
-        const navigationContext = new Context(context, [], '', {});
+        const navigationContext = new Context(context, [], '', {}, options.fetcher);
         function getCurrentLayoutElement(target) {
             const noCurrentLayout = !currentLayoutName || !currentLayoutTimestamp;
             if (noCurrentLayout) {
@@ -5401,7 +5411,86 @@ var Snice = (function (exports) {
         }
     }
 
+    /**
+     * Context-aware fetch implementation with middleware support
+     *
+     * @example
+     * ```typescript
+     * const fetcher = new ContextAwareFetcher();
+     *
+     * fetcher.use('request', function(request, next) {
+     *   const token = this.application.user?.token;
+     *   if (token) {
+     *     request.headers.set('Authorization', `Bearer ${token}`);
+     *   }
+     *   return next();
+     * });
+     *
+     * fetcher.use('response', async function(response, next) {
+     *   if (!response.ok) {
+     *     throw new Error(`HTTP ${response.status}`);
+     *   }
+     *   return next();
+     * });
+     *
+     * const router = Router({
+     *   target: '#app',
+     *   context: { user: null },
+     *   fetcher
+     * });
+     * ```
+     */
+    class ContextAwareFetcher {
+        constructor() {
+            this.requestMiddlewares = [];
+            this.responseMiddlewares = [];
+        }
+        use(type, middleware) {
+            if (type === 'request') {
+                this.requestMiddlewares.push(middleware);
+            }
+            else {
+                this.responseMiddlewares.push(middleware);
+            }
+        }
+        /**
+         * Create a fetch function bound to the given Context instance
+         * @param ctx - The Context instance to bind to
+         * @returns A fetch function with middleware applied
+         */
+        create(ctx) {
+            const requestMiddlewares = this.requestMiddlewares;
+            const responseMiddlewares = this.responseMiddlewares;
+            const fetchFn = async function (input, init) {
+                const request = new Request(input, init);
+                // Request middleware chain
+                let reqIndex = 0;
+                const nextRequest = async () => {
+                    if (reqIndex < requestMiddlewares.length) {
+                        const middleware = requestMiddlewares[reqIndex++];
+                        return middleware.call(this, request, nextRequest);
+                    }
+                    // Execute actual fetch
+                    const response = await fetch(request);
+                    // Response middleware chain
+                    let resIndex = 0;
+                    const nextResponse = async () => {
+                        if (resIndex < responseMiddlewares.length) {
+                            const middleware = responseMiddlewares[resIndex++];
+                            return middleware.call(this, response, nextResponse);
+                        }
+                        return response;
+                    };
+                    return nextResponse();
+                };
+                return nextRequest();
+            };
+            return fetchFn.bind(ctx);
+        }
+    }
+
     exports.Context = Context;
+    exports.ContextAwareFetcher = ContextAwareFetcher;
     exports.IS_CONTROLLER_INSTANCE = IS_CONTROLLER_INSTANCE;
     exports.Router = Router;
     exports.SimpleArray = SimpleArray;