Skip to main content

Introduction

Atomic Elements is a set of fundemental React components for use within Atomic Jolt.

Atomic Elements is built on top of the React Aria library, which provides a set of hooks and components for building accessible UIs.

Goals

Consistency

To maintain consistency across our applications, it is imperative that they all utilize the same fundamental components, including inputs, buttons, modals, and more. Presently, each of these applications has its own implementations of these components, each with slightly varying approaches and objectives. This library is designed to replace these disparate components with versatile alternatives that can seamlessly adapt to any context. This streamlining process is aimed at facilitating the transition for developers when moving between different applications.

Moreover, this site will act as a "single source of truth" for understanding the utilization of these components within any application where they are employed.

Efficiency

Given that many components are duplicated across several applications, redundant effort has been expended in their creation. Even when a component was initially copied from one application to another, any subsequent updates to the component can be a significant inconvenience, necessitating changes in multiple locations. By centralizing these components within a library, updates need to be made only once, and every application can subsequently integrate the updated dependency as needed.

Accessibility

Atomic Elements is committed to ensuring that every single one of its components is fully accessible. This not only benefits users with accessibility needs but also relieves developers from the burden of constantly ensuring accessibility on their own. Whenever a component requires specific properties for accessibility purposes, these requirements will be meticulously documented within the component's accompanying documentation.

Built with Atomic Elements