-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #54 from DDtMM/17.x
1.4 ready to go.
- Loading branch information
Showing
41 changed files
with
814 additions
and
624 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
10 changes: 10 additions & 0 deletions
10
projects/demo/src/app/controls/contents-class.directive.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import { Directive, HostBinding } from '@angular/core'; | ||
|
|
||
| /** Adds contents to host. */ | ||
| @Directive({ | ||
| selector: '[appContentsClass]', | ||
| standalone: true | ||
| }) | ||
| export class ContentsClassDirective { | ||
| @HostBinding('class.contents') contentsClass: boolean = true; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,33 +1,37 @@ | ||
| import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core'; | ||
| import { ChangeDetectionStrategy, Component, Input, signal } from '@angular/core'; | ||
| import { RouterLink } from '@angular/router'; | ||
| import { SignalGeneratorType, SignalTypeBadgeComponent } from './signal-type-badge.component'; | ||
| import { DEMO_CONFIG_MAP, DemoConfigurationItem, SignalFunctionName } from '../demo-configuration'; | ||
| import { ContentsClassDirective } from './contents-class.directive'; | ||
| import { SignalTypeBadgeComponent } from './signal-type-badge.component'; | ||
|
|
||
|
|
||
| @Component({ | ||
| selector: 'app-home-box', | ||
| standalone: true, | ||
| imports: [RouterLink, SignalTypeBadgeComponent], | ||
| hostDirectives: [ContentsClassDirective], | ||
| template: ` | ||
| <li class="card card-compact bg-base-100 hover:bg-base-200 shadow-lg"> | ||
| <div class="card-body"> | ||
| <h3 class="card-title cursor-pointer" [routerLink]="link"> | ||
| <a class="link" [routerLink]="link">{{name}}</a> | ||
| @for (badgeType of badgeTypes; track badgeType) { | ||
| <app-signal-type-badge [type]="badgeType"/> | ||
| } | ||
| </h3> | ||
| <ng-content></ng-content> | ||
| </div> | ||
| </li> | ||
| @if ($demoConfig(); as demoConfig) { | ||
| <li class="card card-compact bg-base-100 hover:bg-base-200 shadow-lg"> | ||
| <div class="card-body"> | ||
| <h3 class="card-title cursor-pointer" [routerLink]="demoConfig.route"> | ||
| <a class="link" [routerLink]="demoConfig.route">{{demoConfig.name}}</a> | ||
| @for (signalType of demoConfig.signalTypes; track signalType) { | ||
| <app-signal-type-badge [type]="signalType"/> | ||
| } | ||
| </h3> | ||
| <ng-content></ng-content> | ||
| </div> | ||
| </li> | ||
| } | ||
| `, | ||
| changeDetection: ChangeDetectionStrategy.OnPush | ||
| }) | ||
| export class HomeBoxComponent { | ||
| @Input({ required: true }) badgeTypes: SignalGeneratorType[] = []; | ||
| @Input({ required: true }) link: string = ''; | ||
| @Input({ required: true }) name: string = ''; | ||
|
|
||
| @HostBinding('class.contents') contentsClass: boolean = true; | ||
| readonly $demoConfig = signal<DemoConfigurationItem<string> | undefined>(undefined); | ||
|
|
||
| @Input({ required: true }) | ||
| set fnName(value: SignalFunctionName) { | ||
| this.$demoConfig.set(DEMO_CONFIG_MAP[value]); | ||
| } | ||
| } |
32 changes: 19 additions & 13 deletions
32
projects/demo/src/app/controls/signal-header.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,32 +1,38 @@ | ||
| import { CommonModule } from '@angular/common'; | ||
| import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; | ||
| import { SignalGeneratorType, SignalTypeBadgeComponent } from './signal-type-badge.component'; | ||
| import { faFile } from '@fortawesome/free-solid-svg-icons'; | ||
| import { ChangeDetectionStrategy, Component, Input, signal } from '@angular/core'; | ||
| import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; | ||
| import { faFile } from '@fortawesome/free-solid-svg-icons'; | ||
| import { DEMO_CONFIG_MAP, DemoConfigurationItem, SignalFunctionName } from '../demo-configuration'; | ||
| import { SignalTypeBadgeComponent } from './signal-type-badge.component'; | ||
|
|
||
| @Component({ | ||
| selector: 'app-signal-header', | ||
| standalone: true, | ||
| imports: [CommonModule, FontAwesomeModule, SignalTypeBadgeComponent], | ||
| template: ` | ||
| <div class="flex flex-row items-baseline gap-3"> | ||
| <h1>{{name}}</h1> | ||
| <div class="flex flex-row gap-1"> | ||
| @for (type of types; track type) { | ||
| <app-signal-type-badge [type]="type"/> | ||
| @if($demoConfig(); as demoConfig) { | ||
| <h1>{{demoConfig.name}}</h1> | ||
| <div class="flex flex-row gap-1"> | ||
| @for (type of demoConfig.signalTypes; track type) { | ||
| <app-signal-type-badge [type]="type"/> | ||
| } | ||
| </div> | ||
| @if (demoConfig.docUrl) { | ||
| <a class="btn btn-sm btn-warning self-end" [href]="demoConfig.docUrl"><fa-icon [icon]="faFile" /> API Docs</a> | ||
| } | ||
| </div> | ||
| @if (apiPath) { | ||
| <a class="btn btn-sm btn-warning self-end" [href]="apiPath"><fa-icon [icon]="faFile" /> API Docs</a> | ||
| } | ||
| </div> | ||
| `, | ||
| changeDetection: ChangeDetectionStrategy.OnPush | ||
| }) | ||
| export class SignalHeaderComponent { | ||
| readonly $demoConfig = signal<DemoConfigurationItem<string> | undefined>(undefined); | ||
|
|
||
| readonly faFile = faFile; | ||
|
|
||
| @Input({ required: true }) apiPath?: string; | ||
| @Input({ required: true }) name?: string; | ||
| @Input({ required: true }) types: SignalGeneratorType[] = []; | ||
| @Input({ required: true }) | ||
| set fnName(value: SignalFunctionName) { | ||
| this.$demoConfig.set(DEMO_CONFIG_MAP[value]); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,106 @@ | ||
| import { Type } from '@angular/core'; | ||
| import { DebounceSignalComponent } from './home-demos/debounce-signal.component'; | ||
| import { TweenSignalComponent } from './home-demos/tween-signal.component'; | ||
| import { TimerSignalComponent } from './home-demos/timer-signal.component'; | ||
| import { SequenceSignalComponent } from './home-demos/sequence-signal.component'; | ||
| import { ReduceSignalComponent } from './home-demos/reduce-signal.component'; | ||
| import { MapSignalComponent } from './home-demos/map-signal.component'; | ||
| import { LiftSignalComponent } from './home-demos/lift-signal.component'; | ||
| import { FilterSignalComponent } from './home-demos/filter-signal.component'; | ||
| import { ExtendSignalComponent } from './home-demos/extend-signal.component'; | ||
|
|
||
| /** What type of signals are returned from signal factory functions. */ | ||
| export type SignalType = 'writableSignal' | 'generator'; | ||
|
|
||
| export interface DemoConfigurationItem<FnName extends string> { | ||
| readonly component: Type<unknown>, | ||
| /** The url to the docs from the root. */ | ||
| readonly docUrl: string; | ||
| /** Function name to generate signal. Acts as distinct key. */ | ||
| readonly fnName: FnName; | ||
| /** Display name */ | ||
| readonly name: string; | ||
| /** The route from the root of the app. */ | ||
| readonly route: string; | ||
| readonly signalTypes: SignalType[]; | ||
| } | ||
|
|
||
| export const DEMO_CONFIGURATIONS = [ | ||
| { | ||
| component: DebounceSignalComponent, | ||
| docUrl: './api/functions/debounceSignal.html', | ||
| fnName: 'debounceSignal' as const, | ||
| name: 'Debounce', | ||
| route: 'debounce-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| }, | ||
| { | ||
| component: ExtendSignalComponent, | ||
| docUrl: './api/functions/extendSignal.html', | ||
| fnName: 'extendSignal' as const, | ||
| name: 'Extend', | ||
| route: 'extend-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| }, | ||
| { | ||
| component: FilterSignalComponent, | ||
| docUrl: './api/functions/filterSignal-1.html', | ||
| fnName: 'filterSignal' as const, | ||
| name: 'Filter', | ||
| route: 'filter-signal', | ||
| signalTypes: ['writableSignal'] | ||
| }, | ||
| { | ||
| component: LiftSignalComponent, | ||
| docUrl: './api/functions/liftSignal.html', | ||
| fnName: 'liftSignal' as const, | ||
| name: 'Lift', | ||
| route: 'lift-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| }, | ||
| { | ||
| component: MapSignalComponent, | ||
| docUrl: './api/functions/mapSignal-1.html', | ||
| fnName: 'mapSignal' as const, | ||
| name: 'Map', | ||
| route: 'map-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| }, | ||
| { | ||
| component: ReduceSignalComponent, | ||
| docUrl: './api/functions/reduceSignal-1.html', | ||
| fnName: 'reduceSignal' as const, | ||
| name: 'Reduce', | ||
| route: 'reduce-signal', | ||
| signalTypes: ['writableSignal'] | ||
| }, | ||
| { | ||
| component: SequenceSignalComponent, | ||
| docUrl: './api/functions/sequenceSignal-1.html', | ||
| fnName: 'sequenceSignal' as const, | ||
| name: 'Sequence', | ||
| route: 'sequence-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| }, | ||
| { | ||
| component: TimerSignalComponent, | ||
| docUrl: './api/functions/timerSignal-1.html', | ||
| fnName: 'timerSignal' as const, | ||
| name: 'Timer', | ||
| route: 'timer-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| }, | ||
| { | ||
| component: TweenSignalComponent, | ||
| docUrl: './api/functions/tweenSignal-1.html', | ||
| fnName: 'tweenSignal' as const, | ||
| name: 'Tween', | ||
| route: 'tween-signal', | ||
| signalTypes: ['generator', 'writableSignal'] | ||
| } | ||
| ] satisfies DemoConfigurationItem<string>[]; | ||
|
|
||
| export type SignalFunctionName = typeof DEMO_CONFIGURATIONS[number]['fnName']; | ||
|
|
||
| export const DEMO_CONFIG_MAP = DEMO_CONFIGURATIONS.reduce((prior, cur) => ({ ...prior, [cur.fnName]: cur}), | ||
| {} as Record<SignalFunctionName, DemoConfigurationItem<SignalFunctionName>>) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.