Anchor ViewComponents

ViewComponents for Buoy’s Anchor Design System.

Dependencies

• Stimulus

Installation

1. Add anchor_view_components to your Gemfile and install:

   bundle add anchor_view_components && bundle install
   

2. Add @buoysoftware/anchor-view-components to your package.json and install:

   yarn add @buoysoftware/anchor-view-components && yarn
   

3. Add Anchor’s CSS to your application layout:

   <%= stylesheet_link_tag "anchor-view-components" %>
   

4. Import Anchor’s Stimulus controllers and register them:

   import { registerAnchorControllers } from "@buoysoftware/anchor-view-components";
   
   registerAnchorControllers(application);
   

5. Optionally, if you need Anchor’s Tailwind configuration to use its colors, fonts, and other design system values, add the following to your project’s tailwind.config.js:

   presets: [require("@buoysoftware/anchor-view-components/tailwind.config.js")]
   

Development

Install dependencies:

yarn install

bundle install

Previewing components

To see component previews:

• Run yarn build:css --watch in the root of the project
• Go to the demo/ directory, install dependencies, and run bin/dev
• See the components at http://localhost:3000

Using local changes in another application (i.e. BuoyRails)

• Run yarn build:css --watch
• In target app, update the Gemfile to point to the this checked out directory
  • gem "anchor_view_components", path: "../anchor_view_components"
• In target app, update the Package.json to point to the this checked out directory
  • "@buoysoftware/anchor-view-components": "file:../anchor_view_components"
• Run bundle install && yarn install
• Start or restart App and now all changes should reflect immediately

Releasing

See RELEASING.md

License

The gem is available as open source under the terms of the MIT License.