Blocks

Installation

Get shadcnrb running in your Rails 8 app.

1. Add the gem

# Gemfile
group :development do
  gem "shadcn-rb", github: "accountaim/shadcn-rb"
end
bundle install

2. Run the installer

bin/rails g shadcnrb:install

The installer touches a handful of files — everything lands in your app, version-controlled, owned by you.

Gemfile                                    ← + tailwind_merge (sole universal runtime dep)
config/
├── initializers/shadcnrb.rb               ← created: Zeitwerk root + assets path + sui view helper
└── importmap.rb                           ← + pin_all_from for co-located Stimulus controllers
app/
├── javascript/controllers/index.js        ← stock Stimulus eager-load setup (if absent)
├── assets/tailwind/
│   ├── application.css                    ← tailwind import + @source globs + @import themes
│   └── shadcnrb_themes.css                ← created: oklch tokens, .dark overrides, .theme-* presets
└── components/shadcnrb/                   ← created
    ├── builder.rb                         ← your subclass of Shadcnrb::BaseBuilder
    ├── base_builder.rb                    ← infra
    ├── component_base.rb                  ← infra
    ├── tailwind_merge.rb                  ← infra
    ├── view_helpers.rb                    ← infra (provides `sui`)
    ├── icon/
    │   ├── component.rb                   ← Shadcnrb::Icon::Component
    │   └── icons/*.svg                    ← bundled lucide SVGs
    ├── <component>/
    │   ├── component.rb                   ← Shadcnrb::<Component>::Component
    │   ├── style.rb                       ← Tailwind class strings
    │   └── component_controller.js        ← co-located Stimulus controller, if any
    └── styles/                            ← optional: Shadcnrb::Styles::* subclasses

Exact diff: harness…adopt-patch — this repo keeps main at four commits so the adoption change is one GitHub compare view.

The installer also auto-runs shadcnrb:component icon so sui.icon(:check) works immediately.

3. Install components

bin/rails g shadcnrb:component button
bin/rails g shadcnrb:component dialog
bin/rails g shadcnrb:component sidebar

Each component copies the whole lib/shadcnrb/<name>/ dir (Ruby module + sibling *_controller.js, if any) into app/components/shadcnrb/<name>/ and appends an include line to your Shadcnrb::Builder. Stimulus picks the controller up via the pin_all_from in config/importmap.rb under the identifier shadcnrb--<name>--component.

4. Use them

<%= sui.button "Save", variant: :default %>

That's it. See the sidebar for per-component docs and live examples.

Requirements

  • Ruby ≥ 3.2
  • Rails ≥ 7.1 (Rails 8 recommended)
  • Tailwind CSS v4
  • importmap-rails (default for Rails 8)