idiomorph - npm Package Compare versions

Comparing version 0.1.1 to 0.2.0

package.json

		@@ -7,3 +7,3 @@ {
		],
		"version": "0.1.1",
		"version": "0.2.0",
		"homepage": "https://github.com/bigskysoftware/idiomorph",
		@@ -37,4 +37,6 @@ "bugs": {
		"mocha-webdriver-runner": "^0.6.3",
		"uglify-js": "^3.15.0"
		"uglify-js": "^3.15.0",
		"sinon": "^9.2.4",
		"htmx.org": "1.9.9"
		}
		}

README.md

		@@ -1,2 +0,2 @@
		# Idiomorph
		<h1 style="font-family: Verdana,sans-serif;">♻️ Idiomorph</h1>

		@@ -138,6 +138,11 @@ Idiomorph is a javascript library for morphing one DOM tree to another. It is inspired by other libraries that

		### Setting Defaults

		All the behaviors specified above can be set to a different default by mutating the `Idimorph.defaults` object, including
		the `Idimorph.defaults.callbacks` and `Idimorph.defaults.head` objects.

		### htmx

		Idiomorph was created to integrate with [htmx](https://htmx.org) and can be used as a swapping mechanism by including
		the `Idiomorph-ext` file in your HTML:
		the `dist/idiomorph-ext.js` file in your HTML:

		@@ -163,2 +168,25 @@ ```html

		Note that this file includes both Idiomorph and the htmx extension.

		#### Configuring Morphing Behavior in htmx

		The Idiomorph extension for htmx supports three different syntaxes for specifying behavior:

		* `hx-swap='morph'` - This will perform a morph on the outerHTML of the target
		* `hx-swap='morph:outerHTML'` - This will perform a morph on the outerHTML of the target (explicit)
		* `hx-swap='morph:innerHTML'` - This will perform a morph on the innerHTML of the target (i.e. the children)
		* `hx-swap='morph:<expr>'` - In this form, `<expr>` can be any valid JavaScript expression. The results of the expression
		will be passed into the `Idiomorph.morph()` method as the configuration.

		The last form gives you access to all the configuration options of Idiomorph. So, for example, if you wanted to ignore
		the input value in a given morph, you could use the following swap specification:

		```html
		<button hx-get="/example"
		hx-swap="morph:{ignoreActiveValue:true}"
		hx-target="closest form">
		Morph The Closest Form But Ignore The Active Input Value
		</button>
		```

		## Performance
		@@ -165,0 +193,0 @@

idiomorph - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics