Stimulus Components

Craft world-class Stimulus controllers with your own styles

Over 25 Stimulus controllers with built-in behavior, top-tier documentation, designed for easy extension, and ready for your styles to solve every day frontend problems.

Character Counter

There are characters in this textarea.

Checkbox Select All

Clipboard

Dropdown

Password Visibility

Completely unstyled, UI-agnostic

Stimulus Components is not a single installable library. Instead, it offers a collection of standalone controllers that you can integrate as needed.
Completely UI-agnostic, it works seamlessly with any CSS framework, including custom ones.

Install the package

Terminal
$ yarn add @stimulus-components/clipboard

Import it in your application

app/javascript/controllers/index.js
import { Application } from "@hotwired/stimulus"
import Clipboard from "@stimulus-components/clipboard"

const application = Application.start()
application.register("clipboard", Clipboard)

Import your design

index.html
<div
  data-controller="clipboard"
  data-clipboard-success-content-value="<strong>Copied!</strong>"
  class="mt-1 flex rounded-md shadow-sm"
>
  <input
    type="text"
    value="https://www.timecop-app.com/register"
    data-clipboard-target="source"
    readonly
    class="py-3 px-2 outline-none flex-1 block rounded-none rounded-l-md sm:text-sm border border-gray-300"
  />

  <button
    type="button"
    data-action="clipboard#copy"
    data-clipboard-target="button"
    class="inline-flex items-center gap-1 px-3 focus:outline-none rounded-r-md border border-l-0 border-gray-300 bg-gray-50 text-gray-500 text-sm"
  >
    Copy to clipboard
  </button>
</div>
Safari

Invite your team

View the people on your team. Invite new team members to join, and set permissions for each team member.

Numbers speak for themselves

Stimulus Components is already used by hundreds of developers and many companies.

Components
25+
Contributors
15+
Downloads last year
7,428,000+

Versatile and modular components for every need

Stimulus Components provides a flexible API that allows you to control the level of detail to your preference. Begin with high-level components featuring built-in DOM structures, and extend the controllers as needed to tailor their behavior.

  • Auto Submit

    Auto Submit

    A Stimulus controller to auto-submit forms.

    Auto Submit
  • Character Counter

    Character Counter

    A Stimulus controller that counts the number of characters in any input fields.

    Character Counter
  • Chartjs

    Chartjs

    A Stimulus controller to deal with chart.js.

    Chartjs
  • Checkbox Select All

    Checkbox Select All

    A Stimulus controller for managing checkbox lists.

    Checkbox Select All
  • Clipboard

    Clipboard

    A Stimulus controller to copy text to clipboard.

    Clipboard
  • Dialog

    Dialog

    A Stimulus controller to show modals with the native Dialog element.

    Dialog
  • Dropdown

    Dropdown

    A Stimulus controller to create a dropdown.

    Dropdown
  • Password Visibility

    Password Visibility

    A Stimulus controller to change a password input visibility.

    Password Visibility
  • Rails Nested Form

    Rails Nested Form

    A Stimulus controller to create new fields on the fly to populate your Rails relationship with accepts_nested_attributes_for.

    Rails Nested Form

Sponsors

Stimulus Component is an MIT licensed open source project and completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing. You can support Stimulus Components development on GitHub Sponsors.

Become a sponsor
SpendHQ
Maybe
Avo
Studio HB
SearchApi
Dilolabs

Testimonials

See what other developers are saying about it!

“All controllers originate from real-world applications that addressed common problems faced by nearly everyone.”

Guillaume Briday
Creator of Stimulus Components

“They’re lightweight, can be pulled in individually and solve a problem… it would be a disservice to our clients NOT to use them.”

Matt Polito
Senior Engineer at Hashrocket

“Stimulus Components are indispensable libraries for common UI patterns that are expertly developed and maintained.”

Avi Flombaum
Co-founder of Flatiron School

“High-quality, pre-made stimulus controllers that solve my most common problems? I’m in love!”

Ryan Weaver
Writer for SymfonyCasts & Symfony core member

“Just used my first component today for https://urbanhunt.co 🎉 Super easy to integrate and got nested forms working in 10 minutes. Thanks!”

Mike Holford
Developer / Maker

“From time to time I need to apply a common pattern that I haven't yet built with Stimulus. Stimulus Components has it already! The components are polished, easy to implement, and the docs are great!”

Adrian Marin
Creator of @avo_hq

“Inspiring and smart stimulus controllers that will get you a head start, a great toolbox for any sensible developer!”

Adrian Siami
Open source contributor

“Stimulus Components has become an essential tool in our daily workflow. Its ease of use, adaptability, and pre-built features save us time while enabling us to deliver outstanding interactivity for our clients.”

Laurent Buffevant
Co-founder of Studio HB

“Why reinvent the wheel? Stimulus Components are time saving and easy to integrate. We use them in almost all of our Rails projects at Dilolabs.”

Cyril Blaecke
Founder of Dilolabs

“Don't reinvent the wheel. Use Stimulus Components. I use them in all my projects.”

Yaroslav Shmarov
Founder of SupeRails.com

Special sponsor

Simplify your time tracking with Timecop

Timecop is a time tracking app that brings simplicity in your day to day life.

App screenshot

Contributing

Do not hesitate to contribute to the project by adapting or adding features!

Bug reports or pull requests are welcome.

Don't forget to drop a 🌟 on Github
to support the project!