htmx.org 1.9.10 → 2.0.0-alpha2

package/dist/ext/client-side-templates.js

@@ -1,96 +0,0 @@
-htmx.defineExtension('client-side-templates', {
-    transformResponse : function(text, xhr, elt) {
-
-        var mustacheTemplate = htmx.closest(elt, "[mustache-template]");
-        if (mustacheTemplate) {
-            var data = JSON.parse(text);
-            var templateId = mustacheTemplate.getAttribute('mustache-template');
-            var template = htmx.find("#" + templateId);
-            if (template) {
-                return Mustache.render(template.innerHTML, data);
-            } else {
-                throw "Unknown mustache template: " + templateId;
-            }
-        }
-
-        var mustacheArrayTemplate = htmx.closest(elt, "[mustache-array-template]");
-        if (mustacheArrayTemplate) {
-            var data = JSON.parse(text);
-            var templateId = mustacheArrayTemplate.getAttribute('mustache-array-template');
-            var template = htmx.find("#" + templateId);
-            if (template) {
-                return Mustache.render(template.innerHTML, {"data": data });
-            } else {
-                throw "Unknown mustache template: " + templateId;
-            }
-        }
-
-        var handlebarsTemplate = htmx.closest(elt, "[handlebars-template]");
-        if (handlebarsTemplate) {
-            var data = JSON.parse(text);
-            var templateId = handlebarsTemplate.getAttribute('handlebars-template');
-            var templateElement = htmx.find('#' + templateId).innerHTML;
-            var renderTemplate = Handlebars.compile(templateElement);
-            if (renderTemplate) {
-                return renderTemplate(data);
-            } else {
-                throw "Unknown handlebars template: " + templateId;
-            }
-        }
-
-        var handlebarsArrayTemplate = htmx.closest(elt, "[handlebars-array-template]");
-        if (handlebarsArrayTemplate) {
-            var data = JSON.parse(text);
-            var templateId = handlebarsArrayTemplate.getAttribute('handlebars-array-template');
-            var templateElement = htmx.find('#' + templateId).innerHTML;
-            var renderTemplate = Handlebars.compile(templateElement);
-            if (renderTemplate) {
-                return renderTemplate(data);
-            } else {
-                throw "Unknown handlebars template: " + templateId;
-            }
-        }
-
-        var nunjucksTemplate = htmx.closest(elt, "[nunjucks-template]");
-        if (nunjucksTemplate) {
-            var data = JSON.parse(text);
-            var templateName = nunjucksTemplate.getAttribute('nunjucks-template');
-            var template = htmx.find('#' + templateName);
-            if (template) {
-                return nunjucks.renderString(template.innerHTML, data);
-            } else {
-                return nunjucks.render(templateName, data);
-            }
-        }
-
-        var xsltTemplate = htmx.closest(elt, "[xslt-template]");
-        if (xsltTemplate) {
-            var templateId = xsltTemplate.getAttribute('xslt-template');
-            var template = htmx.find("#" + templateId);
-            if (template) {
-              var content = template.innerHTML ? new DOMParser().parseFromString(template.innerHTML, 'application/xml')
-                                               : template.contentDocument;
-              var processor = new XSLTProcessor();
-              processor.importStylesheet(content);
-              var data = new DOMParser().parseFromString(text, "application/xml");
-              var frag = processor.transformToFragment(data, document);
-              return new XMLSerializer().serializeToString(frag);
-            } else {
-              throw "Unknown XSLT template: " + templateId;
-            }
-        }
-
-          var nunjucksArrayTemplate = htmx.closest(elt, "[nunjucks-array-template]");
-          if (nunjucksArrayTemplate) {
-              var data = JSON.parse(text);
-              var templateName = nunjucksArrayTemplate.getAttribute('nunjucks-array-template');
-              var template = htmx.find('#' + templateName);
-              if (template) {
-                  return nunjucks.renderString(template.innerHTML, {"data": data});
-              } else {
-                  return nunjucks.render(templateName, {"data": data});
-              }
-            }
-        return text;
-    }
-});

