Rivet 2.0.0 release

The Rivet team is excited to announce that we have released Rivet 2.0.0. 🎉

This marks the first production release of Rivet 2, the next generation of Indiana University’s design system.

What is Rivet 2? #

Rivet 2 is a collection of templates, components, tools, and guidelines for designing digital interfaces at IU.

By creating a common toolkit and set of standards for designers and developers, we can help ensure a more consistent experience across all of our digital properties, including websites, apps, email, and digital signs.

Rivet can also help teams create better products more quickly, as much of the work when it comes to usability, accessibility, and branding has already been done for them.

You can learn more about Rivet or start using the design system.

What’s new in Rivet 2? #

Rivet 2 features a number of enhancements over the previous version, including:

• An expanded collection of components, including several new components designed for marketing and informational sites
• Starter layouts for many page types common across IU’s web space
• Design tokens for developers creating Rivet-like interfaces in third-party products
• A Figma library for designers creating static mockups
• An updated look to align with the university’s refreshed brand

Important changes in this release #

There are two important changes in the 2.0.0 release of Rivet: the prefix for custom event names has been updated, and the modal component is now the dialog component.

In both cases, you’ll need to update your code accordingly in projects where you’ve used the Rivet 2 beta.

Changes to prefix for custom event names

Previously, the names of all custom events emitted by Rivet components were given the rvt: prefix. As of this newest release, the prefix is now just rvt. For example, rvt:accordionOpened is now rvtAccordionOpened.

The colon character was omitted as it could potentially cause issues with frontend frameworks that define event handlers or data bindings as HTML attributes.

Dialog component

The modal component has been renamed the dialog component. This was done to better align the component with the native HTML dialog element.

In addition to the new name, a number of new configuration options have been added to the dialog component. These new configuration options are intended to help you fine-tune a dialog’s appearance and behavior to cover more use cases, such as notifications or help widgets.

Updated wiki #

The Rivet wiki on GitHub has been updated to reflect the release of Rivet 2.

This wiki outlines the Rivet team’s project management process, describing how we do things like maintain the backlog, prioritize issues, solicit community feedback, and release updates.

Rivet 1 migration and end of life #

With the release of Rivet 2, Rivet 1 is now deprecated.

You are encouraged to begin migrating your applications to Rivet 2. See the migration guide to learn more about moving from Rivet 1 to Rivet 2.

Rivet 1 will officially reach end of life in Q4 2023. For more information, see the Rivet 1 end-of-life timeline.

Leaving feedback #

To leave feedback on Rivet, post a comment to our GitHub Discussions board, file a bug report, or send a message to rivet@iu.edu.

You can also communicate with the Rivet team and other users of the design system on Slack:

• Web Community of Practice Slack
• UITS Slack

Get updates about Rivet #

To receive updates about Rivet’s development, join the Rivet mailing list.

For specific details about each release, see the Rivet changelog.

Acknowledgements #

We would like to extend our gratitude to a number of teams who provided valuable testing and feedback during Rivet 2’s development.

In particular, we’d like to thank the teams within IU Studios and Enterprise Systems, the Digital Accessibility Office, the Core Properties team, and the OVPUE web development team.