Add some comments

src/components/time-period.component.ts

@@ -10,6 +10,10 @@ import {
 import { ClassInfo, classMap } from 'lit-html/directives/class-map';
 import { Period } from '../types';
 
+/**
+ * Renders a Time Period selector with an input for a value and two arrows for step-chaning
+ * the value up and down.
+ */
 @customElement('time-period')
 export class TimePeriodComponent extends LitElement {
   static readonly EVENT_TOGGLE = 'toggle';

src/components/time-unit.component.ts

@@ -10,6 +10,9 @@ import {
 import { TimeUnit } from '../models/time-unit';
 import { Direction } from '../types';
 
+/**
+ * Renders an AM/PM picker.
+ */
 @customElement('time-unit')
 export class TimeUnitComponent extends LitElement {
   static readonly EVENT_UPDATE = 'update';

src/models/hour.ts

@@ -2,6 +2,9 @@ import { DEFAULT_HOUR_STEP } from '../const';
 import { HourMode } from '../types';
 import { TimeUnit } from './time-unit';
 
+/**
+ * Represents the hour value of a datetime.
+ */
 export class Hour extends TimeUnit {
   private static readonly VALUE_LIMIT = 24;
 

src/models/minute.ts

@@ -1,6 +1,9 @@
 import { DEFAULT_MINUTE_STEP } from '../const';
 import { TimeUnit } from './time-unit';
 
+/**
+ * * Represents the minute value of a datetime.
+ */
 export class Minute extends TimeUnit {
   private static readonly VALUE_LIMIT = 60;
 

src/models/time-unit.ts

@@ -1,8 +1,11 @@
 import { Direction } from '../types';
 
+/**
+ * Represents a single unit of a datetime oobject - e.g. hours or minutes.
+ */
 export abstract class TimeUnit {
   /**
-   * Return true if the valueStr can be set as a value of this instance.
+   * Whether {@param valueStr} can be set as a value of this instance.
    */
   protected abstract isValidString(valueStr: string): boolean;
 
@@ -23,28 +26,36 @@ export abstract class TimeUnit {
     return this._value;
   }
 
+  /**
+   * Sets a value from {@param stringValue}, if it can be parsed and is valid.
+   * @param stringValue
+   */
   setStringValue(stringValue: string): void {
     if (this.isValidString(stringValue)) {
       this.setValue(parseInt(stringValue));
     }
   }
 
+  /**
+   * Updates the value in {@param direction} by the step size specified in the constructoor.
+   * @param direction
+   */
   stepUpdate(direction: Direction): void {
     direction === Direction.UP ? this.increment() : this.decrement();
   }
 
-  increment(): void {
+  toString(): string {
+    return this.value < 10 ? `0${this.value}` : this.value.toString();
+  }
+
+  private increment(): void {
     this.setValue(this.value + this._step);
   }
 
-  decrement(): void {
+  private decrement(): void {
     this.setValue(this.value - this._step);
   }
 
-  toString(): string {
-    return this.value < 10 ? `0${this.value}` : this.value.toString();
-  }
-
   protected setValue(newValue: number): void {
     if (newValue >= this._limit || newValue < 0) {
       newValue = (newValue + this._limit) % this._limit;