package/dist/ext/debug.js

@@ -1,11 +0,0 @@
-htmx.defineExtension('debug', {
-    onEvent: function (name, evt) {
-        if (console.debug) {
-            console.debug(name, evt);
-        } else if (console) {
-            console.log("DEBUG:", name, evt);
-        } else {
-            throw "NO CONSOLE SUPPORTED"
-        }
-    }
-});

package/dist/ext/disable-element.js

@@ -1,18 +0,0 @@
-"use strict";
-
-// Disable Submit Button
-htmx.defineExtension('disable-element', {
-    onEvent: function (name, evt) {
-        let elt = evt.detail.elt;
-        let target = elt.getAttribute("hx-disable-element");
-        let targetElements = (target == "self") ? [ elt ] : document.querySelectorAll(target);
-
-        for (var i = 0; i < targetElements.length; i++) {
-            if (name === "htmx:beforeRequest" && targetElements[i]) {
-                targetElements[i].disabled = true;
-            } else if (name == "htmx:afterRequest" && targetElements[i]) {
-                targetElements[i].disabled = false;
-            }
-        }
-    }
-});

package/dist/ext/event-header.js

@@ -1,37 +0,0 @@
-(function(){
-    function stringifyEvent(event) {
-        var obj = {};
-        for (var key in event) {
-            obj[key] = event[key];
-        }
-        return JSON.stringify(obj, function(key, value){
-            if(value instanceof Node){
-                var nodeRep = value.tagName;
-                if (nodeRep) {
-                    nodeRep = nodeRep.toLowerCase();
-                    if(value.id){
-                        nodeRep += "#" + value.id;
-                    }
-                    if(value.classList && value.classList.length){
-                        nodeRep += "." + value.classList.toString().replace(" ", ".")
-                    }
-                    return nodeRep;
-                } else {
-                    return "Node"
-                }
-            }
-            if (value instanceof Window) return 'Window';
-            return value;
-        });
-    }
-
-    htmx.defineExtension('event-header', {
-        onEvent: function (name, evt) {
-            if (name === "htmx:configRequest") {
-                if (evt.detail.triggeringEvent) {
-                    evt.detail.headers['Triggering-Event'] = stringifyEvent(evt.detail.triggeringEvent);
-                }
-            }
-        }
-    });
-})();

package/dist/ext/head-support.js

