Merge pull request #96 from DDtMM/18.x

Linting fixes

angular.json

@@ -40,7 +40,7 @@
           "builder": "@angular-eslint/builder:lint",
           "options": {
             "lintFilePatterns": [
-              "projects/signal-generators/src/**/*.ts"
+              "projects/**/*.ts"
             ]
           }
         }

projects/demo/src/app/app.component.ts

@@ -31,11 +31,11 @@ import { DEMO_CONFIGURATIONS } from './demo-configuration';
       </ul>
     </div>
     <div class="dropdown dropdown-end flex-none">
-      <label tabindex="0" class="btn btn-primary">
+      <button tabindex="0" class="btn btn-primary">
         <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
         </svg>
-      </label>
+      </button>
       <ul tabindex="0" class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-200 rounded-box w-52">
         <li><a routerLink="/getting-started">Getting Started</a></li>
         <li><a href="./api/index.html">API Docs</a></li>

projects/demo/src/app/controls/demo-host.component.ts

@@ -129,7 +129,7 @@ export class DemoHostComponent {
     if (primaryComponentPattern) {
       const matcherRegex = new RegExp(primaryComponentPattern);
       return (x: SourceFile) => matcherRegex.test(x.name);
-    };
+    }
     return (x: SourceFile) => x.type === 'typescript';
   });
 

projects/demo/src/app/demos/tween-signal/interpolation-demo/interpolation-demo.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, effect } from '@angular/core';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { InterpolateStepFn, sequenceSignal, tweenSignal } from 'projects/signal-generators/src/public-api';
 
 @Component({
@@ -29,10 +29,11 @@ function stringInterpolationFactory(a: string, b: string): InterpolateStepFn<str
         return a;
       case 1:
         return b;
-      default:
+      default: {
         const aProgress = midPoint !== 0 ? Math.min(1, progress / midPoint) : 1;
         const bProgress = midPoint !== 1 ? Math.max(0, (progress - midPoint) / (1 - midPoint)) : 1;
         return a.slice(0, Math.floor((1 - aProgress) * a.length)) + b.slice(0, Math.floor(bProgress * b.length));
+      }
     }
   };
 }

