Merge remote-tracking branch 'origin/master'

CONTRIBUTING.md

@@ -3,7 +3,7 @@ Thank you for your interest in contributing! Because we're a small team, we have
 
 ## Issues
 1. Issues are the best place to propose a new feature. Keep in mind that htmx is a small library, so there are lots of great ideas that don't fit in the core; it's always best to check in about an idea before doing a bunch of work on it.
-1. When proposing a new features, we will often suggest that you implement it as an [extension](https://github.com/bigskysoftware/htmx-extensions), so try that first. Even if we don't end up supporting it officially, you can publish it yourself and we can link to it.
+1. When proposing a new feature, we will often suggest that you implement it as an [extension](https://github.com/bigskysoftware/htmx-extensions), so try that first. Even if we don't end up supporting it officially, you can publish it yourself and we can link to it.
 1. Search the issues before proposing a feature to see if it is already under discussion. Referencing existing issues is a good way to increase the priority of your own.
 1. We don't have an issue template yet, but the more detailed your description of the issue, the more quickly we'll be able to evaluate it.
 1. See an issue that you also have? Give it a reaction (and comment, if you have something to add). We note that!

www/content/attributes/hx-select.md

@@ -9,7 +9,7 @@ Here is an example that selects a subset of the response content:
 
 ```html
 <div>
-    <button hx-get="/info" hx-select="#info-details" hx-swap="outerHTML">
+    <button hx-get="/info" hx-select="#info-detail" hx-swap="outerHTML">
         Get Info!
     </button>
 </div>

www/content/attributes/hx-swap-oob.md

@@ -51,6 +51,27 @@ Here is an example with an out of band swap of a table row being encapsulated in
 
 Note that these template tags will be removed from the final content of the page.
 
+### Slippery SVGs
+
+Some element types, like SVG, use a specific XML namespace for their child elements. This prevents internal elements from working correctly when swapped in, unless they are encapsulated within a `svg` tag. To modify the internal contents of an existing SVG, you can use both `template` and `svg` tags to encapsulate the elements, allowing them to get the correct namespace applied.
+
+Here is an example with an out of band swap of svg elements being encapsulated in this way:
+
+```html
+<div>
+    ...
+</div>
+<template><svg>
+    <circle hx-swap-oob="true" id="circle1" r="35" cx="50" cy="50" fill="red" /> 
+</svg></template>
+<template><svg hx-swap-oob="beforebegin:#circle1">
+    <circle id="circle2" r="45" cx="50" cy="50" fill="blue" /> 
+</svg></template>
+```
+This will replace circle1 inline and then insert circle2 before circle1. 
+
+Note that these `template` and `svg` wrapping tags will be removed from the final content of the page.
+
 ## Nested OOB Swaps
 
 By default, any element with `hx-swap-oob=` attribute anywhere in the response is processed for oob swap behavior, including when an element is nested within the main response element.