Link
Examples and documentation are available here: https://arth-shukla.github.io/my-icons-documentation/
Technologies Used
Web Development: React, TypeScript, Storybook, SCSS
DevOps: Git, GitHub Packages
Development Standards: Web Content Accessibility Guidelines (WCAG) 2.1, Aria Authoring Practices Guide (APG)
Description and Motivation
This is a component library for my simple icon animations. I recently migrated the component library to the npm registry: https://www.npmjs.com/package/@arth-shukla/arth-components. The older version is still maintained on GitHub Packages here: https://github.com/arth-shukla/my-icons/pkgs/npm/my-icons.
Since I will likely use these components across multiple projects, I made a library so I don't have to port the same components to each new project.
Features
- Supports computer, mobile, and tablet web interfaces through webkit
- Written in Typescript
- Prop typing allows for easier debugging in projects
- Components usable in both Typescript and standard React projects
- Accessible
- The components themselves support keyboard control and aria tags are added where appropriate.
- Additional acessibility options (e.g.
aria-labels) must be passed as props.
- Customizable
- Additional props (ids, classNames, etc) can be passed into the component to override default styling.
Related Projects
Demos and documentation for the above library are available here: https://arth-shukla.github.io/my-icons-documentation/.
A real project where I've used some of these components is this DnD Dice Roller: https://arth-shukla.github.io/dice-roller/.