@hyperfixi/core 2.3.0 → 2.4.0

package/dist/ast-utils/interchange/types.d.ts

@@ -1,4 +1,4 @@
-export type InterchangeNode = EventNode | CommandNode | LiteralNode | IdentifierNode | SelectorNode | VariableNode | BinaryNode | UnaryNode | MemberNode | PossessiveNode | CallNode | IfNode | RepeatNode | ForEachNode | WhileNode | PositionalNode;
+export type InterchangeNode = EventNode | CommandNode | LiteralNode | IdentifierNode | SelectorNode | VariableNode | BinaryNode | UnaryNode | MemberNode | PossessiveNode | CallNode | IfNode | RepeatNode | ForEachNode | WhileNode | PositionalNode | ErrorNode;
 export interface BaseNode {
     readonly type: string;
     readonly start?: number;
@@ -56,6 +56,11 @@ export interface PositionalNode extends BaseNode {
     readonly position: 'first' | 'last' | 'next' | 'previous' | 'closest' | 'parent' | 'random';
     readonly target?: InterchangeNode;
 }
+export interface ErrorNode extends BaseNode {
+    readonly type: 'error';
+    readonly message: string;
+    readonly token?: string;
+}
 export interface CommandNode extends BaseNode {
     readonly type: 'command';
     readonly name: string;
@@ -63,6 +68,7 @@ export interface CommandNode extends BaseNode {
     readonly target?: InterchangeNode;
     readonly modifiers?: Record<string, unknown>;
     readonly roles?: Readonly<Record<string, InterchangeNode>>;
+    readonly partial?: boolean;
 }
 export interface EventNode extends BaseNode {
     readonly type: 'event';

package/dist/behaviors/index.js

@@ -550,31 +550,14 @@ function longestIncreasingSubsequence(sequence) {
 
 //# debugId=3F4BCB911DEC843864756E2164756E21
 
-const morphlexMorph = morph;
-const morphlexMorphInner = morphInner;
 function toMorphlexOptions(options) {
-    if (!options) {
-        return { preserveChanges: true };
-    }
-    return {
-        preserveChanges: options.preserveChanges ?? true,
-        beforeNodeVisited: options.beforeNodeVisited,
-        afterNodeVisited: options.afterNodeVisited,
-        beforeNodeAdded: options.beforeNodeAdded
-            ? (node) => options.beforeNodeAdded(node.parentNode, node, null)
-            : undefined,
-        afterNodeAdded: options.afterNodeAdded,
-        beforeNodeRemoved: options.beforeNodeRemoved,
-        afterNodeRemoved: options.afterNodeRemoved,
-    };
+    return { preserveChanges: options?.preserveChanges ?? true };
 }
-const morphlexEngine = {
+const morphAdapter = {
     morph(target, content, options) {
-        const morphlexOpts = toMorphlexOptions(options);
-        morphlexMorph(target, content, morphlexOpts);
+        morph(target, content, toMorphlexOptions(options));
     },
     morphInner(target, content, options) {
-        const morphlexOpts = toMorphlexOptions(options);
         let contentEl;
         if (typeof content === 'string') {
             const wrapper = document.createElement(target.tagName);
@@ -584,71 +567,56 @@ const morphlexEngine = {
         else {
             contentEl = content;
         }
-        morphlexMorphInner(target, contentEl, morphlexOpts);
-    },
-};
-let currentEngine = morphlexEngine;
-const morphAdapter = {
-    morph(target, content, options) {
-        currentEngine.morph(target, content, options);
-    },
-    morphInner(target, content, options) {
-        currentEngine.morphInner(target, content, options);
+        morphInner(target, contentEl, toMorphlexOptions(options));
     },
 };
 
-function isViewTransitionsSupported() {
-    return (typeof document !== 'undefined' && typeof document.startViewTransition === 'function');
+function getStartViewTransition() {
+    if (typeof document === 'undefined')
+        return undefined;
+    return document
+        .startViewTransition;
 }
-let config = {
-    enabled: isViewTransitionsSupported(),
-    defaultTimeout: 5000};
-let transitionQueue = [];
-let isProcessingQueue = false;
-async function processQueue() {
-    if (isProcessingQueue || transitionQueue.length === 0) {
-        return;
-    }
-    isProcessingQueue = true;
-    while (transitionQueue.length > 0) {
-        const item = transitionQueue.shift();
-        try {
-            await executeTransition(item.callback, item.options);
-            item.resolve();
-        }
-        catch (error) {
-            item.reject(error);
-        }
-    }
-    isProcessingQueue = false;
+function isViewTransitionsSupported() {
+    return typeof getStartViewTransition() === 'function';
 }
-async function executeTransition(callback, options) {
-    const { skipTransition = false, timeout = config.defaultTimeout } = options;
-    if (!config.enabled || !isViewTransitionsSupported() || skipTransition) {
+const queue = [];
+let processing = false;
+async function runOne(callback) {
+    const start = getStartViewTransition();
+    if (!start) {
         await callback();
         return;
     }
-    const transition = document.startViewTransition(async () => {
+    const transition = start(async () => {
         await callback();
     });
-    const timeoutPromise = new Promise((_, reject) => {
-        setTimeout(() => reject(new Error('View transition timed out')), timeout);
-    });
+    await transition.finished;
+}
+async function drain() {
+    if (processing)
+        return;
+    processing = true;
     try {
-        await Promise.race([transition.finished, timeoutPromise]);
+        while (queue.length > 0) {
+            const item = queue.shift();
+            try {
+                await runOne(item.callback);
+                item.resolve();
+            }
+            catch (error) {
+                item.reject(error);
+            }
+        }
     }
-    catch (error) {
+    finally {
+        processing = false;
     }
 }
-function withViewTransition(callback, options = {}) {
+function withViewTransition(callback) {
     return new Promise((resolve, reject) => {
-        transitionQueue.push({
-            callback,
-            options,
-            resolve,
-            reject,
-        });
-        processQueue().catch(reject);
+        queue.push({ callback, resolve, reject });
+        drain().catch(reject);
     });
 }
 
@@ -662,18 +630,6 @@ function isHTMLElement(value) {
         'classList' in value);
 }
 
-function isDevMode() {
-    if (typeof window !== 'undefined' && window.__HYPERFIXI_PROD__) {
-        return false;
-    }
-    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'production') {
-        return false;
-    }
-    return true;
-}
-({
-    enabled: isDevMode()});
-
 function executeSwap(target, content, strategy, morphOptions) {
     const contentStr = content !== null && !isHTMLElement(content) ? content : '';
     const contentEl = isHTMLElement(content) ? content : null;
@@ -769,6 +725,20 @@ function executeSwap(target, content, strategy, morphOptions) {
             throw new Error(`[HyperFixi] swap: unknown strategy "${strategy}"`);
     }
 }
+async function executeSwapWithTransition(targets, content, strategy, options = {}) {
+    const { morphOptions, useViewTransition = false } = options;
+    const performSwap = () => {
+        for (const target of targets) {
+            executeSwap(target, content, strategy, morphOptions);
+        }
+    };
+    if (useViewTransition && isViewTransitionsSupported()) {
+        await withViewTransition(performSwap);
+    }
+    else {
+        performSwap();
+    }
+}
 
 function createCustomEvent(eventName, detail, options = {}) {
     return new CustomEvent(eventName, {
@@ -829,15 +799,7 @@ function createHistorySwap(config) {
                 throw new Error(`HTTP ${response.status}: ${response.statusText}`);
             }
             const html = await response.text();
-            const performSwap = () => {
-                executeSwap(targetElement, html, strategy);
-            };
-            if (useViewTransition && isViewTransitionsSupported()) {
-                await withViewTransition(performSwap);
-            }
-            else {
-                performSwap();
-            }
+            await executeSwapWithTransition([targetElement], html, strategy, { useViewTransition });
             targetElement.classList.remove('hx-swapping');
             if (onAfterSwap) {
                 await onAfterSwap(url, html);
@@ -990,15 +952,7 @@ function createBoosted(config) {
                 throw new Error(`HTTP ${response.status}: ${response.statusText}`);
             }
             const html = await response.text();
-            const performSwap = () => {
-                executeSwap(targetElement, html, strategy);
-            };
-            if (useViewTransition && isViewTransitionsSupported()) {
-                await withViewTransition(performSwap);
-            }
-            else {
-                performSwap();
-            }
+            await executeSwapWithTransition([targetElement], html, strategy, { useViewTransition });
             targetElement.classList.remove('hx-swapping');
             container.classList.remove('hx-boosting');
             if (pushUrl && method === 'GET') {

package/dist/behaviors/index.mjs

@@ -548,31 +548,14 @@ function longestIncreasingSubsequence(sequence) {
 
 //# debugId=3F4BCB911DEC843864756E2164756E21
 
-const morphlexMorph = morph;
-const morphlexMorphInner = morphInner;
 function toMorphlexOptions(options) {
-    if (!options) {
-        return { preserveChanges: true };
-    }
-    return {
-        preserveChanges: options.preserveChanges ?? true,
-        beforeNodeVisited: options.beforeNodeVisited,
-        afterNodeVisited: options.afterNodeVisited,
-        beforeNodeAdded: options.beforeNodeAdded
-            ? (node) => options.beforeNodeAdded(node.parentNode, node, null)
-            : undefined,
-        afterNodeAdded: options.afterNodeAdded,
-        beforeNodeRemoved: options.beforeNodeRemoved,
-        afterNodeRemoved: options.afterNodeRemoved,
-    };
+    return { preserveChanges: options?.preserveChanges ?? true };
 }
-const morphlexEngine = {
+const morphAdapter = {
     morph(target, content, options) {
-        const morphlexOpts = toMorphlexOptions(options);
-        morphlexMorph(target, content, morphlexOpts);
+        morph(target, content, toMorphlexOptions(options));
     },
     morphInner(target, content, options) {
-        const morphlexOpts = toMorphlexOptions(options);
         let contentEl;
         if (typeof content === 'string') {
             const wrapper = document.createElement(target.tagName);
@@ -582,71 +565,56 @@ const morphlexEngine = {
         else {
             contentEl = content;
         }
-        morphlexMorphInner(target, contentEl, morphlexOpts);
-    },
-};
-let currentEngine = morphlexEngine;
-const morphAdapter = {
-    morph(target, content, options) {
-        currentEngine.morph(target, content, options);
-    },
-    morphInner(target, content, options) {
-        currentEngine.morphInner(target, content, options);
+        morphInner(target, contentEl, toMorphlexOptions(options));
     },
 };
 
-function isViewTransitionsSupported() {
-    return (typeof document !== 'undefined' && typeof document.startViewTransition === 'function');
+function getStartViewTransition() {
+    if (typeof document === 'undefined')
+        return undefined;
+    return document
+        .startViewTransition;
 }
-let config = {
-    enabled: isViewTransitionsSupported(),
-    defaultTimeout: 5000};
-let transitionQueue = [];
-let isProcessingQueue = false;
-async function processQueue() {
-    if (isProcessingQueue || transitionQueue.length === 0) {
-        return;
-    }
-    isProcessingQueue = true;
-    while (transitionQueue.length > 0) {
-        const item = transitionQueue.shift();
-        try {
-            await executeTransition(item.callback, item.options);
-            item.resolve();
-        }
-        catch (error) {
-            item.reject(error);
-        }
-    }
-    isProcessingQueue = false;
+function isViewTransitionsSupported() {
+    return typeof getStartViewTransition() === 'function';
 }
-async function executeTransition(callback, options) {
-    const { skipTransition = false, timeout = config.defaultTimeout } = options;
-    if (!config.enabled || !isViewTransitionsSupported() || skipTransition) {
+const queue = [];
+let processing = false;
+async function runOne(callback) {
+    const start = getStartViewTransition();
+    if (!start) {
         await callback();
         return;
     }
-    const transition = document.startViewTransition(async () => {
+    const transition = start(async () => {
         await callback();
     });
-    const timeoutPromise = new Promise((_, reject) => {
-        setTimeout(() => reject(new Error('View transition timed out')), timeout);
-    });
+    await transition.finished;
+}
+async function drain() {
+    if (processing)
+        return;
+    processing = true;
     try {
-        await Promise.race([transition.finished, timeoutPromise]);
+        while (queue.length > 0) {
+            const item = queue.shift();
+            try {
+                await runOne(item.callback);
+                item.resolve();
+            }
+            catch (error) {
+                item.reject(error);
+            }
+        }
     }
-    catch (error) {
+    finally {
+        processing = false;
     }
 }
-function withViewTransition(callback, options = {}) {
+function withViewTransition(callback) {
     return new Promise((resolve, reject) => {
-        transitionQueue.push({
-            callback,
-            options,
-            resolve,
-            reject,
-        });
-        processQueue().catch(reject);
+        queue.push({ callback, resolve, reject });
+        drain().catch(reject);
     });
 }
 
@@ -660,18 +628,6 @@ function isHTMLElement(value) {
         'classList' in value);
 }
 
-function isDevMode() {
-    if (typeof window !== 'undefined' && window.__HYPERFIXI_PROD__) {
-        return false;
-    }
-    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'production') {
-        return false;
-    }
-    return true;
-}
-({
-    enabled: isDevMode()});
-
 function executeSwap(target, content, strategy, morphOptions) {
     const contentStr = content !== null && !isHTMLElement(content) ? content : '';
     const contentEl = isHTMLElement(content) ? content : null;
@@ -767,6 +723,20 @@ function executeSwap(target, content, strategy, morphOptions) {
             throw new Error(`[HyperFixi] swap: unknown strategy "${strategy}"`);
     }
 }
+async function executeSwapWithTransition(targets, content, strategy, options = {}) {
+    const { morphOptions, useViewTransition = false } = options;
+    const performSwap = () => {
+        for (const target of targets) {
+            executeSwap(target, content, strategy, morphOptions);
+        }
+    };
+    if (useViewTransition && isViewTransitionsSupported()) {
+        await withViewTransition(performSwap);
+    }
+    else {
+        performSwap();
+    }
+}
 
 function createCustomEvent(eventName, detail, options = {}) {
     return new CustomEvent(eventName, {
@@ -827,15 +797,7 @@ function createHistorySwap(config) {
                 throw new Error(`HTTP ${response.status}: ${response.statusText}`);
             }
             const html = await response.text();
-            const performSwap = () => {
-                executeSwap(targetElement, html, strategy);
-            };
-            if (useViewTransition && isViewTransitionsSupported()) {
-                await withViewTransition(performSwap);
-            }
-            else {
-                performSwap();
-            }
+            await executeSwapWithTransition([targetElement], html, strategy, { useViewTransition });
             targetElement.classList.remove('hx-swapping');
             if (onAfterSwap) {
                 await onAfterSwap(url, html);
@@ -988,15 +950,7 @@ function createBoosted(config) {
                 throw new Error(`HTTP ${response.status}: ${response.statusText}`);
             }
             const html = await response.text();
-            const performSwap = () => {
-                executeSwap(targetElement, html, strategy);
-            };
-            if (useViewTransition && isViewTransitionsSupported()) {
-                await withViewTransition(performSwap);
-            }
-            else {
-                performSwap();
-            }
+            await executeSwapWithTransition([targetElement], html, strategy, { useViewTransition });
             targetElement.classList.remove('hx-swapping');
             container.classList.remove('hx-boosting');
             if (pushUrl && method === 'GET') {

package/dist/bundle-generator/index.js

@@ -315,6 +315,12 @@ const COMMAND_IMPLEMENTATIONS_TS = {
       for (const el of targets) (el as HTMLElement).blur();
       return targets;
     }`,
+    empty: `
+    case 'empty': {
+      const targets = await getTarget();
+      for (const el of targets) (el as HTMLElement).innerHTML = '';
+      return targets;
+    }`,
     return: `
     case 'return': {
       const value = cmd.args[0] ? await evaluate(cmd.args[0], ctx) : ctx.it;
@@ -811,10 +817,31 @@ function evaluatePositional(node: ASTNode, ctx: Context): Element | null {
   switch (node.position) {
     case 'first': return elements[0] || null;
     case 'last': return elements[elements.length - 1] || null;
-    case 'next': return ctx.me.nextElementSibling;
-    case 'previous': return ctx.me.previousElementSibling;
-    case 'closest': return target.value ? ctx.me.closest(target.value) : null;
-    case 'parent': return ctx.me.parentElement;
+    case 'next': {
+      if (selector) {
+        let el = ctx.me.nextElementSibling;
+        while (el) { if (el.matches(selector)) return el; el = el.nextElementSibling; }
+        return null;
+      }
+      return ctx.me.nextElementSibling;
+    }
+    case 'previous': {
+      if (selector) {
+        let el = ctx.me.previousElementSibling;
+        while (el) { if (el.matches(selector)) return el; el = el.previousElementSibling; }
+        return null;
+      }
+      return ctx.me.previousElementSibling;
+    }
+    case 'closest': return selector ? ctx.me.closest(selector) : null;
+    case 'parent': {
+      if (selector) {
+        let el = ctx.me.parentElement;
+        while (el) { if (el.matches(selector)) return el; el = el.parentElement; }
+        return null;
+      }
+      return ctx.me.parentElement;
+    }
     default: return elements[0] || null;
   }
 }
@@ -1321,7 +1348,7 @@ const KEYWORDS = new Set([
   'repeat', 'times', 'for', 'each', 'while', 'until',
   'toggle', 'add', 'remove', 'put', 'set', 'get', 'call', 'return', 'append',
   'log', 'send', 'trigger', 'wait', 'settle', 'fetch', 'as',
-  'show', 'hide', 'take', 'increment', 'decrement', 'focus', 'blur', 'go', 'transition', 'over',
+  'show', 'hide', 'take', 'increment', 'decrement', 'focus', 'blur', 'empty', 'go', 'transition', 'over',
   'the', 'a', 'an', 'my', 'its', 'me', 'it', 'you',
   'first', 'last', 'next', 'previous', 'closest', 'parent',
   'true', 'false', 'null', 'undefined',
@@ -1628,6 +1655,7 @@ class HybridParser {
       decrement: () => this.parseIncDec('decrement'),
       focus: () => this.parseFocusBlur('focus'),
       blur: () => this.parseFocusBlur('blur'),
+      empty: () => this.parseEmpty(),
       go: () => this.parseGo(),
       return: () => this.parseReturn(),
       transition: () => this.parseTransition(),
@@ -1886,6 +1914,15 @@ class HybridParser {
     return { type: 'command', name, args: [], target };
   }
 
+  parseEmpty() {
+    this.expect('empty');
+    let target;
+    if (!this.isAtEnd() && !this.match('then', 'and', 'end', 'else')) {
+      target = this.parseExpression();
+    }
+    return { type: 'command', name: 'empty', args: [], target };
+  }
+
   parseGo() {
     this.expect('go');
     if (this.match('to')) this.advance();
@@ -1965,7 +2002,7 @@ class HybridParser {
   }
 
   isCommandKeyword(token) {
-    const cmds = ['toggle', 'add', 'remove', 'set', 'put', 'log', 'send', 'wait', 'show', 'hide', 'increment', 'decrement', 'focus', 'blur', 'go'];
+    const cmds = ['toggle', 'add', 'remove', 'set', 'put', 'log', 'send', 'wait', 'show', 'hide', 'increment', 'decrement', 'focus', 'blur', 'empty', 'go'];
     return cmds.includes(normalizeCommand(token.value));
   }
 
@@ -2224,6 +2261,7 @@ const AVAILABLE_COMMANDS = [
     'put',
     'append',
     'take',
+    'empty',
     'set',
     'get',
     'increment',

package/dist/bundle-generator/index.mjs

@@ -313,6 +313,12 @@ const COMMAND_IMPLEMENTATIONS_TS = {
       for (const el of targets) (el as HTMLElement).blur();
       return targets;
     }`,
+    empty: `
+    case 'empty': {
+      const targets = await getTarget();
+      for (const el of targets) (el as HTMLElement).innerHTML = '';
+      return targets;
+    }`,
     return: `
     case 'return': {
       const value = cmd.args[0] ? await evaluate(cmd.args[0], ctx) : ctx.it;
@@ -809,10 +815,31 @@ function evaluatePositional(node: ASTNode, ctx: Context): Element | null {
   switch (node.position) {
     case 'first': return elements[0] || null;
     case 'last': return elements[elements.length - 1] || null;
-    case 'next': return ctx.me.nextElementSibling;
-    case 'previous': return ctx.me.previousElementSibling;
-    case 'closest': return target.value ? ctx.me.closest(target.value) : null;
-    case 'parent': return ctx.me.parentElement;
+    case 'next': {
+      if (selector) {
+        let el = ctx.me.nextElementSibling;
+        while (el) { if (el.matches(selector)) return el; el = el.nextElementSibling; }
+        return null;
+      }
+      return ctx.me.nextElementSibling;
+    }
+    case 'previous': {
+      if (selector) {
+        let el = ctx.me.previousElementSibling;
+        while (el) { if (el.matches(selector)) return el; el = el.previousElementSibling; }
+        return null;
+      }
+      return ctx.me.previousElementSibling;
+    }
+    case 'closest': return selector ? ctx.me.closest(selector) : null;
+    case 'parent': {
+      if (selector) {
+        let el = ctx.me.parentElement;
+        while (el) { if (el.matches(selector)) return el; el = el.parentElement; }
+        return null;
+      }
+      return ctx.me.parentElement;
+    }
     default: return elements[0] || null;
   }
 }
@@ -1319,7 +1346,7 @@ const KEYWORDS = new Set([
   'repeat', 'times', 'for', 'each', 'while', 'until',
   'toggle', 'add', 'remove', 'put', 'set', 'get', 'call', 'return', 'append',
   'log', 'send', 'trigger', 'wait', 'settle', 'fetch', 'as',
-  'show', 'hide', 'take', 'increment', 'decrement', 'focus', 'blur', 'go', 'transition', 'over',
+  'show', 'hide', 'take', 'increment', 'decrement', 'focus', 'blur', 'empty', 'go', 'transition', 'over',
   'the', 'a', 'an', 'my', 'its', 'me', 'it', 'you',
   'first', 'last', 'next', 'previous', 'closest', 'parent',
   'true', 'false', 'null', 'undefined',
@@ -1626,6 +1653,7 @@ class HybridParser {
       decrement: () => this.parseIncDec('decrement'),
       focus: () => this.parseFocusBlur('focus'),
       blur: () => this.parseFocusBlur('blur'),
+      empty: () => this.parseEmpty(),
       go: () => this.parseGo(),
       return: () => this.parseReturn(),
       transition: () => this.parseTransition(),
@@ -1884,6 +1912,15 @@ class HybridParser {
     return { type: 'command', name, args: [], target };
   }
 
+  parseEmpty() {
+    this.expect('empty');
+    let target;
+    if (!this.isAtEnd() && !this.match('then', 'and', 'end', 'else')) {
+      target = this.parseExpression();
+    }
+    return { type: 'command', name: 'empty', args: [], target };
+  }
+
   parseGo() {
     this.expect('go');
     if (this.match('to')) this.advance();
@@ -1963,7 +2000,7 @@ class HybridParser {
   }
 
   isCommandKeyword(token) {
-    const cmds = ['toggle', 'add', 'remove', 'set', 'put', 'log', 'send', 'wait', 'show', 'hide', 'increment', 'decrement', 'focus', 'blur', 'go'];
+    const cmds = ['toggle', 'add', 'remove', 'set', 'put', 'log', 'send', 'wait', 'show', 'hide', 'increment', 'decrement', 'focus', 'blur', 'empty', 'go'];
     return cmds.includes(normalizeCommand(token.value));
   }
 
@@ -2222,6 +2259,7 @@ const AVAILABLE_COMMANDS = [
     'put',
     'append',
     'take',
+    'empty',
     'set',
     'get',
     'increment',