Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/marcoroth/turbo-morph
Morph action for Turbo Streams
https://github.com/marcoroth/turbo-morph
hotwire hotwired morphdom turbo turbo-stream turbo-streams
Last synced: about 2 months ago
JSON representation
Morph action for Turbo Streams
- Host: GitHub
- URL: https://github.com/marcoroth/turbo-morph
- Owner: marcoroth
- License: mit
- Created: 2022-07-19T00:04:16.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2023-02-25T23:26:57.000Z (over 1 year ago)
- Last Synced: 2024-07-05T14:52:29.736Z (3 months ago)
- Topics: hotwire, hotwired, morphdom, turbo, turbo-stream, turbo-streams
- Language: JavaScript
- Homepage:
- Size: 161 KB
- Stars: 95
- Watchers: 3
- Forks: 1
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Turbo Morph
## Getting Started
`turbo-morph` is a [morphdom](https://github.com/patrick-steele-idem/morphdom) integration for [Turbo Streams](https://turbo.hotwired.dev/reference/streams). It provides a new Turbo Stream `morph` action.
**Note:** Requires Turbo **7.2+**
```bash
yarn add turbo-morph
```
```diff
// application.js
import * as Turbo from '@hotwired/turbo'
+import TurboMorph from 'turbo-morph'
+TurboMorph.initialize(Turbo.StreamActions)
```
## Example
```html
This is the new body
```
### `children-only` option
[`morphdom` exposes a `childrenOnly` option](https://github.com/patrick-steele-idem/morphdom#morphdomfromnode-tonode-options--node) that can be passed to a morph call.
With Turbo Streams you can apply this option by adding the `[children-only]` attribute to your `` element.
```html
...
```
## Usage with Rails
The [`turbo_power-rails`](https://github.com/marcoroth/turbo_power-rails) gem ships a Rails helper for using `turbo_stream.morph` in your application. Check out the Getting Started section over there.
## Acknowledgments
tubro-morph is [MIT-licensed](LICENSE) open-source software from [Marco Roth](https://github.com/marcoroth).
Turbo is [MIT-licensed](https://github.com/hotwired/turbo/blob/main/MIT-LICENSE) open-source software from [Basecamp](https://basecamp.com/).
morphdom is [MIT-licensed](https://github.com/patrick-steele-idem/morphdom/blob/master/LICENSE) open-source software from [Patrick Steele-Idem](https://github.com/patrick-steele-idem)