@@ -1,141 +0,0 @@
-//==========================================================
-// head-support.js
-//
-// An extension to htmx 1.0 to add head tag merging.
-//==========================================================
-(function(){
-
-    var api = null;
-
-    function log() {
-        //console.log(arguments);
-    }
-
-    function mergeHead(newContent, defaultMergeStrategy) {
-
-        if (newContent && newContent.indexOf('<head') > -1) {
-            const htmlDoc = document.createElement("html");
-            // remove svgs to avoid conflicts
-            var contentWithSvgsRemoved = newContent.replace(/<svg(\s[^>]*>|>)([\s\S]*?)<\/svg>/gim, '');
-            // extract head tag
-            var headTag = contentWithSvgsRemoved.match(/(<head(\s[^>]*>|>)([\s\S]*?)<\/head>)/im);
-
-            // if the  head tag exists...
-            if (headTag) {
-
-                var added = []
-                var removed = []
-                var preserved = []
-                var nodesToAppend = []
-
-                htmlDoc.innerHTML = headTag;
-                var newHeadTag = htmlDoc.querySelector("head");
-                var currentHead = document.head;
-
-                if (newHeadTag == null) {
-                    return;
-                } else {
-                    // put all new head elements into a Map, by their outerHTML
-                    var srcToNewHeadNodes = new Map();
-                    for (const newHeadChild of newHeadTag.children) {
-                        srcToNewHeadNodes.set(newHeadChild.outerHTML, newHeadChild);
-                    }
-                }
-
-
-
-                // determine merge strategy
-                var mergeStrategy = api.getAttributeValue(newHeadTag, "hx-head") || defaultMergeStrategy;
-
-                // get the current head
-                for (const currentHeadElt of currentHead.children) {
-
-                    // If the current head element is in the map
-                    var inNewContent = srcToNewHeadNodes.has(currentHeadElt.outerHTML);
-                    var isReAppended = currentHeadElt.getAttribute("hx-head") === "re-eval";
-                    var isPreserved = api.getAttributeValue(currentHeadElt, "hx-preserve") === "true";
-                    if (inNewContent || isPreserved) {
-                        if (isReAppended) {
-                            // remove the current version and let the new version replace it and re-execute
-                            removed.push(currentHeadElt);
-                        } else {
-                            // this element already exists and should not be re-appended, so remove it from
-                            // the new content map, preserving it in the DOM
-                            srcToNewHeadNodes.delete(currentHeadElt.outerHTML);
-                            preserved.push(currentHeadElt);
-                        }
-                    } else {
-                        if (mergeStrategy === "append") {
-                            // we are appending and this existing element is not new content
-                            // so if and only if it is marked for re-append do we do anything
-                            if (isReAppended) {
-                                removed.push(currentHeadElt);
-                                nodesToAppend.push(currentHeadElt);
-                            }
-                        } else {
-                            // if this is a merge, we remove this content since it is not in the new head
-                            if (api.triggerEvent(document.body, "htmx:removingHeadElement", {headElement: currentHeadElt}) !== false) {
-                                removed.push(currentHeadElt);
-                            }
-                        }
-                    }
-                }
-
-                // Push the tremaining new head elements in the Map into the
-                // nodes to append to the head tag
-                nodesToAppend.push(...srcToNewHeadNodes.values());
-                log("to append: ", nodesToAppend);
-
-                for (const newNode of nodesToAppend) {
-                    log("adding: ", newNode);
-                    var newElt = document.createRange().createContextualFragment(newNode.outerHTML);
-                    log(newElt);
-                    if (api.triggerEvent(document.body, "htmx:addingHeadElement", {headElement: newElt}) !== false) {
-                        currentHead.appendChild(newElt);
-                        added.push(newElt);
-                    }
-                }
-
-                // remove all removed elements, after we have appended the new elements to avoid
-                // additional network requests for things like style sheets
-                for (const removedElement of removed) {
-                    if (api.triggerEvent(document.body, "htmx:removingHeadElement", {headElement: removedElement}) !== false) {
-                        currentHead.removeChild(removedElement);
-                    }
-                }
-
-                api.triggerEvent(document.body, "htmx:afterHeadMerge", {added: added, kept: preserved, removed: removed});
-            }
-        }
-    }
-
-    htmx.defineExtension("head-support", {
-        init: function(apiRef) {
-            // store a reference to the internal API.
-            api = apiRef;
-
-            htmx.on('htmx:afterSwap', function(evt){
-                var serverResponse = evt.detail.xhr.response;
-                if (api.triggerEvent(document.body, "htmx:beforeHeadMerge", evt.detail)) {
-                    mergeHead(serverResponse, evt.detail.boosted ? "merge" : "append");
-                }
-            })
-
-            htmx.on('htmx:historyRestore', function(evt){
-                if (api.triggerEvent(document.body, "htmx:beforeHeadMerge", evt.detail)) {
-                    if (evt.detail.cacheMiss) {
-                        mergeHead(evt.detail.serverResponse, "merge");
-                    } else {
-                        mergeHead(evt.detail.item.head, "merge");
-                    }
-                }
-            })
-
-            htmx.on('htmx:historyItemCreated', function(evt){
-                var historyItem = evt.detail.item;
-                historyItem.head = document.head.outerHTML;
-            })
-        }
-    });
-
-})()

package/dist/ext/include-vals.js

@@ -1,24 +0,0 @@
-(function(){
-
-    function mergeObjects(obj1, obj2) {
-        for (var key in obj2) {
-            if (obj2.hasOwnProperty(key)) {
-                obj1[key] = obj2[key];
-            }
-        }
-        return obj1;
-    }
-
-    htmx.defineExtension('include-vals', {
-        onEvent: function (name, evt) {
-            if (name === "htmx:configRequest") {
-                var includeValsElt = htmx.closest(evt.detail.elt, "[include-vals],[data-include-vals]");
-                if (includeValsElt) {
-                    var includeVals = includeValsElt.getAttribute("include-vals") || includeValsElt.getAttribute("data-include-vals");
-                    var valuesToInclude = eval("({" + includeVals + "})");
-                    mergeObjects(evt.detail.parameters, valuesToInclude);
-                }
-            }
-        }
-    });
-})();

package/dist/ext/json-enc.js

@@ -1,12 +0,0 @@
-htmx.defineExtension('json-enc', {
-    onEvent: function (name, evt) {
-        if (name === "htmx:configRequest") {
-            evt.detail.headers['Content-Type'] = "application/json";
-        }
-    },
-    
-    encodeParameters : function(xhr, parameters, elt) {
-        xhr.overrideMimeType('text/json');
-        return (JSON.stringify(parameters));
-    }
-});

package/dist/ext/loading-states.js

@@ -1,183 +0,0 @@
-;(function () {
-	let loadingStatesUndoQueue = []
-
-	function loadingStateContainer(target) {
-		return htmx.closest(target, '[data-loading-states]') || document.body
-	}
-
-	function mayProcessUndoCallback(target, callback) {
-		if (document.body.contains(target)) {
-			callback()
-		}
-	}
-
-	function mayProcessLoadingStateByPath(elt, requestPath) {
-		const pathElt = htmx.closest(elt, '[data-loading-path]')
-		if (!pathElt) {
-			return true
-		}
-
-		return pathElt.getAttribute('data-loading-path') === requestPath
-	}
-
-	function queueLoadingState(sourceElt, targetElt, doCallback, undoCallback) {
-		const delayElt = htmx.closest(sourceElt, '[data-loading-delay]')
-		if (delayElt) {
-			const delayInMilliseconds =
-				delayElt.getAttribute('data-loading-delay') || 200
-			const timeout = setTimeout(function () {
-				doCallback()
-
-				loadingStatesUndoQueue.push(function () {
-					mayProcessUndoCallback(targetElt, undoCallback)
-				})
-			}, delayInMilliseconds)
-
-			loadingStatesUndoQueue.push(function () {
-				mayProcessUndoCallback(targetElt, function () { clearTimeout(timeout) })
-			})
-		} else {
-			doCallback()
-			loadingStatesUndoQueue.push(function () {
-				mayProcessUndoCallback(targetElt, undoCallback)
-			})
-		}
-	}
-
-	function getLoadingStateElts(loadingScope, type, path) {
-		return Array.from(htmx.findAll(loadingScope, "[" + type + "]")).filter(
-			function (elt) { return mayProcessLoadingStateByPath(elt, path) }
-		)
-	}
-
-	function getLoadingTarget(elt) {
-		if (elt.getAttribute('data-loading-target')) {
-			return Array.from(
-				htmx.findAll(elt.getAttribute('data-loading-target'))
-			)
-		}
-		return [elt]
-	}
-
-	htmx.defineExtension('loading-states', {
-		onEvent: function (name, evt) {
-			if (name === 'htmx:beforeRequest') {
-				const container = loadingStateContainer(evt.target)
-
-				const loadingStateTypes = [
-					'data-loading',
-					'data-loading-class',
-					'data-loading-class-remove',
-					'data-loading-disable',
-					'data-loading-aria-busy',
-				]
-
-				let loadingStateEltsByType = {}
-
-				loadingStateTypes.forEach(function (type) {
-					loadingStateEltsByType[type] = getLoadingStateElts(
-						container,
-						type,
-						evt.detail.pathInfo.requestPath
-					)
-				})
-
-				loadingStateEltsByType['data-loading'].forEach(function (sourceElt) {
-					getLoadingTarget(sourceElt).forEach(function (targetElt) {
-						queueLoadingState(
-							sourceElt,
-							targetElt,
-							function () {
-								targetElt.style.display =
-									sourceElt.getAttribute('data-loading') ||
-									'inline-block' },
-							function () { targetElt.style.display = 'none' }
-						)
-					})
-				})
-
-				loadingStateEltsByType['data-loading-class'].forEach(
-					function (sourceElt) {
-						const classNames = sourceElt
-							.getAttribute('data-loading-class')
-							.split(' ')
-
-						getLoadingTarget(sourceElt).forEach(function (targetElt) {
-							queueLoadingState(
-								sourceElt,
-								targetElt,
-								function () {
-									classNames.forEach(function (className) {
-                                        targetElt.classList.add(className)
-                                    })
-                                },
-								function() {
-									classNames.forEach(function (className) {
-                                        targetElt.classList.remove(className)
-                                    })
-                                }
-							)
-						})
-					}
-				)
-
-				loadingStateEltsByType['data-loading-class-remove'].forEach(
-					function (sourceElt) {
-						const classNames = sourceElt
-							.getAttribute('data-loading-class-remove')
-							.split(' ')
-
-						getLoadingTarget(sourceElt).forEach(function (targetElt) {
-							queueLoadingState(
-								sourceElt,
-								targetElt,
-								function () {
-									classNames.forEach(function (className) {
-                                        targetElt.classList.remove(className)
-                                    })
-                                },
-								function() {
-									classNames.forEach(function (className) {
-                                        targetElt.classList.add(className)
-                                    })
-                                }
-							)
-						})
-					}
-				)
-
-				loadingStateEltsByType['data-loading-disable'].forEach(
-					function (sourceElt) {
-						getLoadingTarget(sourceElt).forEach(function (targetElt) {
-							queueLoadingState(
-								sourceElt,
-								targetElt,
-								function() { targetElt.disabled = true },
-                                function() { targetElt.disabled = false }
-							)
-						})
-					}
-				)
-
-				loadingStateEltsByType['data-loading-aria-busy'].forEach(
-					function (sourceElt) {
-						getLoadingTarget(sourceElt).forEach(function (targetElt) {
-							queueLoadingState(
-								sourceElt,
-								targetElt,
-								function () { targetElt.setAttribute("aria-busy", "true") },
-								function () { targetElt.removeAttribute("aria-busy") }
-							)
-						})
-					}
-				)
-			}
-
-			if (name === 'htmx:beforeOnLoad') {
-				while (loadingStatesUndoQueue.length > 0) {
-					loadingStatesUndoQueue.shift()()
-				}
-			}
-		},
-	})
-})()

package/dist/ext/method-override.js

@@ -1,11 +0,0 @@
-htmx.defineExtension('method-override', {
-    onEvent: function (name, evt) {
-        if (name === "htmx:configRequest") {
-            var method = evt.detail.verb;
-            if (method !== "get" || method !== "post") {
-                evt.detail.headers['X-HTTP-Method-Override'] = method.toUpperCase();
-                evt.detail.verb = "post";
-            }
-        }
-    }
-});

package/dist/ext/morphdom-swap.js

@@ -1,17 +0,0 @@
-htmx.defineExtension('morphdom-swap', {
-    isInlineSwap: function(swapStyle) {
-        return swapStyle === 'morphdom';
-    },
-    handleSwap: function (swapStyle, target, fragment) {
-        if (swapStyle === 'morphdom') {
-            if (fragment.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
-                // IE11 doesn't support DocumentFragment.firstElementChild
-                morphdom(target, fragment.firstElementChild || fragment.firstChild);
-                return [target];
-            } else {
-                morphdom(target, fragment.outerHTML);
-                return [target];
-            }
-        }
-    }
-});

package/dist/ext/multi-swap.js

@@ -1,45 +0,0 @@
-(function () {
-
-    /** @type {import("../htmx").HtmxInternalApi} */
-    var api;
-
-    htmx.defineExtension('multi-swap', {
-        init: function (apiRef) {
-            api = apiRef;
-        },
-        isInlineSwap: function (swapStyle) {
-            return swapStyle.indexOf('multi:') === 0;
-        },
-        handleSwap: function (swapStyle, target, fragment, settleInfo) {
-            if (swapStyle.indexOf('multi:') === 0) {
-                var selectorToSwapStyle = {};
-                var elements = swapStyle.replace(/^multi\s*:\s*/, '').split(/\s*,\s*/);
-
-                elements.map(function (element) {
-                    var split = element.split(/\s*:\s*/);
-                    var elementSelector = split[0];
-                    var elementSwapStyle = typeof (split[1]) !== "undefined" ? split[1] : "innerHTML";
-
-                    if (elementSelector.charAt(0) !== '#') {
-                        console.error("HTMX multi-swap: unsupported selector '" + elementSelector + "'. Only ID selectors starting with '#' are supported.");
-                        return;
-                    }
-
-                    selectorToSwapStyle[elementSelector] = elementSwapStyle;
-                });
-
-                for (var selector in selectorToSwapStyle) {
-                    var swapStyle = selectorToSwapStyle[selector];
-                    var elementToSwap = fragment.querySelector(selector);
-                    if (elementToSwap) {
-                        api.oobSwap(swapStyle, elementToSwap, settleInfo);
-                    } else {
-                        console.warn("HTMX multi-swap: selector '" + selector + "' not found in source content.");
-                    }
-                }
-
-                return true;
-            }
-        }
-    });
-})();

