• Stars
    star
    323
  • Rank 125,269 (Top 3 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created over 1 year ago
  • Updated about 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Power-pack for Turbo Streams

TurboPower

NPM Version NPM Downloads NPM Bundle Size

Getting Started

turbo_power is a power-pack for Turbo Streams. It provides Turbo Streams with a bunch of new actions and additionally adds the morph action from turbo-morph.

Note: Requires Turbo 7.2+

Getting Started

yarn add turbo_power
// application.js
import * as Turbo from '@hotwired/turbo'

+import TurboPower from 'turbo_power'
+TurboPower.initialize(Turbo.StreamActions)

Getting Started with Rails

Checkout the instructions in the turbo_power-rails repo.

Custom Actions

DOM Actions

  • turbo_stream.graft(target, parent, **attributes)
  • turbo_stream.morph(target, html = nil, **attributes, &block)
  • turbo_stream.inner_html(target, html = nil, **attributes, &block)
  • turbo_stream.insert_adjacent_html(target, html = nil, position: 'beforeend', **attributes, &block)
  • turbo_stream.insert_adjacent_text(target, text, position: 'beforebegin', **attributes)
  • turbo_stream.outer_html(target, html = nil, **attributes, &block)
  • turbo_stream.text_content(target, text, **attributes)
  • turbo_stream.set_meta(name, content)

Attribute Actions

  • turbo_stream.add_css_class(target, classes, **attributes)
  • turbo_stream.remove_attribute(target, attribute, **attributes)
  • turbo_stream.remove_css_class(target, classes, **attributes)
  • turbo_stream.set_attribute(target, attribute, value, **attributes)
  • turbo_stream.set_dataset_attribute(target, attribute, value, **attributes)
  • turbo_stream.set_property(target, property, value, **attributes)
  • turbo_stream.set_style(target, name, value, **attributes)
  • turbo_stream.set_styles(target, styles, **attributes)
  • turbo_stream.set_value(target, value, **attributes)
  • turbo_stream.toggle_css_class(target, classes, **attributes)

Event Actions

  • turbo_stream.dispatch_event(target, name, detail: {}, **attributes)

Form Actions

  • turbo_stream.reset_form(target, **attributes)

Storage Actions

  • turbo_stream.clear_storage(type, **attributes)
  • turbo_stream.clear_local_storage(**attributes)
  • turbo_stream.clear_session_storage(**attributes)
  • turbo_stream.remove_storage_item(key, type, **attributes)
  • turbo_stream.remove_local_storage_item(key, **attributes)
  • turbo_stream.remove_session_storage_item(key, **attributes)
  • turbo_stream.set_storage_item(key, value, type, **attributes)
  • turbo_stream.set_local_storage_item(key, value, **attributes)
  • turbo_stream.set_session_storage_item(key, value, **attributes)

Browser Actions

  • turbo_stream.reload(**attributes)
  • turbo_stream.scroll_into_view(target, inline = "nearest")
  • turbo_stream.set_focus(target, **attributes)
  • turbo_stream.set_title(title, **attributes)

Document Actions

  • turbo_stream.set_cookie(cookie, **attributes)
  • turbo_stream.set_cookie_item(key, value, **attributes)

Browser History Actions

  • turbo_stream.history_back(**attributes)
  • turbo_stream.history_forward(**attributes)
  • turbo_stream.history_go(delta, **attributes)
  • turbo_stream.push_state(url, title = nil, state = nil, **attributes)
  • turbo_stream.replace_state(url, title = nil, state = nil, **attributes)

Debug Actions

  • turbo_stream.console_log(message, level = :log)
  • turbo_stream.console_table(data, columns)

Notification Actions

  • turbo_stream.notification(title, **options)

Turbo Actions

  • turbo_stream.redirect_to(url, turbo_action = nil, **attributes)
  • turbo_stream.turbo_clear_cache()

Turbo Progress Bar Actions

  • turbo_stream.turbo_progress_bar_show()
  • turbo_stream.turbo_progress_bar_hide()
  • turbo_stream.turbo_progress_bar_set_value(value)

Turbo Frame Actions

  • turbo_stream.turbo_frame_reload(frame_id)
  • turbo_stream.turbo_frame_set_src(frame_id, src)

Previous Art

TurboPower is heavily inspired by CableReady and its operations. This library aims to bring the same level of operation-diversity to Turbo Streams.

Development

To run the test runner:

yarn build
yarn test

Acknowledgments

turbo_power is MIT-licensed open-source software from Marco Roth.

turbo-morph is MIT-licensed open-source software from Marco Roth.

Turbo is MIT-licensed open-source software from Basecamp.

More Repositories

1

turbo_power-rails

Power-pack for Turbo Streams
Ruby
219
star
2

current.js

A tiny 🤏 library (only 410 B) that allows you to access current `<meta>` elements
TypeScript
159
star
3

stimulus-lsp

Intelligent Stimulus tooling for Visual Studio Code and Neovim
TypeScript
127
star
4

gem.sh

Beautiful documentation for any Ruby gem.
Ruby
95
star
5

hotwire.io

Community-driven documentation and resource Hub for Hotwire.
HTML
94
star
6

turbo-morph

Morph action for Turbo Streams
JavaScript
90
star
7

boxdrop

Dropbox Clone built with StimulusReflex
Ruby
76
star
8

formulus

Client-side HTML form validations based on the browser HTML Form Validation API
TypeScript
72
star
9

phlexing

Simple ERB to Phlex converter
Ruby
71
star
10

turbo-ruby

Turbo helpers without the requirement for Rails
Ruby
41
star
11

cable-streams

Extend Turbo Streams with Custom Turbo Stream Actions and CableReady operations
TypeScript
26
star
12

stimulus-parser

Statically analyze Stimulus controllers in your project.
TypeScript
25
star
13

rails7-stimulus-reflex-esbuild

Example StimulusReflex installation using Rails 7 and esbuild
Ruby
24
star
14

stimulus-render

[PoC] HTML rendering mechanism for Stimulus Controllers
TypeScript
18
star
15

type_fusion

Collaborative Ruby type sampling
Ruby
16
star
16

local-time

Modern fork of Basecamp's `local-time`
TypeScript
12
star
17

easy_enum

Turn any Ruby class in an easy to use enum.
Ruby
12
star
18

cable_ready.cr

[WIP] CableReady Crystal port
Crystal
10
star
19

dependabot-bump-together-action

GitHub Action to bump multiple dependencies with dependabot in a single pull request
Ruby
8
star
20

rubocop-stimulus_reflex

Code style checking for StimulusReflex
Ruby
8
star
21

netatmo-ruby

Ruby gem to interact with the Netatmo REST API
Ruby
7
star
22

railsbytes-cli

CLI to apply Railsbytes.com templates to your Rails application
Ruby
7
star
23

cable-streams-rails

Rails companion gem for the `cable-streams` NPM package
Ruby
6
star
24

ShortLook-WhatsApp

Show WhatsApp users' profile pictures in ShortLook when you receive a WhatsApp notification
Objective-C
5
star
25

rubocop-cable_ready

Code style checking for CableReady
Ruby
4
star
26

ShortLook-Bandsintown

Show Bandsintown artists' profile pictures in ShortLook when you receive a Bandsintown notification
Objective-C
4
star
27

shortlook-cli

ShortLook CLI for scaffoling a ShortLook Provider
Ruby
3
star
28

stimulus-blurhash

Stimulus Controller for BlurHash
JavaScript
2
star
29

ShortLook-RocketChat

Show RocketChat users' profile pictures in ShortLook when you receive a RocketChat notification
Objective-C
2
star
30

ShortLook-VK

Show VK users' profile pictures in ShortLook when you receive a VK notification
Objective-C
2
star
31

ShortLook-GitHub

Show GitHub users' profile pictures in ShortLook when you receive a GitHub notification
Objective-C
2
star
32

ShortLook-Line

Show Line users' profile pictures in ShortLook when you receive a Line notification
Objective-C
2
star
33

ShortLook-KakaoTalk

Show KakaoTalk Contact Photos in ShortLook when you receive a KakaoTalk notification
Objective-C
2
star
34

usersnap-stimulus-repro

HTML
1
star
35

rcrdshp-market-extension

Small extension for the RCRDSHP Marketplace
JavaScript
1
star
36

POC2u

Ruby
1
star
37

cable_ready-dsl

[PoC] An opinionated DSL for CableReady.
Ruby
1
star
38

spritpreisrechner-ruby

Ruby Wrapper for the e-control.at Spritpreisrechner HTTP API
Ruby
1
star
39

tankerkoenig-ruby

Ruby Wrapper for the Tankerkoenig API
Ruby
1
star
40

async-websocket-with-inactive-tab

HTML
1
star
41

ShortLook-Mixcloud

Show Mixcloud covers in ShortLook when you receive a Mixcloud notification
Objective-C
1
star
42

stimulus_reflex-form-serialize-app

Ruby
1
star
43

mirrOS_spotify

Modul zum Anzeigen des zurzeit spielenden Track auf Spotify.
PHP
1
star
44

openmensa-parsers

OpenMensa.org parsers
Ruby
1
star
45

ShortLook-LinkedIn

Show LinkedIn users' profile pictures in ShortLook when you receive a LinkedIn notification
Objective-C
1
star
46

ShortLook-Slack

Show Slack users' profile pictures in ShortLook when you receive a Slack notification
Objective-C
1
star
47

ShortLook-SteamChat

Show SteamChat Profile Pictures in ShortLook when you receive a SteamChat notification!
Objective-C
1
star
48

ShortLook-Xing

Show Xing users' profile pictures in ShortLook when you receive a Xing notification
Objective-C
1
star
49

ShortLook-Viber

Show Viber users' profile pictures in ShortLook when you receive a Viber notification
Objective-C
1
star
50

mirrOS_todoist

Dieses mirrOS Modul zeigt deine Aufgaben aus einer Todoist-Liste an.
PHP
1
star