projects/demo/src/app/demos/tween-signal/multiple-numbers-demo/multiple-numbers-demo.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { ChangeDetectionStrategy, Component, effect, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
 import { EasingFn, easeInBack, tweenSignal } from 'projects/signal-generators/src/public-api';
 import { EasingSelectorComponent } from '../shared/easing-selector.component';
 

projects/demo/src/app/demos/tween-signal/simple-demo/simple-demo.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, effect, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
 import { EasingFn, easeInBack , tweenSignal } from 'projects/signal-generators/src/public-api';
 import { EasingSelectorComponent } from '../shared/easing-selector.component';
 

projects/demo/src/app/demos/tween-signal/tween-signal-page.component.ts

@@ -51,13 +51,13 @@ import { SimpleDemoComponent } from './simple-demo/simple-demo.component';
   <app-demo-host name="Simple Value Changes"
     pattern="tween-signal/(simple-demo|shared)"
     hiddenPattern="easing-selector"
-    primaryComponentPattern="demo\.component" >
+    primaryComponentPattern="demo\\.component" >
     <app-simple-demo />
   </app-demo-host>
   <app-demo-host name="Multiple Value Changes"
     pattern="tween-signal/(multiple-numbers-demo|shared)"
     hiddenPattern="easing-selector"
-    primaryComponentPattern="demo\.component" >
+    primaryComponentPattern="demo\\.component" >
     <app-multiple-numbers-demo />
   </app-demo-host>
   <app-demo-host name="Fun with Interpolation" pattern="tween-signal/interpolation-demo/">

projects/demo/src/app/home-demos/debounce-signal-home-demo.component.ts

@@ -16,8 +16,8 @@ import { ContentsClassDirective } from '../controls/contents-class.directive';
     <div class="divider">Example</div>
     <div class="flex flex-col gap-3">
       <div class="flex flex-row gap-3 items-baseline">
-        <label>Input</label>
-        <input type="text" class="input input-bordered input-sm grow" [ngModel]="$debounced()" (ngModelChange)="$debounced.set($event)" />
+        <label for="debounced">Input</label>
+        <input type="text" id="debounced" class="input input-bordered input-sm grow" [ngModel]="$debounced()" (ngModelChange)="$debounced.set($event)" />
       </div>
       <div class="flex flex-row gap-3  leading-8">
         <span>Debounced</span>

projects/demo/src/app/home-demos/filter-signal-home-demo.component.ts

@@ -14,8 +14,8 @@ import { ContentsClassDirective } from '../controls/contents-class.directive';
       <div class="divider">Example</div>
       <div class="flex flex-col gap-3">
         <div class="flex flex-row gap-3 items-baseline">
-          <label>Input</label>
-          <input type="text" class="input input-bordered input-sm grow" [(ngModel)]="$filtered" />
+          <label for="filterSignalHomeDemoInput">Input</label>
+          <input id="filterSignalHomeDemoInput" type="text" class="input input-bordered input-sm grow" [(ngModel)]="$filtered" />
         </div>
         <div class="flex flex-row gap-3  leading-8">
           <span>$filtered</span>

projects/demo/src/app/home-demos/intersection-signal-home-demo.component.ts

@@ -1,5 +1,4 @@
-import { ChangeDetectionStrategy, Component, ElementRef, viewChild } from '@angular/core';
-import { intersectionSignal } from 'projects/signal-generators/src/public-api';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { ContentsClassDirective } from '../controls/contents-class.directive';
 import { HomeBoxComponent } from '../controls/home-box.component';
 import { IntersectionSignalDemoComponent } from '../demos/intersection-signal/intersection-signal-demo/intersection-signal-demo.component';

projects/demo/src/app/home-demos/map-signal-home-demo.component.ts

@@ -15,10 +15,10 @@ import { ContentsClassDirective } from '../controls/contents-class.directive';
       Either a value or multiple signals can be passed and used in the selector function.
     </div>
     <div class="divider">Example</div>
-    <div class="flex flex-col gap-3" (click)="$event.stopPropagation()">
+    <div class="flex flex-col gap-3">
       <div class="flex flex-row gap-3 items-baseline">
-        <label>Input</label>
-        <input type="number" class="input input-bordered input-sm grow" [(ngModel)]="$mapSource" />
+        <label for="mapSignalHomeInput">Input</label>
+        <input #input id="mapSignalHomeInput" type="number" class="input input-bordered input-sm grow" [(ngModel)]="$mapSource" />
       </div>
       <div class="flex flex-row gap-3  leading-8">
         <span>Doubled</span>

projects/demo/src/app/home-demos/reduce-signal-home-demo.component.ts

@@ -15,8 +15,8 @@ import { ContentsClassDirective } from '../controls/contents-class.directive';
       using a reducer function to create a new value from the current and prior values.
     </div>
     <div class="divider">Example</div>
-    <div class="flex flex-row gap-3" (click)="$event.stopPropagation()">
-      <input type="number" class="input input-bordered input-sm grow" [(ngModel)]="$reduceSource" />
+    <div class="flex flex-row gap-3" >
+      <input type="number" class="input input-bordered input-sm grow" [(ngModel)]="$reduceSource" aria-label="Value to be added to running sum" />
       <button type="button" class="btn btn-sm btn-primary" (click)="$reduceSum.set($reduceSource())">Sum</button>
     </div>
     <div class="flex flex-row gap-3  leading-8">

projects/demo/src/app/home-demos/sequence-signal-home-demo.component.ts

@@ -14,7 +14,7 @@ import { ContentsClassDirective } from '../controls/contents-class.directive';
       The Sequence Signal is useful for situations where you want to easily cycle between options.
     </div>
     <div class="divider">Example</div>
-    <div class="flex flex-row gap-3" (click)="$event.stopPropagation()">
+    <div class="flex flex-row gap-3">
       <div class="flex flex-col gap-1">
         <div class="flex flex-row items-center gap-3">
           <input type="radio" class="radio checked:bg-blue-500" value="a" [ngModel]="sequenceChoices()" /> Choice A

projects/demo/src/app/home-demos/storage-signal-home-demo.component.ts

@@ -16,14 +16,14 @@ import { HomeBoxComponent } from '../controls/home-box.component';
       </div>
       <div class="divider">Example</div>
       <div class="flex flex-row gap-3 items-baseline">
-        <label>Input</label>
-        <input type="text" class="input input-bordered input-sm grow" [ngModel]="$storageValue()" (ngModelChange)="$storageValue.set($event)" />
+        <label for="storageSignalHomeDemoInput">Input</label>
+        <input id="storageSignalHomeDemoInput" type="text" class="input input-bordered input-sm grow" [(ngModel)]="$storageValue" />
       </div>
       <div class="italic">Refresh page to see value persist</div>
     </app-home-box>
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class StorageSignalHomeDemoComponent {
-  $storageValue = localStorageSignal('', '_storage_signal_demo');
+  readonly $storageValue = localStorageSignal('', '_storage_signal_demo');
 }

projects/demo/src/app/home-demos/timer-signal-home-demo.component.ts

@@ -15,7 +15,7 @@ import { HomeBoxComponent } from '../controls/home-box.component';
         <div>Time since start</div>
         <div>{{ $timer() }}</div>
       </div>
-      <div class="flex flex-row gap-3 justify-center" (click)="$event.stopPropagation()">
+      <div class="flex flex-row gap-3 justify-center">
         <button type="button" class="btn btn-primary" (click)="$timer.pause()">Pause</button>
         <button type="button" class="btn btn-primary" (click)="$timer.resume()">Resume</button>
         <button type="button" class="btn btn-primary" (click)="$timer.restart()">Restart</button>
@@ -26,5 +26,5 @@ import { HomeBoxComponent } from '../controls/home-box.component';
 })
 export class TimerSignalHomeDemoComponent {
   /** A little delay is added to the timer for hydration. */
-  $timer = timerSignal(1000, 1000);
+  readonly $timer = timerSignal(1000, 1000);
 }