package/dist/ext/path-deps.js

@@ -1,60 +0,0 @@
-(function(undefined){
-    'use strict';
-
-    // Save a reference to the global object (window in the browser)
-    var _root = this;
-  
-    function dependsOn(pathSpec, url) {
-        if (pathSpec === "ignore") {
-            return false;
-        }
-        var dependencyPath = pathSpec.split("/");
-        var urlPath = url.split("/");
-        for (var i = 0; i < urlPath.length; i++) {
-            var dependencyElement = dependencyPath.shift();
-            var pathElement = urlPath[i];
-            if (dependencyElement !== pathElement && dependencyElement !== "*") {
-                return false;
-            }
-            if (dependencyPath.length === 0 || (dependencyPath.length === 1 && dependencyPath[0] === "")) {
-                return true;
-            }
-        }
-        return false;
-    }
-
-    function refreshPath(path) {
-        var eltsWithDeps = htmx.findAll("[path-deps]");
-        for (var i = 0; i < eltsWithDeps.length; i++) {
-            var elt = eltsWithDeps[i];
-            if (dependsOn(elt.getAttribute('path-deps'), path)) {
-                htmx.trigger(elt, "path-deps");
-            }
-        }      
-    }    
-
-    htmx.defineExtension('path-deps', {
-        onEvent: function (name, evt) {
-            if (name === "htmx:beforeOnLoad") {
-                var config = evt.detail.requestConfig;
-                // mutating call
-                if (config.verb !== "get" && evt.target.getAttribute('path-deps') !== 'ignore') {
-                    refreshPath(config.path);
-                }
-            } 
-        }
-    });
-
-    /**
-     *  ********************
-     *  Expose functionality
-     *  ********************
-     */    
-
-    _root.PathDeps = {
-        refresh: function(path) {
-            refreshPath(path);
-        }
-    };
-            
-}).call(this);

package/dist/ext/path-params.js

@@ -1,11 +0,0 @@
-htmx.defineExtension('path-params', {
-    onEvent: function(name, evt) {
-        if (name === "htmx:configRequest") {
-            evt.detail.path = evt.detail.path.replace(/{([^}]+)}/g, function (_, param) {
-                var val = evt.detail.parameters[param];
-                delete evt.detail.parameters[param];
-                return val === undefined ? "{" + param + "}" : encodeURIComponent(val);
-          })
-        }
-    }
-});