The goal for this project was to build a framework-agnostic package that supports the ArcGIS authentication workflow for JavaScript and/or TypeScript web applications. My task was to research and create a prototype for “arcgis-account-manager-ui,” a web component that supports a UI implementation built in Calcite Components.

My first task was to prove the concept that we can build web components dependent upon the Calcite Design System, more commonly known as Calcite Components, which supports all frameworks, including React. Calcite Components is built using Stencil.js, a “library for building reusable, scalable component libraries,” which seemed promising for creating a framework-agnostic web component. After compiling and presenting a research document, I was able to create two sample web components dependent upon Calcite:

I then designed Figma protypes of the different components, which I have decided to sort into AccountTile, AccountManager, and AccountPreview. These components are based off the now deprecated Calcite-React components, and have configurable properties that are either unique to the new, more encompassing component, or are exposed from the existing calcite components they are dependent upon.

Special thanks to Brandon Lammey, Lillie Bahrami, and Josh Peterson!