An exploratory collection of widgets

This is a small collection of very simple web components (widgets). I created them as a means to understand the current state of web component (2022) based on the documentation at Mozilla's MDN website. In each example I've attempt to explore a single aspect of the component. This project is hosted at GitHub at github.com/rsdoiel/widgets.

1. Getting started
   1. A minimal component, this doesn't do much beyond inserting itself into the DOM
   2. A basic component displays a predetermined string as a sub-element. Think of it as a "Hello World" type example.
   3. A counting component. This has a button and a number displayed beside it. Press the button and the value increments.
2. Templated components
   1. A minimal templated component, displays a box styled with the template's CSS.
   2. A digital clock component, displays a digital clock in an oval. Clock updates each second after it is instantiated in the page.
3. Custom element's attributes, innerHTML and events
   1. A person name component uses the attributes in the custom element to format the textContent of the element.
   2. An ORCID component, uses the component's textContent for ORCID identifier
   3. A person input component, set values of input fields via custom element attributes, when the input fields update the custom element attributes update too. Relies on component life cycle.
   4. JavaScript example of person-input-component