Matestack Ui Core
AboutMatestack Ui CoreMatestack Ui VueJsMatestack Ui Bootstrap
2.1
2.1
  • Welcome
  • Migrating from 1.x to 2.0
  • Getting started
    • Installation & Update
    • Concepts & Rails Integration
    • Tutorial
    • Support & Feedback [WIP]
    • Common Issues [WIP]
  • HTML implemented in pure Ruby
    • Overview
    • HTML Rendering
    • Components
      • Component API
      • Component Registry
      • Components on Rails views
    • Pages
      • Page API
      • Rails Controller Integration
    • Apps
      • App API
    • Reusing Rails Views or Partials
  • Built-in Reactivity composed in pure Ruby
    • Overview
    • Emit Client Side Events
      • Onclick Component API
    • Toggle UI States
      • Toggle Component API
    • Call Server Side Actions
      • Overview
      • Action Component API
    • Reactive Forms
      • Overview
      • Form Component API
      • Input Component API
      • Textarea Component API
      • Checkbox Component API
      • Select Component API
      • Radio Component API
      • Nested Forms
    • Partial UI Updates
      • Overview
      • Async Component API
      • Cable Component API
      • Isolated Component API
    • Page Transitions
      • Overview
      • Transition Component API
    • Reactive Collections
      • Overview
      • Collection Component API [WIP]
  • Custom Reactivity implemented in Vue.js
    • Custom Vue.js Components
    • Third party Vue.js components [WIP]
    • Matestack's Vue.js APIs [WIP]
    • Matestack's Vuex API [WIP]
  • Integrations
    • Action Cable
    • Devise
    • Authorization [WIP]
    • CSS Frameworks [WIP]
    • Third Party JavaScript [WIP]
    • Third Party Ruby Gems [WIP]
  • Matestack Addons
    • Create your own Addon [WIP]
  • Testing
    • Capybara & Rspec
  • Community
    • Discord
    • Contribute [WIP]
  • About
    • Core Team
    • Sponsoring [WIP]
    • Legal Details [WIP]
Powered by GitBook
On this page

Was this helpful?

Edit on GitHub
  1. HTML implemented in pure Ruby
  2. Components

Component Registry

Since version 2.0.0, components do not need to be registered anymore but can be called via an alias method defined in a Ruby module like:

By default, components can be called directly like Components::Card.(title: "foo", body: "bar") which will return the desired HTML string.

If desired, you can create alias methods in order to avoid the class call syntax:

app/matestack/components/registry.rb
module Components::Registry

  def card(text=nil, options=nil, &block)
    Components::Card.(text, options, &block)
  end

  #...

end

which then allows you to call the card component like card(title: "foo", body: "bar") if the above shown module is included properly.

As this is just a plain Ruby module, you need to include it in all contexts you want to use the alias method (unlike the registry prior to 2.0.0). It's a good idea to create your own ApplicationPage, ApplicationComponent and ApplicationApp as base classes for your pages, components ans apps. In there, you include your component registry module(s) only once and have access to the alias methods in all child classes:

app/matestack/appplication:page.rb
class ApplicationPage < Matestack::Ui::Page

  include Components::Registry

end
app/matestack/appplication:component.rb
class ApplicationComponent < Matestack::Ui::Component

  include Components::Registry

end
app/matestack/application:app.rb
class ApplicationApp< Matestack::Ui::App

  include Components::Registry

end
PreviousComponent APINextComponents on Rails views

Last updated 3 years ago

Was this helpful?