{"id":17730741,"url":"https://github.com/michelson/rails-ui","last_synced_at":"2025-09-30T07:31:39.506Z","repository":{"id":258767704,"uuid":"867944445","full_name":"michelson/rails-ui","owner":"michelson","description":"A collection of components based on Ruby ViewComponent \u0026 Stimulus, heavily inspired by shadcn/ui","archived":false,"fork":false,"pushed_at":"2024-10-20T23:35:12.000Z","size":39568,"stargazers_count":32,"open_issues_count":1,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-17T20:49:33.875Z","etag":null,"topics":["rails","stimulusjs","ui","uikit"],"latest_commit_sha":null,"homepage":"https://rails-ui-9389388c40ad.herokuapp.com/rails_ui","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/michelson.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"MIT-LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-10-05T04:23:09.000Z","updated_at":"2025-01-15T00:57:45.000Z","dependencies_parsed_at":"2024-10-21T21:02:47.551Z","dependency_job_id":null,"html_url":"https://github.com/michelson/rails-ui","commit_stats":null,"previous_names":["michelson/rails-ui"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/michelson%2Frails-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/michelson%2Frails-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/michelson%2Frails-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/michelson%2Frails-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/michelson","download_url":"https://codeload.github.com/michelson/rails-ui/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234715615,"owners_count":18875905,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["rails","stimulusjs","ui","uikit"],"created_at":"2024-10-25T22:02:36.633Z","updated_at":"2025-09-30T07:31:34.061Z","avatar_url":"https://github.com/michelson.png","language":"HTML","funding_links":[],"categories":["Components \u0026 Libraries","HTML"],"sub_categories":[],"readme":"# RailsUi\n\nRailsUi is a collection of UI components for Rails, heavily inspired by [shadcn-ui/ui](https://github.com/shadcn-ui/ui) but specifically built for Rails using ERB templates and ViewComponents.\n\n## Why ERB?\n\nWe chose ViewComponents because they embrace ERB, which aligns with the traditional Rails approach and offers a familiar, straightforward syntax while providing a way to structure atomized and testable components. While other alternatives like the great Phlex library or even raw helper are great, we opted for ViewComponents as we can have a higher level to maintain components as Ruby objects for readability and ease of use while keeping ERB support right in.\n\nvisit: [demo](https://rails-ui-9389388c40ad.herokuapp.com/rails_ui)\n\n## Usage\n\nRailsUi is currently in alpha, and the components are designed to be copied directly into your Rails application. Each component follows the ViewComponent contrib sidecar approach, meaning that all files related to a specific component are organized in their own folder, making it easy to manage and customize.\n\n\u003e A direct integration can be done too, docs coming soon, in any case the ./test/dummy app is an example on how we integrate the components in an automatic way.\n\n## CLI, \n\u003e generator to copy the components will be available soon. But you call the components directly or by copy them after mount the app.\n\n## Mountable app.\n\nTo get the catalog of components you can mount the app in your router:\n\u003e mount RailsUi::Engine =\u003e \"/rails_ui\"\n\n\n## Tailwind support\n\nCheck the [Tailwind config example from test app](https://github.com/michelson/rails-ui/blob/main/test/dummy/config/tailwind.config.js)\n\n\n\n## Installation\nAdd this line to your application's Gemfile:\n\n```ruby\ngem \"rails_ui\"\n```\n\nAnd then execute:\n```bash\n$ bundle\n```\n\nOr install it yourself as:\n```bash\n$ gem install rails_ui\n```\n\n## Run Development Mode\n\n### Install Dependencies in Dummy App\nTo set up the dummy app used for development, run:\n```bash\n./bin/setup\n```\n\n### Run Dummy App\nTo run the dummy app:\n```bash\n./bin/dev\n```\n\n\n# Examples: \n\n\n## Avatar \n```erb\n\u003c%= render(RailsUi::Avatar::Component.new(alt: 'John Doe')) %\u003e\n```\n\n## Button\n\n\n```erb\n  \u003c%= render(RailsUi::Button::Component.new(variant: :secondary, size: :lg)) { \"Secondary Large Button\" }\n  %\u003e\n```\n\n```erb\n\u003c%= render(RailsUi::ComponentPreview::Component.new(title: \"Button with Icon\")) do |component| %\u003e\n  \u003c% component.with_example do %\u003e\n    \u003c%= render(RailsUi::Button::Component.new) do |component| %\u003e\n      \u003c% component.icon do %\u003e\n        \u003csvg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5 mr-2\" viewBox=\"0 0 20 20\" fill=\"currentColor\"\u003e\n          \u003cpath fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-8.707l-3-3a1 1 0 00-1.414 1.414L10.586 9H7a1 1 0 100 2h3.586l-1.293 1.293a1 1 0 101.414 1.414l3-3a1 1 0 000-1.414z\" clip-rule=\"evenodd\" /\u003e\n        \u003c/svg\u003e\n      \u003c% end %\u003e\n      Button with Icon\n    \u003c% end %\u003e\n  \u003c% end %\u003e\n```\n\n## Contributing\nFeel free to use, fork and improve this project.\n\n## License\nThe gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmichelson%2Frails-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmichelson%2Frails-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmichelson%2Frails-ui/lists"}