Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 94d8b02

Browse files
authored
Merge branch 'main' into reintro-accumulate-observable
2 parents 7406ec6 + 8854f4a commit 94d8b02

File tree

86 files changed

+2058
-932
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

86 files changed

+2058
-932
lines changed

README.md

Lines changed: 41 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
[![rx-angular logo](https://raw.githubusercontent.com/rx-angular/rx-angular/main/docs/images/rx-angular_logo.png)](https://www.rx-angular.io/)
2+
13
# RxAngular ![rx-angular CI](https://github.com/rx-angular/rx-angular/workflows/rx-angular%20CI/badge.svg?branch=main)
24

35
RxAngular offers a comprehensive toolset for handling fully reactive Angular applications with the main focus on runtime
@@ -13,7 +15,44 @@ Used together, you get a powerful tool for developing high-performance angular a
1315

1416
This repository holds a set of helpers to create **fully reactive** as well as **fully zone-less** applications.
1517

16-
[![rx-angular logo](https://raw.githubusercontent.com/rx-angular/rx-angular/main/docs/images/rx-angular_logo.png)](https://www.rx-angular.io/)
18+
## Benefits
19+
20+
- 🔥 It's fast & performance focused: exceptional runtime speed & small bundle size
21+
- ✔ Easy upgrade paths: migration scripts included since beta! `ng update @rx-angular/{cdk | template | state}`
22+
- ✔ Lean and simple: No boilerplate guaranteed
23+
- ✔ Well typed and tested
24+
- ✔ Backwards compatible: support for Angular > v11
25+
26+
> **❗ Warning**
27+
> Expect no migration scripts for any change in `experimental` folders
28+
## Used by
29+
<table style="width:100%">
30+
<tr>
31+
<td><img src="https://clickup.com/landing/images/logo-clickup_color.svg"></td>
32+
<td><img src="https://media-exp1.licdn.com/dms/image/C4D0BAQEexCZaCyeDYg/company-logo_200_200/0/1626433899897?e=1652918400&v=beta&t=zjTJehE51V39-IaRRaaK_uBzLqcdTr2wsm7YpLLleUQ"></td>
33+
<td><img src="https://avatars.githubusercontent.com/u/1733746?s=200&v=4"></td>
34+
</tr>
35+
<tr>
36+
<th>Large scale application</th>
37+
<th>Medium size project</th>
38+
<th>Small project</th>
39+
</tr>
40+
<tr>
41+
<td>
42+
Url: https://clickup.com <br/>
43+
Platforms: Web
44+
</td>
45+
<td>
46+
Url: https://get.tapeapp.com<br/>
47+
Platforms: Web, Mobile (ionic)
48+
</td>
49+
<td>
50+
Url: https://angular-movies-a12d3.web.app<br/>
51+
Platforms: Web
52+
</td>
53+
</tr>
54+
</table>
55+
1756
## Links
1857

1958
- [📚 Official docs](https://www.rx-angular.io/)
@@ -25,7 +64,7 @@ Find details in the linked readme files below for installation and setup instruc
2564

2665
- [📦@rx-angular/cdk](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/README.md) - Component Development Kit
2766
- [📦@rx-angular/state](https://github.com/rx-angular/rx-angular/tree/main/libs/state/README.md) - Imperative&Reactive Component State-Management
28-
- [📦@rx-angular/template](https://github.com/rx-angular/rx-angular/tree/main/libs/template/README.md) - High-Performance Reactive Rendering
67+
- [📦@rx-angular/template](https://github.com/rx-angular/rx-angular/tree/main/libs/template/README.md) - High-Performance Non-Blocking Rendering
2968

3069
## Browsers support
3170

apps/demos/src/app/app-shell/app-shell.module.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,16 @@ import { MatSelectModule } from '@angular/material/select';
88
import { MatSidenavModule } from '@angular/material/sidenav';
99
import { MatToolbarModule } from '@angular/material/toolbar';
1010
import { RouterModule } from '@angular/router';
11-
import { AppShellHeaderContent, AppShellSidenavContent, AppShellSidenavTitle } from './app-shell-content.directives';
11+
import {
12+
AppShellHeaderContent,
13+
AppShellSidenavContent,
14+
AppShellSidenavTitle,
15+
} from './app-shell-content.directives';
1216
import { AppShellComponent } from './app-shell-component/app-shell.component';
1317
import { AppShellSideNavItemDirective } from './side-nav/side-nav-item.directive';
1418
import { AppShellSideNavComponent } from './side-nav/side-nav.component';
1519
import { RxLetModule } from '../rx-angular-pocs/template/directives/let';
16-
import { RxIfModule } from '../rx-angular-pocs/template/directives/if';
20+
import { IfModule } from '@rx-angular/template/experimental/if';
1721

1822
const exportedDeclarations = [
1923
AppShellHeaderContent,
@@ -36,7 +40,7 @@ const exportedDeclarations = [
3640
MatSelectModule,
3741
CdkTreeModule,
3842
RxLetModule,
39-
RxIfModule,
43+
IfModule,
4044
],
4145
exports: exportedDeclarations,
4246
})

apps/demos/src/app/features/experiments/structural-directives/if-visible-poc/if-visible.module.ts

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,15 @@ import { NgModule } from '@angular/core';
22
import { VisualizerModule } from '../../../../shared/debug-helper/visualizer';
33
import { ValueProvidersModule } from '../../../../shared/debug-helper/value-provider';
44
import { IfVisibleComponent } from './if-visible.component';
5-
import { RxLetModule, RxIfModule } from '../../../../rx-angular-pocs';
5+
import { RxLetModule } from '../../../../rx-angular-pocs';
6+
import { IfModule } from '@rx-angular/template/experimental/if';
67

7-
const DECLARATIONS = [
8-
IfVisibleComponent,
9-
];
8+
const DECLARATIONS = [IfVisibleComponent];
109

1110
@NgModule({
1211
declarations: DECLARATIONS,
13-
imports: [
14-
VisualizerModule,
15-
ValueProvidersModule,
16-
RxLetModule,
17-
RxIfModule
18-
],
12+
imports: [VisualizerModule, ValueProvidersModule, RxLetModule, IfModule],
1913
exports: DECLARATIONS,
20-
providers: []
14+
providers: [],
2115
})
22-
export class IfVisibleModule {
23-
}
16+
export class IfVisibleModule {}

apps/demos/src/app/features/experiments/structural-directives/rx-let-poc/rx-query-content.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { ChangeDetectionStrategy, Component, ContentChild, Directive, Input, OnInit } from '@angular/core';
22
import { Observable } from 'rxjs';
33
import { RxStrategyProvider } from '@rx-angular/cdk/render-strategies';
4-
import { RxEffects } from '../../../../shared/rx-effects.service';
4+
import { RxEffects } from '@rx-angular/state/effects';
55

66
@Directive({
77
selector: '[rxaContentTest]'
@@ -31,7 +31,7 @@ export class RxQueryContentComponent implements OnInit {
3131
}
3232

3333
ngOnInit() {
34-
this.effects.hold(this.value, () => {
34+
this.effects.register(this.value, () => {
3535
setTimeout(() => console.log(this.contentChild), 250);
3636
});
3737
}

apps/demos/src/app/features/experiments/structural-directives/rx-switch-poc/rx-switch-poc.module.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@ import { MatFormFieldModule } from '@angular/material/form-field';
1313
import { MatSliderModule } from '@angular/material/slider';
1414
import { MatButtonToggleModule } from '@angular/material/button-toggle';
1515
import { MatInputModule } from '@angular/material/input';
16-
import { RxIfModule, RxSwichModule } from '../../../../rx-angular-pocs/';
16+
import { RxSwichModule } from '../../../../rx-angular-pocs/';
17+
import { IfModule } from '@rx-angular/template/experimental/if';
1718
import { ValueProvidersModule } from '../../../../shared/debug-helper/value-provider';
1819

1920
@NgModule({
@@ -31,7 +32,7 @@ import { ValueProvidersModule } from '../../../../shared/debug-helper/value-prov
3132
MatSliderModule,
3233
MatButtonToggleModule,
3334
MatInputModule,
34-
RxIfModule,
35+
IfModule,
3536
RxSwichModule,
3637
ValueProvidersModule,
3738
],

apps/demos/src/app/features/template/rx-for/list-actions/list-actions.component.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@ import {
22
AfterViewInit,
33
ChangeDetectorRef,
44
Component,
5-
ElementRef,
5+
ElementRef, NgZone,
66
QueryList,
77
ViewChild,
88
ViewChildren,
9-
ViewEncapsulation,
9+
ViewEncapsulation
1010
} from '@angular/core';
1111
import { asyncScheduler } from '@rx-angular/cdk/zone-less/rxjs';
1212
import { BehaviorSubject, defer, merge, scheduled, Subject } from 'rxjs';
@@ -353,7 +353,7 @@ export class ListActionsComponent extends Hooks implements AfterViewInit {
353353
}
354354

355355
clickMe() {
356-
console.log('clicked me');
356+
console.log('clicked in angular zone', NgZone.isInAngularZone());
357357
}
358358

359359
trackByIdFn = (a) => a.id;

apps/demos/src/app/features/template/rx-for/list-actions/list-actions.module.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import { VisualizerModule } from '../../../../shared/debug-helper/visualizer/vis
1616
import { RecursiveModule } from '../../../../shared/template-structures/recursive/recursive.module';
1717
import { ListActionsComponent } from './list-actions.component';
1818
import { ROUTES } from './list-actions.routes';
19-
import { RxIfModule } from '../../../../rx-angular-pocs';
19+
import { IfModule } from '@rx-angular/template/experimental/if';
2020
import { StrategySelectModule } from '../../../../shared/debug-helper/strategy-select';
2121

2222
const DECLARATIONS = [ListActionsComponent];
@@ -41,7 +41,7 @@ const DECLARATIONS = [ListActionsComponent];
4141
StrategySelectModule,
4242
LetModule,
4343
ForModule,
44-
RxIfModule,
44+
IfModule,
4545
],
4646
exports: [DECLARATIONS],
4747
})

apps/demos/src/app/features/template/rx-for/nested-lists/rx-for-minimal.directive.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import {
2828
take,
2929
tap
3030
} from 'rxjs/operators';
31-
import { RxEffects } from '../../../../shared/rx-effects.service';
31+
import { RxEffects } from '@rx-angular/state/effects';
3232

3333
type RxForTemplateNames = 'rxSuspense' | 'rxNext' | 'rxError' | 'rxComplete';
3434

@@ -140,7 +140,7 @@ export class RxMinimalForOf<T extends object, U extends NgIterable<T> = NgIterab
140140

141141
initDiffer(iterable: U = [] as U) {
142142
this.differ = this.iterableDiffers.find(iterable).create((index: number, item: T) => item[this._rxTrackBy]);
143-
this.rxEffects.hold(this.values$.pipe(
143+
this.rxEffects.register(this.values$.pipe(
144144
startWith(iterable),
145145
map(i => ({ diff: this.differ.diff(i), iterable: i })),
146146
filter(r => r.diff != null),
@@ -149,7 +149,7 @@ export class RxMinimalForOf<T extends object, U extends NgIterable<T> = NgIterab
149149
}
150150

151151
ngOnInit() {
152-
this.rxEffects.hold(this.values$.pipe(take(1)), (value) => this.initDiffer(value));
152+
this.rxEffects.register(this.values$.pipe(take(1)), (value) => this.initDiffer(value));
153153
}
154154

155155
ngOnDestroy() {

0 commit comments

Comments
 (0)