projects/demo/src/app/home-demos/tween-signal-home-demo.component.ts

@@ -13,18 +13,18 @@ import { HomeBoxComponent } from '../controls/home-box.component';
       Tween animations that allow a signal to transform between values over a set duration.
     </div>
     <div class="divider">Example</div>
-    <input type="range" class="range range-primary" [value]="tweenExample()" min="0" max="100" />
-    <div class="flex flex-row gap-3 justify-center" (click)="$event.stopPropagation()">
+    <input type="range" class="range range-primary" [value]="$tween()" min="0" max="100" />
+    <div class="flex flex-row gap-3 justify-center">
       <div class="join">
-        <button type="button" class="btn btn-primary join-item" (click)="tweenExample.set(0)">0%</button>
-        <button type="button" class="btn btn-primary join-item" (click)="tweenExample.set(50)">50%</button>
-        <button type="button" class="btn btn-primary join-item" (click)="tweenExample.set(100)">100%</button>
+        <button type="button" class="btn btn-primary join-item" (click)="$tween.set(0)">0%</button>
+        <button type="button" class="btn btn-primary join-item" (click)="$tween.set(50)">50%</button>
+        <button type="button" class="btn btn-primary join-item" (click)="$tween.set(100)">100%</button>
       </div>
     </div>
   </app-home-box>
   `,
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TweenSignalHomeDemoComponent {
-  readonly tweenExample = tweenSignal(0, { duration: 1000, easing: easeInBounce });
+  readonly $tween = tweenSignal(0, { duration: 1000, easing: easeInBounce });
 }