From 22c2669a356925fb90c367fca73dafc2f9ffe67a Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 13:10:38 +0200 Subject: [PATCH 001/109] docs: move eslint rules to docs app --- .../eslint-plugin}/rules/no-explicit-change-detection-apis.md | 0 .../eslint-plugin}/rules/no-rxstate-imperative-in-reactive.md | 0 .../rules/no-rxstate-subscriptions-outside-constructor.md | 0 .../docs/eslint-plugin}/rules/no-zone-critical-browser-apis.md | 0 .../docs/eslint-plugin}/rules/no-zone-critical-lodash-apis.md | 0 .../eslint-plugin}/rules/no-zone-critical-rxjs-creation-apis.md | 0 .../docs/eslint-plugin}/rules/no-zone-critical-rxjs-operators.md | 0 .../docs/eslint-plugin}/rules/no-zone-critical-rxjs-schedulers.md | 0 .../docs/docs/eslint-plugin}/rules/no-zone-run-apis.md | 0 .../docs/eslint-plugin}/rules/prefer-no-layout-sensitive-apis.md | 0 .../docs/docs/eslint-plugin}/rules/prefer-no-lodash-clone-deep.md | 0 .../docs/docs/eslint-plugin}/rules/prefer-no-lodash-is-equal.md | 0 12 files changed, 0 insertions(+), 0 deletions(-) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-explicit-change-detection-apis.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-rxstate-imperative-in-reactive.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-rxstate-subscriptions-outside-constructor.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-zone-critical-browser-apis.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-zone-critical-lodash-apis.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-zone-critical-rxjs-creation-apis.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-zone-critical-rxjs-operators.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-zone-critical-rxjs-schedulers.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/no-zone-run-apis.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/prefer-no-layout-sensitive-apis.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/prefer-no-lodash-clone-deep.md (100%) rename {libs/eslint-plugin/docs => apps/docs/docs/eslint-plugin}/rules/prefer-no-lodash-is-equal.md (100%) diff --git a/libs/eslint-plugin/docs/rules/no-explicit-change-detection-apis.md b/apps/docs/docs/eslint-plugin/rules/no-explicit-change-detection-apis.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-explicit-change-detection-apis.md rename to apps/docs/docs/eslint-plugin/rules/no-explicit-change-detection-apis.md diff --git a/libs/eslint-plugin/docs/rules/no-rxstate-imperative-in-reactive.md b/apps/docs/docs/eslint-plugin/rules/no-rxstate-imperative-in-reactive.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-rxstate-imperative-in-reactive.md rename to apps/docs/docs/eslint-plugin/rules/no-rxstate-imperative-in-reactive.md diff --git a/libs/eslint-plugin/docs/rules/no-rxstate-subscriptions-outside-constructor.md b/apps/docs/docs/eslint-plugin/rules/no-rxstate-subscriptions-outside-constructor.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-rxstate-subscriptions-outside-constructor.md rename to apps/docs/docs/eslint-plugin/rules/no-rxstate-subscriptions-outside-constructor.md diff --git a/libs/eslint-plugin/docs/rules/no-zone-critical-browser-apis.md b/apps/docs/docs/eslint-plugin/rules/no-zone-critical-browser-apis.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-zone-critical-browser-apis.md rename to apps/docs/docs/eslint-plugin/rules/no-zone-critical-browser-apis.md diff --git a/libs/eslint-plugin/docs/rules/no-zone-critical-lodash-apis.md b/apps/docs/docs/eslint-plugin/rules/no-zone-critical-lodash-apis.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-zone-critical-lodash-apis.md rename to apps/docs/docs/eslint-plugin/rules/no-zone-critical-lodash-apis.md diff --git a/libs/eslint-plugin/docs/rules/no-zone-critical-rxjs-creation-apis.md b/apps/docs/docs/eslint-plugin/rules/no-zone-critical-rxjs-creation-apis.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-zone-critical-rxjs-creation-apis.md rename to apps/docs/docs/eslint-plugin/rules/no-zone-critical-rxjs-creation-apis.md diff --git a/libs/eslint-plugin/docs/rules/no-zone-critical-rxjs-operators.md b/apps/docs/docs/eslint-plugin/rules/no-zone-critical-rxjs-operators.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-zone-critical-rxjs-operators.md rename to apps/docs/docs/eslint-plugin/rules/no-zone-critical-rxjs-operators.md diff --git a/libs/eslint-plugin/docs/rules/no-zone-critical-rxjs-schedulers.md b/apps/docs/docs/eslint-plugin/rules/no-zone-critical-rxjs-schedulers.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-zone-critical-rxjs-schedulers.md rename to apps/docs/docs/eslint-plugin/rules/no-zone-critical-rxjs-schedulers.md diff --git a/libs/eslint-plugin/docs/rules/no-zone-run-apis.md b/apps/docs/docs/eslint-plugin/rules/no-zone-run-apis.md similarity index 100% rename from libs/eslint-plugin/docs/rules/no-zone-run-apis.md rename to apps/docs/docs/eslint-plugin/rules/no-zone-run-apis.md diff --git a/libs/eslint-plugin/docs/rules/prefer-no-layout-sensitive-apis.md b/apps/docs/docs/eslint-plugin/rules/prefer-no-layout-sensitive-apis.md similarity index 100% rename from libs/eslint-plugin/docs/rules/prefer-no-layout-sensitive-apis.md rename to apps/docs/docs/eslint-plugin/rules/prefer-no-layout-sensitive-apis.md diff --git a/libs/eslint-plugin/docs/rules/prefer-no-lodash-clone-deep.md b/apps/docs/docs/eslint-plugin/rules/prefer-no-lodash-clone-deep.md similarity index 100% rename from libs/eslint-plugin/docs/rules/prefer-no-lodash-clone-deep.md rename to apps/docs/docs/eslint-plugin/rules/prefer-no-lodash-clone-deep.md diff --git a/libs/eslint-plugin/docs/rules/prefer-no-lodash-is-equal.md b/apps/docs/docs/eslint-plugin/rules/prefer-no-lodash-is-equal.md similarity index 100% rename from libs/eslint-plugin/docs/rules/prefer-no-lodash-is-equal.md rename to apps/docs/docs/eslint-plugin/rules/prefer-no-lodash-is-equal.md From 865e882b0be0102bea820e8f20ae945ca99ea494 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 13:21:11 +0200 Subject: [PATCH 002/109] docs: transclude eslint readme to docs app --- apps/docs/docs/eslint-plugin/_category_.json | 8 ++++++++ apps/docs/docs/eslint-plugin/overview.mdx | 12 ++++++++++++ 2 files changed, 20 insertions(+) create mode 100644 apps/docs/docs/eslint-plugin/_category_.json create mode 100644 apps/docs/docs/eslint-plugin/overview.mdx diff --git a/apps/docs/docs/eslint-plugin/_category_.json b/apps/docs/docs/eslint-plugin/_category_.json new file mode 100644 index 0000000000..145531edf4 --- /dev/null +++ b/apps/docs/docs/eslint-plugin/_category_.json @@ -0,0 +1,8 @@ +{ + "label": "@rx-angular/eslint-plugin", + "position": 3, + "link": { + "type": "doc", + "id": "eslint-plugin/overview" + } +} \ No newline at end of file diff --git a/apps/docs/docs/eslint-plugin/overview.mdx b/apps/docs/docs/eslint-plugin/overview.mdx new file mode 100644 index 0000000000..dbe917d131 --- /dev/null +++ b/apps/docs/docs/eslint-plugin/overview.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/eslint-plugin' +sidebar_position: 1 +title: '@rx-angular/eslint-plugin overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/eslint-plugin/README.md'; + + + +export const toc = [...ReadmeToc]; \ No newline at end of file From bc90f59c3b6840cd2628292995c111ab46f5aa97 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 13:26:55 +0200 Subject: [PATCH 003/109] docs: add auto gen index to eslint rules --- apps/docs/docs/eslint-plugin/rules/_category_.json | 8 ++++++++ 1 file changed, 8 insertions(+) create mode 100644 apps/docs/docs/eslint-plugin/rules/_category_.json diff --git a/apps/docs/docs/eslint-plugin/rules/_category_.json b/apps/docs/docs/eslint-plugin/rules/_category_.json new file mode 100644 index 0000000000..fdbe900872 --- /dev/null +++ b/apps/docs/docs/eslint-plugin/rules/_category_.json @@ -0,0 +1,8 @@ +{ + "label": "ESLint Rules", + "position": 1, + "link": { + "type": "generated-index", + "description": "List of individual rules availible in @rx-angular/eslint-plugin" + } +} From e87f16a01f03234a579ca265a19af30f97f2d017 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 13:38:21 +0200 Subject: [PATCH 004/109] docs: transclude template readme to docs app --- apps/docs/docs/template/_category_.json | 4 ++-- apps/docs/docs/template/overview.mdx | 12 ++++++++++++ 2 files changed, 14 insertions(+), 2 deletions(-) create mode 100644 apps/docs/docs/template/overview.mdx diff --git a/apps/docs/docs/template/_category_.json b/apps/docs/docs/template/_category_.json index c47aa5b128..1e5d30698a 100644 --- a/apps/docs/docs/template/_category_.json +++ b/apps/docs/docs/template/_category_.json @@ -2,7 +2,7 @@ "label": "@rx-angular/template", "position": 3, "link": { - "type": "generated-index", - "description": "RxAngular Template" + "type": "doc", + "id": "template/overview" } } diff --git a/apps/docs/docs/template/overview.mdx b/apps/docs/docs/template/overview.mdx new file mode 100644 index 0000000000..3035f3c82e --- /dev/null +++ b/apps/docs/docs/template/overview.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/template' +sidebar_position: 1 +title: '@rx-angular/template overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/template/README.md' + + + +export const toc = [...ReadmeToc]; \ No newline at end of file From e492bc3ef61ff2c053cd5933c49177ade0198e2d Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 13:50:20 +0200 Subject: [PATCH 005/109] docs: move template api reference to docs app --- .../docs => apps/docs/docs/template}/api/let-directive.md | 0 {libs/template/docs => apps/docs/docs/template}/api/overview.md | 0 {libs/template/docs => apps/docs/docs/template}/api/push-pipe.md | 0 .../docs => apps/docs/docs/template}/api/unpatch-directive.md | 0 4 files changed, 0 insertions(+), 0 deletions(-) rename {libs/template/docs => apps/docs/docs/template}/api/let-directive.md (100%) rename {libs/template/docs => apps/docs/docs/template}/api/overview.md (100%) rename {libs/template/docs => apps/docs/docs/template}/api/push-pipe.md (100%) rename {libs/template/docs => apps/docs/docs/template}/api/unpatch-directive.md (100%) diff --git a/libs/template/docs/api/let-directive.md b/apps/docs/docs/template/api/let-directive.md similarity index 100% rename from libs/template/docs/api/let-directive.md rename to apps/docs/docs/template/api/let-directive.md diff --git a/libs/template/docs/api/overview.md b/apps/docs/docs/template/api/overview.md similarity index 100% rename from libs/template/docs/api/overview.md rename to apps/docs/docs/template/api/overview.md diff --git a/libs/template/docs/api/push-pipe.md b/apps/docs/docs/template/api/push-pipe.md similarity index 100% rename from libs/template/docs/api/push-pipe.md rename to apps/docs/docs/template/api/push-pipe.md diff --git a/libs/template/docs/api/unpatch-directive.md b/apps/docs/docs/template/api/unpatch-directive.md similarity index 100% rename from libs/template/docs/api/unpatch-directive.md rename to apps/docs/docs/template/api/unpatch-directive.md From e68fa8803c37fc3ae9f8e50f53360f439d4270c8 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 13:52:29 +0200 Subject: [PATCH 006/109] docs: replace api overview for autogen index --- apps/docs/docs/template/api/_category_.json | 8 ++++++++ apps/docs/docs/template/api/overview.md | 17 ----------------- 2 files changed, 8 insertions(+), 17 deletions(-) create mode 100644 apps/docs/docs/template/api/_category_.json delete mode 100644 apps/docs/docs/template/api/overview.md diff --git a/apps/docs/docs/template/api/_category_.json b/apps/docs/docs/template/api/_category_.json new file mode 100644 index 0000000000..04911ffd66 --- /dev/null +++ b/apps/docs/docs/template/api/_category_.json @@ -0,0 +1,8 @@ +{ + "label": "API", + "position": 1, + "link": { + "type": "generated-index", + "description": "API reference @rx-angular/template" + } +} \ No newline at end of file diff --git a/apps/docs/docs/template/api/overview.md b/apps/docs/docs/template/api/overview.md deleted file mode 100644 index 09e5bce86d..0000000000 --- a/apps/docs/docs/template/api/overview.md +++ /dev/null @@ -1,17 +0,0 @@ -## API - -### Directives - -- [`LetDirective`](./let-directive.md) -- [`UnpatchDirective`](./unpatch-directive.md) - -#### Experimental - -- [🧪 `RxFor`](./rx-for-directive.md) -- [🧪 `RxIf`](./rx-if-directive.md) -- [🧪 `ViewportPriority`](./viewport-prio.md) - -### Pipes - -- [`PushPipe`](./push-pipe.md) - From 9f0fde7d480d3af0247fcc5e0ad9d2dc38bc812e Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 14:21:56 +0200 Subject: [PATCH 007/109] docs: move experimental template api to docs app --- apps/docs/docs/template/api/experimental/_category_.json | 8 ++++++++ .../docs/template/api}/experimental/rx-for-directive.md | 0 .../docs/template/api}/experimental/rx-if-directive.md | 0 .../docs/docs/template/api}/experimental/viewport-prio.md | 0 4 files changed, 8 insertions(+) create mode 100644 apps/docs/docs/template/api/experimental/_category_.json rename {libs/template/docs => apps/docs/docs/template/api}/experimental/rx-for-directive.md (100%) rename {libs/template/docs => apps/docs/docs/template/api}/experimental/rx-if-directive.md (100%) rename {libs/template/docs => apps/docs/docs/template/api}/experimental/viewport-prio.md (100%) diff --git a/apps/docs/docs/template/api/experimental/_category_.json b/apps/docs/docs/template/api/experimental/_category_.json new file mode 100644 index 0000000000..d8b3950189 --- /dev/null +++ b/apps/docs/docs/template/api/experimental/_category_.json @@ -0,0 +1,8 @@ +{ + "label": "Experimental API", + "position": 4, + "link": { + "type": "generated-index", + "description": "Experimental API reference for @rx-angular/template" + } +} \ No newline at end of file diff --git a/libs/template/docs/experimental/rx-for-directive.md b/apps/docs/docs/template/api/experimental/rx-for-directive.md similarity index 100% rename from libs/template/docs/experimental/rx-for-directive.md rename to apps/docs/docs/template/api/experimental/rx-for-directive.md diff --git a/libs/template/docs/experimental/rx-if-directive.md b/apps/docs/docs/template/api/experimental/rx-if-directive.md similarity index 100% rename from libs/template/docs/experimental/rx-if-directive.md rename to apps/docs/docs/template/api/experimental/rx-if-directive.md diff --git a/libs/template/docs/experimental/viewport-prio.md b/apps/docs/docs/template/api/experimental/viewport-prio.md similarity index 100% rename from libs/template/docs/experimental/viewport-prio.md rename to apps/docs/docs/template/api/experimental/viewport-prio.md From 1dba2c8d6a0b1d47b1bb54a91d38229a89f0a7dc Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 14:29:25 +0200 Subject: [PATCH 008/109] docs: move template concepts docs to docs app --- .../docs => apps/docs/docs/template/concepts}/concepts.md | 0 .../docs/docs/template/concepts}/performance-issues.md | 0 .../docs => apps/docs/docs/template/concepts}/reactive-context.md | 0 3 files changed, 0 insertions(+), 0 deletions(-) rename {libs/template/docs => apps/docs/docs/template/concepts}/concepts.md (100%) rename {libs/template/docs => apps/docs/docs/template/concepts}/performance-issues.md (100%) rename {libs/template/docs => apps/docs/docs/template/concepts}/reactive-context.md (100%) diff --git a/libs/template/docs/concepts.md b/apps/docs/docs/template/concepts/concepts.md similarity index 100% rename from libs/template/docs/concepts.md rename to apps/docs/docs/template/concepts/concepts.md diff --git a/libs/template/docs/performance-issues.md b/apps/docs/docs/template/concepts/performance-issues.md similarity index 100% rename from libs/template/docs/performance-issues.md rename to apps/docs/docs/template/concepts/performance-issues.md diff --git a/libs/template/docs/reactive-context.md b/apps/docs/docs/template/concepts/reactive-context.md similarity index 100% rename from libs/template/docs/reactive-context.md rename to apps/docs/docs/template/concepts/reactive-context.md From eeec2efb8ece951952d9c36383174d0e523639a2 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 14:33:42 +0200 Subject: [PATCH 009/109] docs: edit perf-issues markdown syntax for headers --- apps/docs/docs/template/concepts/performance-issues.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/docs/docs/template/concepts/performance-issues.md b/apps/docs/docs/template/concepts/performance-issues.md index 4b844e17d6..3792030f06 100644 --- a/apps/docs/docs/template/concepts/performance-issues.md +++ b/apps/docs/docs/template/concepts/performance-issues.md @@ -1,10 +1,10 @@ -## Rendering Issues in Angular +# Rendering Issues in Angular A brief overview about what is about the current situation in terms of rendering in angular applications. ![Scheduling Options](https://raw.githubusercontent.com/rx-angular/rx-angular/main/libs/template/docs/images/scheduling-options.png) -### Binding Reactive Sources +## Binding Reactive Sources The current way of binding _reactive_ sources to a view in angular looks like that: @@ -30,7 +30,7 @@ software. The comprehensive toolset of `@rx-angular/template` solves most of those issues with or without `zone.js`. -### NgZone +## NgZone `NgZone` assumes that DOM events like click, resize, focus, blur (+ `EventEmitters`, `setTimeOut`, `Promise.resolve()`, etc) are always used by developers to dispatch actions which leads to state mutation. If one of those From 5e3afab2bdeb9621e1e505201e947458b51a50c3 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 15:52:03 +0200 Subject: [PATCH 010/109] docs: transluted cdk readme to docs app --- apps/docs/docs/cdk/_category_.json | 8 ++++---- apps/docs/docs/cdk/overview.mdx | 12 ++++++++++++ 2 files changed, 16 insertions(+), 4 deletions(-) create mode 100644 apps/docs/docs/cdk/overview.mdx diff --git a/apps/docs/docs/cdk/_category_.json b/apps/docs/docs/cdk/_category_.json index ec7cadc82b..0c572b020a 100644 --- a/apps/docs/docs/cdk/_category_.json +++ b/apps/docs/docs/cdk/_category_.json @@ -1,8 +1,8 @@ { "label": "@rx-angular/cdk", - "position": 1, + "position": 3, "link": { - "type": "generated-index", - "description": "RxAngular CDK" + "type": "doc", + "id": "cdk/overview" } -} +} \ No newline at end of file diff --git a/apps/docs/docs/cdk/overview.mdx b/apps/docs/docs/cdk/overview.mdx new file mode 100644 index 0000000000..0abc429d79 --- /dev/null +++ b/apps/docs/docs/cdk/overview.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk' +sidebar_position: 1 +title: '@rx-angular/cdk overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file From 693db5e0fe3c336a35b2d1b13c3db89f0dd015b3 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 15:52:33 +0200 Subject: [PATCH 011/109] docs: transluted cdk sub modules to docs app --- apps/docs/docs/cdk/sub-modules/_category_.json | 8 ++++++++ apps/docs/docs/cdk/sub-modules/coalesing.mdx | 12 ++++++++++++ apps/docs/docs/cdk/sub-modules/coercing.mdx | 12 ++++++++++++ apps/docs/docs/cdk/sub-modules/notifications.mdx | 12 ++++++++++++ apps/docs/docs/cdk/sub-modules/render-strategies.mdx | 12 ++++++++++++ .../docs/cdk/sub-modules/template-management.mdx | 12 ++++++++++++ apps/docs/docs/cdk/sub-modules/transformations.mdx | 12 ++++++++++++ .../docs/docs/cdk/sub-modules/zone-configuration.mdx | 12 ++++++++++++ apps/docs/docs/cdk/sub-modules/zone-less.mdx | 12 ++++++++++++ 9 files changed, 104 insertions(+) create mode 100644 apps/docs/docs/cdk/sub-modules/_category_.json create mode 100644 apps/docs/docs/cdk/sub-modules/coalesing.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/coercing.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/notifications.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/render-strategies.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/template-management.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/transformations.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/zone-configuration.mdx create mode 100644 apps/docs/docs/cdk/sub-modules/zone-less.mdx diff --git a/apps/docs/docs/cdk/sub-modules/_category_.json b/apps/docs/docs/cdk/sub-modules/_category_.json new file mode 100644 index 0000000000..ebe0c1790a --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/_category_.json @@ -0,0 +1,8 @@ +{ + "label": "Sub Modules", + "position": 1, + "link": { + "type": "generated-index", + "description": "Sub Modules in @rx-angular/cdk" + } +} diff --git a/apps/docs/docs/cdk/sub-modules/coalesing.mdx b/apps/docs/docs/cdk/sub-modules/coalesing.mdx new file mode 100644 index 0000000000..89d0ec5955 --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/coalesing.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/coalescing' +sidebar_position: 1 +title: '@rx-angular/cdk/coalescing overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/coalescing/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file diff --git a/apps/docs/docs/cdk/sub-modules/coercing.mdx b/apps/docs/docs/cdk/sub-modules/coercing.mdx new file mode 100644 index 0000000000..e97a1f74ed --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/coercing.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/coercing' +sidebar_position: 1 +title: '@rx-angular/cdk/coercing overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/coercing/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file diff --git a/apps/docs/docs/cdk/sub-modules/notifications.mdx b/apps/docs/docs/cdk/sub-modules/notifications.mdx new file mode 100644 index 0000000000..9d4b50fdaf --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/notifications.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/notifications' +sidebar_position: 1 +title: '@rx-angular/cdk/notifications overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/notifications/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies.mdx b/apps/docs/docs/cdk/sub-modules/render-strategies.mdx new file mode 100644 index 0000000000..3efd742bef --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/render-strategies.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/render-strategies' +sidebar_position: 1 +title: '@rx-angular/cdk/render-strategies overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/render-strategies/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file diff --git a/apps/docs/docs/cdk/sub-modules/template-management.mdx b/apps/docs/docs/cdk/sub-modules/template-management.mdx new file mode 100644 index 0000000000..c646c9f2f2 --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/template-management.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/template' +sidebar_position: 1 +title: '@rx-angular/cdk/template overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/template/Readme.md'; + + + +export const toc = [...ReadmeToc] diff --git a/apps/docs/docs/cdk/sub-modules/transformations.mdx b/apps/docs/docs/cdk/sub-modules/transformations.mdx new file mode 100644 index 0000000000..83d4ae7ad6 --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/transformations.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/transformations' +sidebar_position: 1 +title: '@rx-angular/cdk/transformations overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/transformations/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file diff --git a/apps/docs/docs/cdk/sub-modules/zone-configuration.mdx b/apps/docs/docs/cdk/sub-modules/zone-configuration.mdx new file mode 100644 index 0000000000..70792e8484 --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/zone-configuration.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/zone-configurations' +sidebar_position: 1 +title: '@rx-angular/cdk/zone-configurations overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/zone-configurations/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file diff --git a/apps/docs/docs/cdk/sub-modules/zone-less.mdx b/apps/docs/docs/cdk/sub-modules/zone-less.mdx new file mode 100644 index 0000000000..ae9f9c8132 --- /dev/null +++ b/apps/docs/docs/cdk/sub-modules/zone-less.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/cdk/zone-less' +sidebar_position: 1 +title: '@rx-angular/cdk/zone-less overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/zone-less/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file From b0c73c278cbf44d036097688e13b696c83190b6e Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:07:31 +0200 Subject: [PATCH 012/109] docs: move coalecing docs to docs app --- .../docs/cdk/sub-modules/{ => coalesing}/coalesing.mdx | 2 +- .../docs/docs/cdk/sub-modules/coalesing/resources.md | 7 +++++++ 2 files changed, 8 insertions(+), 1 deletion(-) rename apps/docs/docs/cdk/sub-modules/{ => coalesing}/coalesing.mdx (83%) rename libs/cdk/coalescing/docs/Readme.md => apps/docs/docs/cdk/sub-modules/coalesing/resources.md (99%) diff --git a/apps/docs/docs/cdk/sub-modules/coalesing.mdx b/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx similarity index 83% rename from apps/docs/docs/cdk/sub-modules/coalesing.mdx rename to apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx index 89d0ec5955..89d43f7f27 100644 --- a/apps/docs/docs/cdk/sub-modules/coalesing.mdx +++ b/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/coalescing' +sidebar_label: 'Coalescing' sidebar_position: 1 title: '@rx-angular/cdk/coalescing overview' hide_title: true diff --git a/libs/cdk/coalescing/docs/Readme.md b/apps/docs/docs/cdk/sub-modules/coalesing/resources.md similarity index 99% rename from libs/cdk/coalescing/docs/Readme.md rename to apps/docs/docs/cdk/sub-modules/coalesing/resources.md index 0f8153ef46..26a83e16ae 100644 --- a/libs/cdk/coalescing/docs/Readme.md +++ b/apps/docs/docs/cdk/sub-modules/coalesing/resources.md @@ -1,3 +1,10 @@ +--- +sidebar_label: 'Resources' +sidebar_position: 1 +title: '@rx-angular/cdk/coalescing overview' +hide_title: true +--- + # Resources **Example applications:** From eff7768a21e1c2027701d35934a021bccf261e6e Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:09:38 +0200 Subject: [PATCH 013/109] docs: move coercing docs to docs app --- apps/docs/docs/cdk/sub-modules/{ => coercing}/coercing.mdx | 2 +- .../docs/docs/cdk/sub-modules/coercing/resources.md | 0 2 files changed, 1 insertion(+), 1 deletion(-) rename apps/docs/docs/cdk/sub-modules/{ => coercing}/coercing.mdx (83%) rename libs/cdk/coercing/docs/Readme.md => apps/docs/docs/cdk/sub-modules/coercing/resources.md (100%) diff --git a/apps/docs/docs/cdk/sub-modules/coercing.mdx b/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx similarity index 83% rename from apps/docs/docs/cdk/sub-modules/coercing.mdx rename to apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx index e97a1f74ed..41ca8f97a7 100644 --- a/apps/docs/docs/cdk/sub-modules/coercing.mdx +++ b/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/coercing' +sidebar_label: 'Coercing' sidebar_position: 1 title: '@rx-angular/cdk/coercing overview' hide_title: true diff --git a/libs/cdk/coercing/docs/Readme.md b/apps/docs/docs/cdk/sub-modules/coercing/resources.md similarity index 100% rename from libs/cdk/coercing/docs/Readme.md rename to apps/docs/docs/cdk/sub-modules/coercing/resources.md From bd8ad69ba540d78c0f6b79f68f56e01596d0f8a1 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:14:09 +0200 Subject: [PATCH 014/109] docs: move cdk render strategies docs to docs app --- .../docs/cdk/sub-modules/render-strategies}/basic-strategies.md | 0 .../cdk/sub-modules/render-strategies}/concurrent-strategies.md | 0 .../docs/docs/cdk/sub-modules/render-strategies/overview.md | 0 .../sub-modules/{ => render-strategies}/render-strategies.mdx | 2 +- .../docs/docs/cdk/sub-modules/render-strategies}/strategies.md | 0 .../cdk/sub-modules/render-strategies}/strategy-provider.md | 0 6 files changed, 1 insertion(+), 1 deletion(-) rename {libs/cdk/render-strategies/docs => apps/docs/docs/cdk/sub-modules/render-strategies}/basic-strategies.md (100%) rename {libs/cdk/render-strategies/docs => apps/docs/docs/cdk/sub-modules/render-strategies}/concurrent-strategies.md (100%) rename libs/cdk/render-strategies/docs/README.md => apps/docs/docs/cdk/sub-modules/render-strategies/overview.md (100%) rename apps/docs/docs/cdk/sub-modules/{ => render-strategies}/render-strategies.mdx (82%) rename {libs/cdk/render-strategies/docs => apps/docs/docs/cdk/sub-modules/render-strategies}/strategies.md (100%) rename {libs/cdk/render-strategies/docs => apps/docs/docs/cdk/sub-modules/render-strategies}/strategy-provider.md (100%) diff --git a/libs/cdk/render-strategies/docs/basic-strategies.md b/apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md similarity index 100% rename from libs/cdk/render-strategies/docs/basic-strategies.md rename to apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md diff --git a/libs/cdk/render-strategies/docs/concurrent-strategies.md b/apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md similarity index 100% rename from libs/cdk/render-strategies/docs/concurrent-strategies.md rename to apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md diff --git a/libs/cdk/render-strategies/docs/README.md b/apps/docs/docs/cdk/sub-modules/render-strategies/overview.md similarity index 100% rename from libs/cdk/render-strategies/docs/README.md rename to apps/docs/docs/cdk/sub-modules/render-strategies/overview.md diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies.mdx b/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx similarity index 82% rename from apps/docs/docs/cdk/sub-modules/render-strategies.mdx rename to apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx index 3efd742bef..793938e571 100644 --- a/apps/docs/docs/cdk/sub-modules/render-strategies.mdx +++ b/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/render-strategies' +sidebar_label: 'Render Strategies' sidebar_position: 1 title: '@rx-angular/cdk/render-strategies overview' hide_title: true diff --git a/libs/cdk/render-strategies/docs/strategies.md b/apps/docs/docs/cdk/sub-modules/render-strategies/strategies.md similarity index 100% rename from libs/cdk/render-strategies/docs/strategies.md rename to apps/docs/docs/cdk/sub-modules/render-strategies/strategies.md diff --git a/libs/cdk/render-strategies/docs/strategy-provider.md b/apps/docs/docs/cdk/sub-modules/render-strategies/strategy-provider.md similarity index 100% rename from libs/cdk/render-strategies/docs/strategy-provider.md rename to apps/docs/docs/cdk/sub-modules/render-strategies/strategy-provider.md From cdfbf689db66130db3c33416d5c1629a1c73b79d Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:17:11 +0200 Subject: [PATCH 015/109] docs: move cdk notifications docs to docs app --- .../docs/cdk/sub-modules/{ => notifications}/notifications.mdx | 2 +- .../docs/docs/cdk/sub-modules/notifications/resources.md | 0 2 files changed, 1 insertion(+), 1 deletion(-) rename apps/docs/docs/cdk/sub-modules/{ => notifications}/notifications.mdx (82%) rename libs/cdk/notifications/docs/Readme.md => apps/docs/docs/cdk/sub-modules/notifications/resources.md (100%) diff --git a/apps/docs/docs/cdk/sub-modules/notifications.mdx b/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx similarity index 82% rename from apps/docs/docs/cdk/sub-modules/notifications.mdx rename to apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx index 9d4b50fdaf..a2c5b3f21a 100644 --- a/apps/docs/docs/cdk/sub-modules/notifications.mdx +++ b/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/notifications' +sidebar_label: 'Notifications' sidebar_position: 1 title: '@rx-angular/cdk/notifications overview' hide_title: true diff --git a/libs/cdk/notifications/docs/Readme.md b/apps/docs/docs/cdk/sub-modules/notifications/resources.md similarity index 100% rename from libs/cdk/notifications/docs/Readme.md rename to apps/docs/docs/cdk/sub-modules/notifications/resources.md From d7e356c4fd90d70569834f6a82b1e1900a6e492a Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:26:56 +0200 Subject: [PATCH 016/109] docs: move zone configurations docs to docs app --- .../sub-modules/zone-configurations}/how-to-debug-zone-flags.md | 0 .../sub-modules/zone-configurations}/how-to-setup-zone-flags.md | 0 .../zone-configurations.mdx} | 2 +- .../docs/cdk/sub-modules/zone-configurations}/zone-flags.md | 0 4 files changed, 1 insertion(+), 1 deletion(-) rename {libs/cdk/zone-configurations/docs => apps/docs/docs/cdk/sub-modules/zone-configurations}/how-to-debug-zone-flags.md (100%) rename {libs/cdk/zone-configurations/docs => apps/docs/docs/cdk/sub-modules/zone-configurations}/how-to-setup-zone-flags.md (100%) rename apps/docs/docs/cdk/sub-modules/{zone-configuration.mdx => zone-configurations/zone-configurations.mdx} (81%) rename {libs/cdk/zone-configurations/docs => apps/docs/docs/cdk/sub-modules/zone-configurations}/zone-flags.md (100%) diff --git a/libs/cdk/zone-configurations/docs/how-to-debug-zone-flags.md b/apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-debug-zone-flags.md similarity index 100% rename from libs/cdk/zone-configurations/docs/how-to-debug-zone-flags.md rename to apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-debug-zone-flags.md diff --git a/libs/cdk/zone-configurations/docs/how-to-setup-zone-flags.md b/apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-setup-zone-flags.md similarity index 100% rename from libs/cdk/zone-configurations/docs/how-to-setup-zone-flags.md rename to apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-setup-zone-flags.md diff --git a/apps/docs/docs/cdk/sub-modules/zone-configuration.mdx b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx similarity index 81% rename from apps/docs/docs/cdk/sub-modules/zone-configuration.mdx rename to apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx index 70792e8484..4026d6d8f7 100644 --- a/apps/docs/docs/cdk/sub-modules/zone-configuration.mdx +++ b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/zone-configurations' +sidebar_label: 'Zone Configurations' sidebar_position: 1 title: '@rx-angular/cdk/zone-configurations overview' hide_title: true diff --git a/libs/cdk/zone-configurations/docs/zone-flags.md b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-flags.md similarity index 100% rename from libs/cdk/zone-configurations/docs/zone-flags.md rename to apps/docs/docs/cdk/sub-modules/zone-configurations/zone-flags.md From 42bc66e34aa593617b1e55958f5829282ef23156 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:33:19 +0200 Subject: [PATCH 017/109] docs: move cdk zone less docs to docs app --- .../docs/docs/cdk/sub-modules/zone-less/resources.md | 0 apps/docs/docs/cdk/sub-modules/{ => zone-less}/zone-less.mdx | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) rename libs/cdk/zone-less/docs/README.md => apps/docs/docs/cdk/sub-modules/zone-less/resources.md (100%) rename apps/docs/docs/cdk/sub-modules/{ => zone-less}/zone-less.mdx (83%) diff --git a/libs/cdk/zone-less/docs/README.md b/apps/docs/docs/cdk/sub-modules/zone-less/resources.md similarity index 100% rename from libs/cdk/zone-less/docs/README.md rename to apps/docs/docs/cdk/sub-modules/zone-less/resources.md diff --git a/apps/docs/docs/cdk/sub-modules/zone-less.mdx b/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx similarity index 83% rename from apps/docs/docs/cdk/sub-modules/zone-less.mdx rename to apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx index ae9f9c8132..821f853a9a 100644 --- a/apps/docs/docs/cdk/sub-modules/zone-less.mdx +++ b/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/zone-less' +sidebar_label: 'Zone Less' sidebar_position: 1 title: '@rx-angular/cdk/zone-less overview' hide_title: true From 166bd742e38b6583151ec7d12b7bd74ae8a5af27 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:37:15 +0200 Subject: [PATCH 018/109] docs: change sidebar title for cdk sub modules --- .../{ => template-management}/template-management.mdx | 2 +- .../cdk/sub-modules/{ => transformations}/transformations.mdx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename apps/docs/docs/cdk/sub-modules/{ => template-management}/template-management.mdx (83%) rename apps/docs/docs/cdk/sub-modules/{ => transformations}/transformations.mdx (82%) diff --git a/apps/docs/docs/cdk/sub-modules/template-management.mdx b/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx similarity index 83% rename from apps/docs/docs/cdk/sub-modules/template-management.mdx rename to apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx index c646c9f2f2..72b7ea0839 100644 --- a/apps/docs/docs/cdk/sub-modules/template-management.mdx +++ b/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/template' +sidebar_label: 'Template Management' sidebar_position: 1 title: '@rx-angular/cdk/template overview' hide_title: true diff --git a/apps/docs/docs/cdk/sub-modules/transformations.mdx b/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx similarity index 82% rename from apps/docs/docs/cdk/sub-modules/transformations.mdx rename to apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx index 83d4ae7ad6..213197002a 100644 --- a/apps/docs/docs/cdk/sub-modules/transformations.mdx +++ b/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx @@ -1,5 +1,5 @@ --- -sidebar_label: '@rx-angular/cdk/transformations' +sidebar_label: 'Transformations' sidebar_position: 1 title: '@rx-angular/cdk/transformations overview' hide_title: true From 2654f93fc389d99920f3aef580ad6193cf64ab0b Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 16:53:36 +0200 Subject: [PATCH 019/109] docs: transclude state readme to docs app --- apps/docs/docs/state/_category_.json | 2 +- apps/docs/docs/state/overview.mdx | 12 ++++++++++++ 2 files changed, 13 insertions(+), 1 deletion(-) create mode 100644 apps/docs/docs/state/overview.mdx diff --git a/apps/docs/docs/state/_category_.json b/apps/docs/docs/state/_category_.json index 6b3aa07c72..55334d509a 100644 --- a/apps/docs/docs/state/_category_.json +++ b/apps/docs/docs/state/_category_.json @@ -3,6 +3,6 @@ "position": 2, "link": { "type": "doc", - "id": "state/getting-started/overview" + "id": "state/overview" } } diff --git a/apps/docs/docs/state/overview.mdx b/apps/docs/docs/state/overview.mdx new file mode 100644 index 0000000000..18e955aee4 --- /dev/null +++ b/apps/docs/docs/state/overview.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: '@rx-angular/state' +sidebar_position: 1 +title: '@rx-angular/state overview' +hide_title: true +--- + +import Readme, { toc as ReadmeToc } from '@site/../../libs/state/README.md'; + + + +export const toc = [...ReadmeToc] \ No newline at end of file From b020cdf9fbf578c0b7da10b5706e276e85c52931 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 17:43:09 +0200 Subject: [PATCH 020/109] docs: move state docs to docs app --- {libs/state/docs => apps/docs/docs/state}/FAQ.md | 0 .../concepts-and-best-practices.md | 0 .../concepts-and-best-practices}/deriving-simple-state.md | 0 .../concepts-and-best-practices}/get-nested-state-slices.md | 4 ++-- apps/docs/docs/state/reactive-terminology.md | 1 + {libs/state/docs => apps/docs/docs/state}/testing.md | 0 libs/state/docs/reactive-terminology.md | 0 7 files changed, 3 insertions(+), 2 deletions(-) rename {libs/state/docs => apps/docs/docs/state}/FAQ.md (100%) rename {libs/state/docs => apps/docs/docs/state/concepts-and-best-practices}/concepts-and-best-practices.md (100%) rename {libs/state/docs/snippets => apps/docs/docs/state/concepts-and-best-practices}/deriving-simple-state.md (100%) rename {libs/state/docs/snippets => apps/docs/docs/state/concepts-and-best-practices}/get-nested-state-slices.md (74%) create mode 100644 apps/docs/docs/state/reactive-terminology.md rename {libs/state/docs => apps/docs/docs/state}/testing.md (100%) delete mode 100644 libs/state/docs/reactive-terminology.md diff --git a/libs/state/docs/FAQ.md b/apps/docs/docs/state/FAQ.md similarity index 100% rename from libs/state/docs/FAQ.md rename to apps/docs/docs/state/FAQ.md diff --git a/libs/state/docs/concepts-and-best-practices.md b/apps/docs/docs/state/concepts-and-best-practices/concepts-and-best-practices.md similarity index 100% rename from libs/state/docs/concepts-and-best-practices.md rename to apps/docs/docs/state/concepts-and-best-practices/concepts-and-best-practices.md diff --git a/libs/state/docs/snippets/deriving-simple-state.md b/apps/docs/docs/state/concepts-and-best-practices/deriving-simple-state.md similarity index 100% rename from libs/state/docs/snippets/deriving-simple-state.md rename to apps/docs/docs/state/concepts-and-best-practices/deriving-simple-state.md diff --git a/libs/state/docs/snippets/get-nested-state-slices.md b/apps/docs/docs/state/concepts-and-best-practices/get-nested-state-slices.md similarity index 74% rename from libs/state/docs/snippets/get-nested-state-slices.md rename to apps/docs/docs/state/concepts-and-best-practices/get-nested-state-slices.md index de1a50efe4..05b81515c1 100644 --- a/libs/state/docs/snippets/get-nested-state-slices.md +++ b/apps/docs/docs/state/concepts-and-best-practices/get-nested-state-slices.md @@ -4,7 +4,7 @@ One very common tasks when deriving state is selecting a single value out of the If you are familiar with RxJS, you will know about the [`pluck` operator](https://rxjs-dev.firebaseapp.com/api/operators/pluck) which "plucks" out values from an object. Also, the [`map`](https://rxjs-dev.firebaseapp.com/api/operators/map) operator could be used for this. -As shown in [deriving simple state](./deriving-simple-state.md) we use `stateful` operator from `@rx-angular/state` to get basic observable handling right out of the box. +As shown in [deriving simple state](deriving-simple-state.md) we use `stateful` operator from `@rx-angular/state` to get basic observable handling right out of the box. ```typescript import { Observable } from 'rxjs'; @@ -15,7 +15,7 @@ const state$: Observable<{ person: { name: string } }>; const derivation3$ = state$.pipe(stateful(pluck('person', 'name'))); ``` -We could even save more code by using the [`select`]() operator which essentially is a combination of `stateful` and `pluck`. +We could even save more code by using the `select` operator which essentially is a combination of `stateful` and `pluck`. ```typescript import { Observable } from 'rxjs'; diff --git a/apps/docs/docs/state/reactive-terminology.md b/apps/docs/docs/state/reactive-terminology.md new file mode 100644 index 0000000000..098c01ca0e --- /dev/null +++ b/apps/docs/docs/state/reactive-terminology.md @@ -0,0 +1 @@ +# Reactive Terminology \ No newline at end of file diff --git a/libs/state/docs/testing.md b/apps/docs/docs/state/testing.md similarity index 100% rename from libs/state/docs/testing.md rename to apps/docs/docs/state/testing.md diff --git a/libs/state/docs/reactive-terminology.md b/libs/state/docs/reactive-terminology.md deleted file mode 100644 index e69de29bb2..0000000000 From d3ad35b5b7a7e33ee510953ce163adeb60105063 Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 17:48:16 +0200 Subject: [PATCH 021/109] docs: transclude contributing to docs app --- apps/docs/docs/contributing.mdx | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 apps/docs/docs/contributing.mdx diff --git a/apps/docs/docs/contributing.mdx b/apps/docs/docs/contributing.mdx new file mode 100644 index 0000000000..dabef1d40a --- /dev/null +++ b/apps/docs/docs/contributing.mdx @@ -0,0 +1,12 @@ +--- +sidebar_label: 'Contributing' +sidebar_position: 5 +title: 'Contributing' +hide_title: true +--- + +import Contributing, { toc as ContributingToc } from '@site/../../CONTRIBUTING.md' + + + +export const toc = [...ContributingToc]; \ No newline at end of file From 7cac6f75311c8dca49391b9abe507e82cd1f2cbe Mon Sep 17 00:00:00 2001 From: Chris Date: Wed, 12 Oct 2022 18:16:49 +0200 Subject: [PATCH 022/109] docs: list transcluded Markdown files as implicit Nx dependencies for the docs project --- nx.json | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/nx.json b/nx.json index 537a64eb32..b2f3ffa3ac 100644 --- a/nx.json +++ b/nx.json @@ -8,7 +8,20 @@ }, "tsconfig.json": "*", "nx.json": "*", - ".eslintrc.json": "*" + ".eslintrc.json": "*", + "CONTRIBUTING.md": ["docs"], + "libs/cdk/README.md": ["docs"], + "libs/cdk/coalescing/README.md": ["docs"], + "libs/cdk/coercing/README.md": ["docs"], + "libs/cdk/notifications/README.md": ["docs"], + "libs/cdk/render-strategies/README.md": ["docs"], + "libs/cdk/transformations/README.md": ["docs"], + "libs/cdk/zone-configurations/README.md": ["docs"], + "libs/cdk/zone-less/README.md": ["docs"], + "libs/cdk/template/README.md": ["docs"], + "libs/eslint-plugin/README.md": ["docs"], + "libs/state/README.md": ["docs"], + "libs/template/README.md": ["docs"] }, "tasksRunnerOptions": { "default": { From dd38433d1109e4e6072b2649570f71f83300f957 Mon Sep 17 00:00:00 2001 From: Lars Gyrup Brink Nielsen Date: Wed, 12 Oct 2022 20:17:47 +0000 Subject: [PATCH 023/109] chore: configure formatting for MDX files --- .editorconfig | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.editorconfig b/.editorconfig index 6e87a003da..880639ca9b 100644 --- a/.editorconfig +++ b/.editorconfig @@ -8,6 +8,6 @@ indent_size = 2 insert_final_newline = true trim_trailing_whitespace = true -[*.md] +[*.{md,mdx}] max_line_length = off trim_trailing_whitespace = false From dcd43288ec82148c0358555743f66fdda1396547 Mon Sep 17 00:00:00 2001 From: Lars Gyrup Brink Nielsen Date: Wed, 12 Oct 2022 20:23:53 +0000 Subject: [PATCH 024/109] chore: organize path mappings --- tsconfig.base.json | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/tsconfig.base.json b/tsconfig.base.json index ee33ba0e91..d248a85fec 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -48,19 +48,17 @@ ], "@rx-angular/eslint-plugin": ["libs/eslint-plugin/src/index.ts"], "@rx-angular/state": ["libs/state/src/index.ts"], + "@rx-angular/state/actions": ["libs/state/actions/src/index.ts"], "@rx-angular/state/effects": ["libs/state/effects/src/index.ts"], "@rx-angular/state/selections": ["libs/state/selections/src/index.ts"], - "@rx-angular/state/actions": ["libs/state/actions/src/index.ts"], "@rx-angular/template": ["libs/template/src/index.ts"], - "@rx-angular/template/for": [ - "libs/template/for/src/index.ts" - ], "@rx-angular/template/experimental/if": [ "libs/template/experimental/if/src/index.ts" ], "@rx-angular/template/experimental/viewport-prio": [ "libs/template/experimental/viewport-prio/src/index.ts" ], + "@rx-angular/template/for": ["libs/template/for/src/index.ts"], "@rx-angular/template/let": ["libs/template/let/src/index.ts"], "@rx-angular/template/push": ["libs/template/push/src/index.ts"], "@rx-angular/template/unpatch": ["libs/template/unpatch/src/index.ts"], From 69bb4e6187ae13c9440f151ef05b0993fe4a038f Mon Sep 17 00:00:00 2001 From: Lars Gyrup Brink Nielsen Date: Wed, 12 Oct 2022 20:24:28 +0000 Subject: [PATCH 025/109] docs: format category configurations --- apps/docs/docs/cdk/_category_.json | 2 +- apps/docs/docs/eslint-plugin/_category_.json | 2 +- apps/docs/docs/template/api/_category_.json | 2 +- apps/docs/docs/template/api/experimental/_category_.json | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/docs/docs/cdk/_category_.json b/apps/docs/docs/cdk/_category_.json index 0c572b020a..68a5a14625 100644 --- a/apps/docs/docs/cdk/_category_.json +++ b/apps/docs/docs/cdk/_category_.json @@ -5,4 +5,4 @@ "type": "doc", "id": "cdk/overview" } -} \ No newline at end of file +} diff --git a/apps/docs/docs/eslint-plugin/_category_.json b/apps/docs/docs/eslint-plugin/_category_.json index 145531edf4..f1c6131225 100644 --- a/apps/docs/docs/eslint-plugin/_category_.json +++ b/apps/docs/docs/eslint-plugin/_category_.json @@ -5,4 +5,4 @@ "type": "doc", "id": "eslint-plugin/overview" } -} \ No newline at end of file +} diff --git a/apps/docs/docs/template/api/_category_.json b/apps/docs/docs/template/api/_category_.json index 04911ffd66..361de2003d 100644 --- a/apps/docs/docs/template/api/_category_.json +++ b/apps/docs/docs/template/api/_category_.json @@ -5,4 +5,4 @@ "type": "generated-index", "description": "API reference @rx-angular/template" } -} \ No newline at end of file +} diff --git a/apps/docs/docs/template/api/experimental/_category_.json b/apps/docs/docs/template/api/experimental/_category_.json index d8b3950189..266e2d8791 100644 --- a/apps/docs/docs/template/api/experimental/_category_.json +++ b/apps/docs/docs/template/api/experimental/_category_.json @@ -5,4 +5,4 @@ "type": "generated-index", "description": "Experimental API reference for @rx-angular/template" } -} \ No newline at end of file +} From bfbe5f4bf7e3805fd1830b64df659fe4f26c4b19 Mon Sep 17 00:00:00 2001 From: Lars Gyrup Brink Nielsen Date: Wed, 12 Oct 2022 20:29:29 +0000 Subject: [PATCH 026/109] docs: format MDX documents --- apps/docs/docs/cdk/overview.mdx | 2 +- apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx | 6 ++++-- apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx | 6 ++++-- .../docs/cdk/sub-modules/notifications/notifications.mdx | 6 ++++-- .../cdk/sub-modules/render-strategies/render-strategies.mdx | 6 ++++-- .../sub-modules/template-management/template-management.mdx | 6 ++++-- .../cdk/sub-modules/transformations/transformations.mdx | 6 ++++-- .../sub-modules/zone-configurations/zone-configurations.mdx | 6 ++++-- apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx | 6 ++++-- apps/docs/docs/contributing.mdx | 6 ++++-- apps/docs/docs/eslint-plugin/overview.mdx | 6 ++++-- apps/docs/docs/state/overview.mdx | 2 +- apps/docs/docs/template/overview.mdx | 4 ++-- 13 files changed, 44 insertions(+), 24 deletions(-) diff --git a/apps/docs/docs/cdk/overview.mdx b/apps/docs/docs/cdk/overview.mdx index 0abc429d79..f8f5dae821 100644 --- a/apps/docs/docs/cdk/overview.mdx +++ b/apps/docs/docs/cdk/overview.mdx @@ -9,4 +9,4 @@ import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx b/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx index 89d43f7f27..91f2ee21ff 100644 --- a/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx +++ b/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/coalescing overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/coalescing/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/coalescing/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx b/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx index 41ca8f97a7..b83cea9dfd 100644 --- a/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx +++ b/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/coercing overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/coercing/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/coercing/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx b/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx index a2c5b3f21a..4000d92318 100644 --- a/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx +++ b/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/notifications overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/notifications/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/notifications/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx b/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx index 793938e571..e5067252be 100644 --- a/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx +++ b/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/render-strategies overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/render-strategies/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/render-strategies/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx b/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx index 72b7ea0839..11c9a6bb8e 100644 --- a/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx +++ b/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/template overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/template/Readme.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/template/Readme.md'; -export const toc = [...ReadmeToc] +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx b/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx index 213197002a..8c3d4e0d04 100644 --- a/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx +++ b/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/transformations overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/transformations/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/transformations/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx index 4026d6d8f7..8609daccf8 100644 --- a/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx +++ b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/zone-configurations overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/zone-configurations/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/zone-configurations/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx b/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx index 821f853a9a..84a969cae8 100644 --- a/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx +++ b/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/cdk/zone-less overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/cdk/zone-less/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/cdk/zone-less/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/contributing.mdx b/apps/docs/docs/contributing.mdx index dabef1d40a..b0d89411b7 100644 --- a/apps/docs/docs/contributing.mdx +++ b/apps/docs/docs/contributing.mdx @@ -5,8 +5,10 @@ title: 'Contributing' hide_title: true --- -import Contributing, { toc as ContributingToc } from '@site/../../CONTRIBUTING.md' +import Contributing, { + toc as ContributingToc, +} from '@site/../../CONTRIBUTING.md'; -export const toc = [...ContributingToc]; \ No newline at end of file +export const toc = [...ContributingToc]; diff --git a/apps/docs/docs/eslint-plugin/overview.mdx b/apps/docs/docs/eslint-plugin/overview.mdx index dbe917d131..f59e0bea57 100644 --- a/apps/docs/docs/eslint-plugin/overview.mdx +++ b/apps/docs/docs/eslint-plugin/overview.mdx @@ -5,8 +5,10 @@ title: '@rx-angular/eslint-plugin overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/eslint-plugin/README.md'; +import Readme, { + toc as ReadmeToc, +} from '@site/../../libs/eslint-plugin/README.md'; -export const toc = [...ReadmeToc]; \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/state/overview.mdx b/apps/docs/docs/state/overview.mdx index 18e955aee4..323ad56876 100644 --- a/apps/docs/docs/state/overview.mdx +++ b/apps/docs/docs/state/overview.mdx @@ -9,4 +9,4 @@ import Readme, { toc as ReadmeToc } from '@site/../../libs/state/README.md'; -export const toc = [...ReadmeToc] \ No newline at end of file +export const toc = [...ReadmeToc]; diff --git a/apps/docs/docs/template/overview.mdx b/apps/docs/docs/template/overview.mdx index 3035f3c82e..884bad509c 100644 --- a/apps/docs/docs/template/overview.mdx +++ b/apps/docs/docs/template/overview.mdx @@ -5,8 +5,8 @@ title: '@rx-angular/template overview' hide_title: true --- -import Readme, { toc as ReadmeToc } from '@site/../../libs/template/README.md' +import Readme, { toc as ReadmeToc } from '@site/../../libs/template/README.md'; -export const toc = [...ReadmeToc]; \ No newline at end of file +export const toc = [...ReadmeToc]; From 8bfddc5b38af79c53b18a4ebc1ae3dbfa1758d24 Mon Sep 17 00:00:00 2001 From: Lars Gyrup Brink Nielsen Date: Wed, 12 Oct 2022 20:29:41 +0000 Subject: [PATCH 027/109] docs: format Markdown documents --- .../cdk/sub-modules/coalesing/resources.md | 1 + .../cdk/sub-modules/coercing/resources.md | 16 +-- .../sub-modules/notifications/resources.md | 96 ++++++++------- .../render-strategies/basic-strategies.md | 66 +++++----- .../concurrent-strategies.md | 113 ++++++++++-------- .../sub-modules/render-strategies/overview.md | 11 +- .../render-strategies/strategies.md | 3 +- .../render-strategies/strategy-provider.md | 45 +++---- .../cdk/sub-modules/zone-less/resources.md | 63 ++++------ apps/docs/docs/state/reactive-terminology.md | 2 +- apps/docs/docs/state/testing.md | 45 +++---- .../api/experimental/rx-for-directive.md | 1 - 12 files changed, 232 insertions(+), 230 deletions(-) diff --git a/apps/docs/docs/cdk/sub-modules/coalesing/resources.md b/apps/docs/docs/cdk/sub-modules/coalesing/resources.md index 26a83e16ae..9e16e35d44 100644 --- a/apps/docs/docs/cdk/sub-modules/coalesing/resources.md +++ b/apps/docs/docs/cdk/sub-modules/coalesing/resources.md @@ -38,6 +38,7 @@ There are 2 places in Angular we have coalescing already implemented in the fram - RxAngular adds another option where we can apply those techniques manually wherever we want. **The Benefits** + - ✅ Coalescing techniques as RxJS operators - ✅ Configurable durationSelector for all kind of scheduling methods - ✅ Scope coalescing to a specific component or object diff --git a/apps/docs/docs/cdk/sub-modules/coercing/resources.md b/apps/docs/docs/cdk/sub-modules/coercing/resources.md index e800bf8331..561f3b8604 100644 --- a/apps/docs/docs/cdk/sub-modules/coercing/resources.md +++ b/apps/docs/docs/cdk/sub-modules/coercing/resources.md @@ -6,13 +6,12 @@ A demo application is available on [GitHub](https://github.com/BioPhoton/rx-angu # Motivation Coercing, or to be more specific type coercion is the process of converting a value from one type to another. -This can be done with any primitive value in JavaScript. e.g. number, string, Symbol, boolean, null, undefined. +This can be done with any primitive value in JavaScript. e.g. number, string, Symbol, boolean, null, undefined. Another type where we also can apply coercing is the `Observable` type. ![coerceObservable](https://user-images.githubusercontent.com/10064416/129430812-1e4af911-fb42-4d61-a68a-4fb86e595113.png) - In practice you can apply this technique in 2 ways: - **explicitly** e.g. `Number(string)` coercres a string to a number @@ -163,7 +162,9 @@ This comes in handy for later processing and improves performance. }) export class AppComponent { _prop1 = new Subject>(); - prop1Observables$: Observable = this._prop1.pipe(coerceDistinctWith()); + prop1Observables$: Observable = this._prop1.pipe( + coerceDistinctWith() + ); @Input() set prop1(val: Observable | number) { @@ -199,8 +200,8 @@ A minimal implementation if it would look like this: export class AppComponent { _prop1 = new Subject>(); prop1Changes$: Observable = this._prop1.pipe( - coerceDistinctWith(), - switchAll() + coerceDistinctWith(), + switchAll() ); @Input() @@ -215,7 +216,6 @@ Here we apply the `switchAll` operator to unsubscribe the previouse observable a by using the `coerceAllFactory` function we can compose this pattern with less code and still have the option to decide on the way of compostion. - ```typescript @Component({ // ... @@ -223,7 +223,7 @@ by using the `coerceAllFactory` function we can compose this pattern with less c export class AppComponent { _prop1 = coerceAllFactory(); prop1Changes$: Observable = this._prop1.values$; - + @Input() set prop1(val: Observable | number) { this._prop1.next(val); @@ -233,7 +233,7 @@ export class AppComponent { Another benefit here is that only the `next` method is exposed. -By default a normal `Subject` is used and `switchAll` is applied. +By default a normal `Subject` is used and `switchAll` is applied. As there are quite some ways to process higher order observables the factory provides optional configuration parameter. ```typescript diff --git a/apps/docs/docs/cdk/sub-modules/notifications/resources.md b/apps/docs/docs/cdk/sub-modules/notifications/resources.md index aa58f1d578..e32b0ed53b 100644 --- a/apps/docs/docs/cdk/sub-modules/notifications/resources.md +++ b/apps/docs/docs/cdk/sub-modules/notifications/resources.md @@ -12,50 +12,45 @@ When dealing with asynchronouse code we always have some contextual information The a good example is a `[Promise](https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Promise)` used in a UI where you can list items and search them. The following states can apply to this UI: + - Initial loading of the list. (loading spinner) - Display of the data (The actual value is now given and displayed) - Error in the asynchronouse process (A error message is displayed) - Completion of the process (Communicates that the process is completed) - Subsquent search actions (loading spinner) - ```typescript @Component({ selector: 'any-component', template: ` - +

Count: {{ count }}

- - Negative Count - + Negative Count -

- Error! -

+

Error!

-

- Complete! -

+

Complete!

-

- Loading... -

+

Loading...

 - ` + `, }) -export class AnyComponent { +export class AnyComponent { // ... } ``` If we organize them visually 4 states, 3 of them contextual are given: + - **suspense** (communicating progress) - update/**next** (the result it self, or parts of it) - **error** (communicating error) @@ -73,33 +68,33 @@ A good example is the [`rxLet`](https://github.com/rx-angular/rx-angular/blob/ma @Component({ selector: 'any-component', template: ` -

+

Count: {{ count }}

- - Negative Count - - - - Error! - + Negative Count - - Complete! - + Error! - - Loading... - - ` + Complete! + + Loading... + `, }) -export class AnyComponent { +export class AnyComponent { // ... } ``` - **The Benefits** - ✅ A mental model for contextual state @@ -122,7 +117,7 @@ yarn add @rx-angular/cdk ## Usage -The whole section is about extending the notification channels with a 4th state. +The whole section is about extending the notification channels with a 4th state. The new type is called `RxNotifications`. In the following we will see a couple of helper functions that deal with that type. For wrapping a value into a RxNotification we provide 3 helpers: @@ -130,30 +125,39 @@ For wrapping a value into a RxNotification we provide 3 helpers: **RxErrorNotification** ```typescript - const errorNotification: RxErrorNotification = toRxErrorNotification(); - const errorNotification: RxErrorNotification = toRxErrorNotification(new Error()); - const errorNotification: RxErrorNotification = toRxErrorNotification(new Error(), 'lastValue'); +const errorNotification: RxErrorNotification = toRxErrorNotification(); +const errorNotification: RxErrorNotification = toRxErrorNotification( + new Error() +); +const errorNotification: RxErrorNotification = toRxErrorNotification( + new Error(), + 'lastValue' +); ``` **toRxSuspenseNotification** ```typescript - const toRxSuspenseNotification: RxSuspenseNotification = toRxSuspenseNotification(); - const toRxSuspenseNotification: RxSuspenseNotification = toRxSuspenseNotification('lastValue'); +const toRxSuspenseNotification: RxSuspenseNotification = + toRxSuspenseNotification(); +const toRxSuspenseNotification: RxSuspenseNotification = + toRxSuspenseNotification('lastValue'); ``` - + **toRxCompleteNotification** ```typescript - const toRxCompleteNotification: RxCompleteNotification = toRxCompleteNotification(); - const toRxCompleteNotification: RxCompleteNotification = toRxCompleteNotification('lastValue'); +const toRxCompleteNotification: RxCompleteNotification = + toRxCompleteNotification(); +const toRxCompleteNotification: RxCompleteNotification = + toRxCompleteNotification('lastValue'); ``` **rxMaterialize** ```typescript - const websocketUpdates$: Observable = interval(3000); - const materialized$: Observable> = websocketUpdates.pipe( - rxMaterialize() - ); +const websocketUpdates$: Observable = interval(3000); +const materialized$: Observable> = websocketUpdates.pipe( + rxMaterialize() +); ``` diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md b/apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md index 0111bd27a8..75d82f7ce7 100644 --- a/apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md +++ b/apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md @@ -8,6 +8,7 @@ To apply changes to a component template we need to re-evaluate the template. In This process will execute whenever a component's template is re-evaluated through `async`, `push`, `ChangedDetectorRef.detectChanges` or a structural directive template is re-evaluated through `EmbeddedView.detectChanges`. It can be pretty time consuming and directly depends on the following factors: + - HTML size (only for init and destroy and bundle-size) - JS size (only for init and destroy and bundle-size) - number of event bindings (only for init and destroy) @@ -20,27 +21,29 @@ Some of the problems related to work of Angular are: **Out of bound change detection:** If we perform this re-evaluation without any visual change for the user (over-rendering) we introduce noticeable performance degradations. -The out of bound change detection can be caused through: - - Zone pollution - - Missing ChangeDetectionStrategy.OnPush - - Component template projection - - Pull-based rendering processes - +The out of bound change detection can be caused through: + +- Zone pollution +- Missing ChangeDetectionStrategy.OnPush +- Component template projection +- Pull-based rendering processes + **Out of bound template evaluation:** -If we perform a re-evaluation of a single property in the template any other expression/binding also gets re-evaluated. +If we perform a re-evaluation of a single property in the template any other expression/binding also gets re-evaluated. Again over-rendering introduces noticeable performance degradations. The out of bound template evaluation can be caused through: - - Pull-based rendering processes - - any reactive change through `async` - - any call to `cdRef.detectChanges` +- Pull-based rendering processes +- any reactive change through `async` +- any call to `cdRef.detectChanges` **Work performed for out of viewport content:** If we perform a re-evaluation or even re-rendering of the DOM of elements outside of the viewport we perform useless work for the user. This will pollute the main thread and reduced time for more important content to get rendered. The re-evaluation or browser re-rendering can be caused by: + - Bad style changes - Big LCP (Largest Contentful Paint) elements - Large amount of content @@ -50,7 +53,7 @@ The re-evaluation or browser re-rendering can be caused by: ![ChangeDetection](https://user-images.githubusercontent.com/10064416/143149592-9a55eafc-3b44-412c-a146-acb777a2e777.png) The change detection system that is currently implemented in Angular is pull-based, but way more important, as a side effect it also runs CD globally. -It performs a re-rendering where at optimum every single component on the path from the root to the actual UI update needs to get re-evaluated. +It performs a re-rendering where at optimum every single component on the path from the root to the actual UI update needs to get re-evaluated. A lot of performed work is useless. Technically the methods to run change detection are `markForCheck` / `markViewDirty`, `ɵmarkDirty` and `tick`. @@ -61,32 +64,30 @@ Technically the methods we can use for it are `detectChanges` or `ɵdetectChange ![Render Strategies-global-vs-local](https://user-images.githubusercontent.com/10064416/143150010-fa01316a-acd9-4906-ab81-25a29336cf57.png) - ### Pull vs push based - ![Render Strategies-requext-subscribe](https://user-images.githubusercontent.com/10064416/143153116-782bec55-0353-4254-8fe5-5a16691ac320.png) Consuming value changes can be done by **constantly** watching the source for changes and **pull** them, - or subscribe to the changes like a DOM event binding **once** and get the changes **pushed**. +or subscribe to the changes like a DOM event binding **once** and get the changes **pushed**. In a simple setup the pull might be a quick solution and you just `.get()` the value, but a push based architecture always scales better. Compare it with HTTP calls vs WebSockets. -If we apply this concepts to our change detection mechanics we can directly apply changes where they are needd and skip nearly all the unnessecary work. +If we apply this concepts to our change detection mechanics we can directly apply changes where they are needd and skip nearly all the unnessecary work. In combination with Observables, and EmbeddedViews change detection can be speed up dramatically by this architecture. - + ![Render Strategies-pull-vs-push](https://user-images.githubusercontent.com/10064416/143150014-e83347e4-188c-447d-8d61-2fc3014f5abb.png) ### Strategies -| Name | Priority | Render Method | Scheduling | Render Deadline | -|-------------------------| -------- | ----------------- | ----------------------- | --------------- | -| `"native"` | ❌ | ⮁ `markForCheck` | `requestAnimationFrame` | N/A | +| Name | Priority | Render Method | Scheduling | Render Deadline | +| ------------------------- | -------- | ----------------- | ----------------------- | --------------- | +| `"native"` | ❌ | ⮁ `markForCheck` | `requestAnimationFrame` | N/A | | `"global"` - _deprecated_ | ❌ | ⮁ `ɵmarkDirty` | `requestAnimationFrame` | N/A | -| `"local"` | ❌ | 🠗 `detectChanges` | `requestAnimationFrame` | N/A | -| `"noop"` | ❌ | - `noop` | `requestAnimationFrame` | N/A | +| `"local"` | ❌ | 🠗 `detectChanges` | `requestAnimationFrame` | N/A | +| `"noop"` | ❌ | - `noop` | `requestAnimationFrame` | N/A | #### Native @@ -155,41 +156,32 @@ The no-operation strategy does nothing. It can be a valuable tool for performanc | ------ | ------------- | ------------- | ---------- | ---------- | | `noop` | ✔ | - `noop` | ❌ | ❌ | - ## Usage ### Component / Service ```ts -import {RxStrategyProvider} from '@rx-angular/cdk/render-strategies'; +import { RxStrategyProvider } from '@rx-angular/cdk/render-strategies'; @Component() class Component { - constructor(private strategyProvider: RxStrategyProvider) { - strategyProvider.schedule(() => {}, {strategyName: 'local'}) + strategyProvider.schedule(() => {}, { strategyName: 'local' }); } - } ``` ### Template ```ts -import {LetModule} from '@rx-angular/template/let'; -import {ForModule} from '@rx-angular/template/for'; -import {PushModule} from '@rx-angular/template/push'; +import { LetModule } from '@rx-angular/template/let'; +import { ForModule } from '@rx-angular/template/for'; +import { PushModule } from '@rx-angular/template/push'; @Module({ - imports: [ - LetModule, - ForModule, - PushModule - ] + imports: [LetModule, ForModule, PushModule], }) -class Module { - -} +class Module {} ``` ```html diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md b/apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md index 10e818dcbf..0bc3be3974 100644 --- a/apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md +++ b/apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md @@ -4,7 +4,9 @@ Based on the [RAIL model](https://web.dev/rail/), e.g. if your app provides anim From the UX perspective that means users should not experience blocking periods more than 16 ms. ## Concepts + There are 5 core concepts of the concurrent strategies: + - Frame budget / Frame drop - Scheduling - Priority @@ -48,11 +50,12 @@ When it comes to scripting work we can do 2 things to avoid that: - reduce scripting work and let the user interact earlier - chunk up work and use scheduling API's to distribute the work overtime and let the user interact in between. -It is often the case that the work just can't get reduced so we have to schedule. +It is often the case that the work just can't get reduced so we have to schedule. ![Render Strategies-Scheduling Detail View](https://user-images.githubusercontent.com/10064416/145210963-be6d2dc0-f4e3-4654-9f7f-f5221976ed0c.png) Some of the possible APIs are: + - queueMicrotask - setTimeout - postMessage @@ -70,7 +73,7 @@ A simple way to schedule work is using `setTimeout`. ```typescript function work(): viod { - concole.log('work done!'); + concole.log('work done!'); } const asyncId = setTimeout(work); @@ -84,11 +87,10 @@ This is important for cancellation and cleanup logic. ```typescript clearTimeout(asyncId); -``` +``` If we pass the asyncId as parameter to the `clearTimeout` function we can cancel the scheduling and `work` will never get executed. - ### Priority ![Render Strategies - priority abstract diagram png](https://user-images.githubusercontent.com/10064416/145228352-da3487fa-41c0-497b-a49a-c274bf531d32.png) @@ -102,7 +104,7 @@ Input handlers (tap, click etc.) often need to schedule a combination of differe To get the best user experience we should prioritize this tasks. -There are couple of scheduling APIs mentioned under scheduling. +There are couple of scheduling APIs mentioned under scheduling. They all help to prioritize the work and define the moment of execution differently. ![Render Strategies - scheduling techniques](https://user-images.githubusercontent.com/10064416/144139079-9f1d6ad7-ad7e-437c-95a2-8a794460f9c9.png) @@ -132,9 +134,10 @@ This scenario gets to a problem depending on: ![concurrent scheduling - abstract diagram](https://user-images.githubusercontent.com/10064416/145228577-6b8f0bb7-6547-4835-aecc-13d7e07baf02.png) Concurrent scheduling is a marketing term and simply means that there is a mechanism in place that knows how much time is spent in the current task. -This number is called frame budget and measured in milliseconds. As a result of this technique we're getting prioritized user-centric scheduling behaviours. +This number is called frame budget and measured in milliseconds. As a result of this technique we're getting prioritized user-centric scheduling behaviours. This enables: + - scheduling - cancellation - fine grained prioritization @@ -142,14 +145,14 @@ This enables: - render deadlines One of the first things to understand is the term "frame budget". -It means we have a maximum time (which is globally defined) a task can take before yielding to the main thread. e.g. 60frames/1000ms=16.6666ms animations or 50ms long task. +It means we have a maximum time (which is globally defined) a task can take before yielding to the main thread. e.g. 60frames/1000ms=16.6666ms animations or 50ms long task. Scheduling with notion of frame budget enables us to split work into individual browser tasks as soon as we exceed the budget. -We then yield to the main thread and are interactive again until the next batch of tasks will get processed. +We then yield to the main thread and are interactive again until the next batch of tasks will get processed. ![rx-angular-cdk-render-strategies__frame-budget](https://user-images.githubusercontent.com/10064416/115894224-4f098280-a459-11eb-9abf-9a902d66d380.png) -The special thing about the set of concurrent strategies is they have a render deadline. +The special thing about the set of concurrent strategies is they have a render deadline. It means if the scheduled tasks in the global queue of work is not exhausted after a certain time window, we stop the chunking process. Instead all remaining work will get executed as fast as possible. This means in one synchronous block (that potentially can causes a frame drop). @@ -196,10 +199,10 @@ Tooltips should be displayed immediately on mouse over. Any delay will be very n @Component({ selector: 'item-image', template: ` - `, }) @@ -209,21 +212,25 @@ export class ItemsListComponent { constructor(private strategyProvider: RxStrategyProvider) {} showTooltip() { - this.strategyProvider.schedule( - () => { - // create tooltip - }, - { strategy: 'immediate' } - ).subscribe(); + this.strategyProvider + .schedule( + () => { + // create tooltip + }, + { strategy: 'immediate' } + ) + .subscribe(); } hideTooltip() { - this.strategyProvider.schedule( - () => { - // destroy tooltip - }, - { strategy: 'immediate' } - ).subscribe(); + this.strategyProvider + .schedule( + () => { + // destroy tooltip + }, + { strategy: 'immediate' } + ) + .subscribe(); } } ``` @@ -279,12 +286,14 @@ export class DropdownComponent { } hideDropdown() { - this.strategyProvider.schedule( - () => { - // destroy dropdown - }, - { strategy: 'userBlocking' } - ).subscribe(); + this.strategyProvider + .schedule( + () => { + // destroy dropdown + }, + { strategy: 'userBlocking' } + ) + .subscribe(); } } ``` @@ -310,7 +319,7 @@ Heavy work visible to the user. For example, since it has a higher timeout, it i ![Render Strategies - normal example](https://user-images.githubusercontent.com/10064416/146285878-3b242f2d-046e-49ad-be2f-cbf1c33b7a02.png) -For `normal` strategy a perfect example will be rendering of the items list. +For `normal` strategy a perfect example will be rendering of the items list. It is often the case that rendering of big lists blocks user interactions. In combination with `rxFor` directive such operations become truly unblocking. @@ -373,11 +382,15 @@ export class ItemsListComponent { ) {} openCreateItemPopup() { - this.strategyProvider.schedule(() => { - // logic to lazy load popup component - }, {strategy: 'low'}).subscribe(); + this.strategyProvider + .schedule( + () => { + // logic to lazy load popup component + }, + { strategy: 'low' } + ) + .subscribe(); } - } ``` @@ -388,7 +401,7 @@ export class ItemsListComponent { ![render-strategies-concurrent-idle-tree](https://user-images.githubusercontent.com/10064416/146285889-8f98a92c-35dd-4632-9b3a-0eaf759790fc.png) -Urgent work that should happen in the background and is not initiated but visible by the user. This occurs right after current task and has the lowest priority. +Urgent work that should happen in the background and is not initiated but visible by the user. This occurs right after current task and has the lowest priority. | Render Method | Scheduling | Render Deadline | | ----------------- | ------------- | --------------- | @@ -425,20 +438,26 @@ export class ItemsListComponent { private strategyProvider: RxStrategyProvider, private webSocket: WebSocketService ) { - this.items$.pipe( - this.strategyProvider.scheduleWith( - items => this.webSocket.syncItems(items), - {strategy: 'idle'} - ) - ).subscribe(); + this.items$ + .pipe( + this.strategyProvider.scheduleWith( + (items) => this.webSocket.syncItems(items), + { strategy: 'idle' } + ) + ) + .subscribe(); } openCreateItemPopup() { - this.strategyProvider.schedule(() => { - // logic to lazy load popup component - }, {strategy: 'low'}).subscribe(); + this.strategyProvider + .schedule( + () => { + // logic to lazy load popup component + }, + { strategy: 'low' } + ) + .subscribe(); } - } ``` diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/overview.md b/apps/docs/docs/cdk/sub-modules/render-strategies/overview.md index 6ad9e79910..7390396eff 100644 --- a/apps/docs/docs/cdk/sub-modules/render-strategies/overview.md +++ b/apps/docs/docs/cdk/sub-modules/render-strategies/overview.md @@ -53,7 +53,6 @@ With these sets of strategies and the possibility of switching them at runtime w ![concurrent scheduling - abstract diagram](https://user-images.githubusercontent.com/10064416/145224962-04147632-f634-4025-a097-8135cdf9f3cc.png) - **Render strategies pave the way for truly non-blocking applications, targeted for any device or platform 🚀** + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx b/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx index 7faea8c850..653f26f3ff 100644 --- a/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx +++ b/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx b/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx index 37b89c74b8..79801fdbea 100644 --- a/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx +++ b/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx b/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx index d454cba8ea..a6f458a76b 100644 --- a/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx +++ b/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx b/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx index 52d2d3f078..2e9cc14a53 100644 --- a/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx +++ b/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx b/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx index a3b6df8f0b..5b75d0edd8 100644 --- a/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx +++ b/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx index 773d990cde..be1d21b619 100644 --- a/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx +++ b/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/contributing.mdx b/apps/docs/docs/contributing.mdx index 3ef2f3f005..849ac0529f 100644 --- a/apps/docs/docs/contributing.mdx +++ b/apps/docs/docs/contributing.mdx @@ -11,4 +11,7 @@ import Contributing, { + + + export const toc = [...contributingToc]; diff --git a/apps/docs/docs/eslint-plugin/overview.mdx b/apps/docs/docs/eslint-plugin/overview.mdx index 56caa7ec6d..b5ad2eca3f 100644 --- a/apps/docs/docs/eslint-plugin/overview.mdx +++ b/apps/docs/docs/eslint-plugin/overview.mdx @@ -11,4 +11,7 @@ import Readme, { + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/state/overview.mdx b/apps/docs/docs/state/overview.mdx index fb1a5e5a4b..5f141cf6fc 100644 --- a/apps/docs/docs/state/overview.mdx +++ b/apps/docs/docs/state/overview.mdx @@ -9,4 +9,7 @@ import Readme, { toc as readmeToc } from '@site/../../libs/state/README.md'; + + + export const toc = [...readmeToc]; diff --git a/apps/docs/docs/template/overview.mdx b/apps/docs/docs/template/overview.mdx index 02c8b091c4..3a57b7581e 100644 --- a/apps/docs/docs/template/overview.mdx +++ b/apps/docs/docs/template/overview.mdx @@ -9,4 +9,7 @@ import Readme, { toc as readmeToc } from '@site/../../libs/template/README.md'; + + + export const toc = [...readmeToc]; From 5dd7ac842fdd9e66c44d66d854c052fe629f0245 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 01:05:52 +0200 Subject: [PATCH 030/109] docs: move terminology docs into concepts path --- .../{ => concepts-and-best-practices}/reactive-terminology.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename apps/docs/docs/state/{ => concepts-and-best-practices}/reactive-terminology.md (100%) diff --git a/apps/docs/docs/state/reactive-terminology.md b/apps/docs/docs/state/concepts-and-best-practices/reactive-terminology.md similarity index 100% rename from apps/docs/docs/state/reactive-terminology.md rename to apps/docs/docs/state/concepts-and-best-practices/reactive-terminology.md From 3562e1abe14cc6f043e0414f47436cc99cb73a68 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 01:09:53 +0200 Subject: [PATCH 031/109] docs: position api link in sidebar as last item --- apps/docs/docs/cdk/api/_category_.json | 1 + apps/docs/docs/state/api/_category_.json | 2 +- .../docs/state/concepts-and-best-practices/_category_.json | 5 +++++ apps/docs/docs/state/{ => faq}/FAQ.md | 0 apps/docs/docs/state/faq/_category_.json | 5 +++++ apps/docs/docs/state/testing/_category_.json | 5 +++++ apps/docs/docs/state/{ => testing}/testing.md | 0 apps/docs/docs/template/api/_category_.json | 2 +- apps/docs/docs/template/concepts/_category_.json | 4 ++++ 9 files changed, 22 insertions(+), 2 deletions(-) create mode 100644 apps/docs/docs/state/concepts-and-best-practices/_category_.json rename apps/docs/docs/state/{ => faq}/FAQ.md (100%) create mode 100644 apps/docs/docs/state/faq/_category_.json create mode 100644 apps/docs/docs/state/testing/_category_.json rename apps/docs/docs/state/{ => testing}/testing.md (100%) create mode 100644 apps/docs/docs/template/concepts/_category_.json diff --git a/apps/docs/docs/cdk/api/_category_.json b/apps/docs/docs/cdk/api/_category_.json index 8ec0189c3a..7af0c3c625 100644 --- a/apps/docs/docs/cdk/api/_category_.json +++ b/apps/docs/docs/cdk/api/_category_.json @@ -1,4 +1,5 @@ { "label": "API", + "position": 2, "link": null } diff --git a/apps/docs/docs/state/api/_category_.json b/apps/docs/docs/state/api/_category_.json index 7af0c3c625..4e5fc563d8 100644 --- a/apps/docs/docs/state/api/_category_.json +++ b/apps/docs/docs/state/api/_category_.json @@ -1,5 +1,5 @@ { "label": "API", - "position": 2, + "position": 8, "link": null } diff --git a/apps/docs/docs/state/concepts-and-best-practices/_category_.json b/apps/docs/docs/state/concepts-and-best-practices/_category_.json new file mode 100644 index 0000000000..34fe12fbfa --- /dev/null +++ b/apps/docs/docs/state/concepts-and-best-practices/_category_.json @@ -0,0 +1,5 @@ +{ + "label": "Concepts and best practices", + "position": 5, + "link": null +} diff --git a/apps/docs/docs/state/FAQ.md b/apps/docs/docs/state/faq/FAQ.md similarity index 100% rename from apps/docs/docs/state/FAQ.md rename to apps/docs/docs/state/faq/FAQ.md diff --git a/apps/docs/docs/state/faq/_category_.json b/apps/docs/docs/state/faq/_category_.json new file mode 100644 index 0000000000..a99c8b5c4c --- /dev/null +++ b/apps/docs/docs/state/faq/_category_.json @@ -0,0 +1,5 @@ +{ + "label": "Frequently asked questions", + "position": 7, + "link": null +} diff --git a/apps/docs/docs/state/testing/_category_.json b/apps/docs/docs/state/testing/_category_.json new file mode 100644 index 0000000000..49b1c9d74b --- /dev/null +++ b/apps/docs/docs/state/testing/_category_.json @@ -0,0 +1,5 @@ +{ + "label": "Testing", + "position": 6, + "link": null +} diff --git a/apps/docs/docs/state/testing.md b/apps/docs/docs/state/testing/testing.md similarity index 100% rename from apps/docs/docs/state/testing.md rename to apps/docs/docs/state/testing/testing.md diff --git a/apps/docs/docs/template/api/_category_.json b/apps/docs/docs/template/api/_category_.json index 361de2003d..9b4f9d02e8 100644 --- a/apps/docs/docs/template/api/_category_.json +++ b/apps/docs/docs/template/api/_category_.json @@ -1,6 +1,6 @@ { "label": "API", - "position": 1, + "position": 2, "link": { "type": "generated-index", "description": "API reference @rx-angular/template" diff --git a/apps/docs/docs/template/concepts/_category_.json b/apps/docs/docs/template/concepts/_category_.json new file mode 100644 index 0000000000..1f83dbd0d2 --- /dev/null +++ b/apps/docs/docs/template/concepts/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Concepts", + "position": 1 +} From ad035c4e4142333ebbb7303c33976c7c69b27de0 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 01:13:48 +0200 Subject: [PATCH 032/109] docs: remove generated index for template api --- apps/docs/docs/template/api/_category_.json | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/apps/docs/docs/template/api/_category_.json b/apps/docs/docs/template/api/_category_.json index 9b4f9d02e8..7af0c3c625 100644 --- a/apps/docs/docs/template/api/_category_.json +++ b/apps/docs/docs/template/api/_category_.json @@ -1,8 +1,5 @@ { "label": "API", "position": 2, - "link": { - "type": "generated-index", - "description": "API reference @rx-angular/template" - } + "link": null } From d816ab766686ba1d2fe2284ca6273a40d48dba9c Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 01:17:44 +0200 Subject: [PATCH 033/109] docs: simplify sidebar section linking --- apps/docs/docs/cdk/_category_.json | 6 +----- apps/docs/docs/cdk/{overview.mdx => cdk.mdx} | 0 apps/docs/docs/eslint-plugin/_category_.json | 6 +----- .../docs/eslint-plugin/{overview.mdx => eslint-plugin.mdx} | 0 apps/docs/docs/state/_category_.json | 6 +----- apps/docs/docs/state/{overview.mdx => state.mdx} | 0 apps/docs/docs/template/_category_.json | 6 +----- apps/docs/docs/template/{overview.mdx => template.mdx} | 0 8 files changed, 4 insertions(+), 20 deletions(-) rename apps/docs/docs/cdk/{overview.mdx => cdk.mdx} (100%) rename apps/docs/docs/eslint-plugin/{overview.mdx => eslint-plugin.mdx} (100%) rename apps/docs/docs/state/{overview.mdx => state.mdx} (100%) rename apps/docs/docs/template/{overview.mdx => template.mdx} (100%) diff --git a/apps/docs/docs/cdk/_category_.json b/apps/docs/docs/cdk/_category_.json index 68a5a14625..499442772c 100644 --- a/apps/docs/docs/cdk/_category_.json +++ b/apps/docs/docs/cdk/_category_.json @@ -1,8 +1,4 @@ { "label": "@rx-angular/cdk", - "position": 3, - "link": { - "type": "doc", - "id": "cdk/overview" - } + "position": 3 } diff --git a/apps/docs/docs/cdk/overview.mdx b/apps/docs/docs/cdk/cdk.mdx similarity index 100% rename from apps/docs/docs/cdk/overview.mdx rename to apps/docs/docs/cdk/cdk.mdx diff --git a/apps/docs/docs/eslint-plugin/_category_.json b/apps/docs/docs/eslint-plugin/_category_.json index f1c6131225..80fcffc08e 100644 --- a/apps/docs/docs/eslint-plugin/_category_.json +++ b/apps/docs/docs/eslint-plugin/_category_.json @@ -1,8 +1,4 @@ { "label": "@rx-angular/eslint-plugin", - "position": 3, - "link": { - "type": "doc", - "id": "eslint-plugin/overview" - } + "position": 3 } diff --git a/apps/docs/docs/eslint-plugin/overview.mdx b/apps/docs/docs/eslint-plugin/eslint-plugin.mdx similarity index 100% rename from apps/docs/docs/eslint-plugin/overview.mdx rename to apps/docs/docs/eslint-plugin/eslint-plugin.mdx diff --git a/apps/docs/docs/state/_category_.json b/apps/docs/docs/state/_category_.json index 55334d509a..9688990ddb 100644 --- a/apps/docs/docs/state/_category_.json +++ b/apps/docs/docs/state/_category_.json @@ -1,8 +1,4 @@ { "label": "@rx-angular/state", - "position": 2, - "link": { - "type": "doc", - "id": "state/overview" - } + "position": 2 } diff --git a/apps/docs/docs/state/overview.mdx b/apps/docs/docs/state/state.mdx similarity index 100% rename from apps/docs/docs/state/overview.mdx rename to apps/docs/docs/state/state.mdx diff --git a/apps/docs/docs/template/_category_.json b/apps/docs/docs/template/_category_.json index 1e5d30698a..7b0d2da31a 100644 --- a/apps/docs/docs/template/_category_.json +++ b/apps/docs/docs/template/_category_.json @@ -1,8 +1,4 @@ { "label": "@rx-angular/template", - "position": 3, - "link": { - "type": "doc", - "id": "template/overview" - } + "position": 3 } diff --git a/apps/docs/docs/template/overview.mdx b/apps/docs/docs/template/template.mdx similarity index 100% rename from apps/docs/docs/template/overview.mdx rename to apps/docs/docs/template/template.mdx From 49ad56e4df1466d1034e9a301ccb0993bd4eca02 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 01:27:15 +0200 Subject: [PATCH 034/109] docs: correct path to implicitedependicy --- nx.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/nx.json b/nx.json index b2f3ffa3ac..9933e5747f 100644 --- a/nx.json +++ b/nx.json @@ -18,7 +18,7 @@ "libs/cdk/transformations/README.md": ["docs"], "libs/cdk/zone-configurations/README.md": ["docs"], "libs/cdk/zone-less/README.md": ["docs"], - "libs/cdk/template/README.md": ["docs"], + "libs/cdk/template/Readme.md": ["docs"], "libs/eslint-plugin/README.md": ["docs"], "libs/state/README.md": ["docs"], "libs/template/README.md": ["docs"] From 26d451f9f9dc757136e54f0d6164a3ee4f320206 Mon Sep 17 00:00:00 2001 From: Lars Gyrup Brink Nielsen Date: Thu, 13 Oct 2022 12:02:41 +0000 Subject: [PATCH 035/109] docs: correct Markdown document outlines This gives proper navigation menu item labels and table of contents. --- .../api/experimental/rx-for-directive.md | 16 +++++++------- .../api/experimental/rx-if-directive.md | 2 +- .../api/experimental/viewport-prio.md | 2 +- apps/docs/docs/template/api/let-directive.md | 22 +++++++++---------- .../docs/template/api/unpatch-directive.md | 2 +- 5 files changed, 22 insertions(+), 22 deletions(-) diff --git a/apps/docs/docs/template/api/experimental/rx-for-directive.md b/apps/docs/docs/template/api/experimental/rx-for-directive.md index 1f03d12899..e9e675381a 100644 --- a/apps/docs/docs/template/api/experimental/rx-for-directive.md +++ b/apps/docs/docs/template/api/experimental/rx-for-directive.md @@ -1,4 +1,4 @@ -## RxFor Directive +# RxFor Directive The `*rxFor` structural directive provides a convenient and performant way for rendering templates out of a list of items. @@ -13,7 +13,7 @@ Furthermore, `RxFor` provides access to the rendering cycle and informs about an However, the rendering behavior is fully configurable and transparent for the developer. Each instance of `RxFor` can be configured to render with different settings. -### Features of `*rxFor` +## Features of `*rxFor` Included features for `*rxFor`: @@ -28,7 +28,7 @@ Included features for `*rxFor`: - cancel any scheduled work if a remove was triggered for a `trackById` - cancel any update if a new update was triggered for the same `trackById` -### Simple example using `*rxFor` with `Observable` values +## Simple example using `*rxFor` with `Observable` values ```html
    @@ -36,7 +36,7 @@ Included features for `*rxFor`:
``` -### Simple example using `*rxFor` with simple static values +## Simple example using `*rxFor` with simple static values ```html
    @@ -44,7 +44,7 @@ Included features for `*rxFor`:
``` -### Context Variables +## Context Variables The following context variables are available for each template: @@ -80,7 +80,7 @@ This example showcases the `select` view-context function used for deeply nested ``` -### Input properties +## Input properties - trackBy: `(index: number, item: T) => any` - trackBy: `keyof T` @@ -89,7 +89,7 @@ This example showcases the `select` view-context function used for deeply nested - parent: `boolean`; - renderCallback: `Subject` -### Using the context variables +## Using the context variables ```html
    @@ -116,7 +116,7 @@ This example showcases the `select` view-context function used for deeply nested
``` -### Projected Views (`parent`) +## Projected Views (`parent`) Imagine the following situation: diff --git a/apps/docs/docs/template/api/experimental/rx-if-directive.md b/apps/docs/docs/template/api/experimental/rx-if-directive.md index 0b539963fe..ac122d43f9 100644 --- a/apps/docs/docs/template/api/experimental/rx-if-directive.md +++ b/apps/docs/docs/template/api/experimental/rx-if-directive.md @@ -1,3 +1,3 @@ -## 🧪 RxIf Directive +# 🧪 RxIf Directive _more info coming soon_ diff --git a/apps/docs/docs/template/api/experimental/viewport-prio.md b/apps/docs/docs/template/api/experimental/viewport-prio.md index e1b0ea670a..8afd700f8b 100644 --- a/apps/docs/docs/template/api/experimental/viewport-prio.md +++ b/apps/docs/docs/template/api/experimental/viewport-prio.md @@ -1,4 +1,4 @@ -## 🧪 ViewportPriority Directive +# 🧪 ViewportPriority Directive This directive limits renderings to only visible components. Should be used together with Noop strategy. diff --git a/apps/docs/docs/template/api/let-directive.md b/apps/docs/docs/template/api/let-directive.md index 77f97d5f85..09f7ce7a8d 100644 --- a/apps/docs/docs/template/api/let-directive.md +++ b/apps/docs/docs/template/api/let-directive.md @@ -1,4 +1,4 @@ -## LetDirective +# LetDirective The `*rxLet` directive serves a convenient way of binding observables to a view context. Furthermore, it helps you structure view-related models into view context scope (DOM element's scope). @@ -8,7 +8,7 @@ of your component. The `LetDirective` will render its template and manage change So if the incoming `Observable` emits its value lazily (e.g. data coming from `Http`), your template will be rendered lazily as well. This can very positively impact the initial render performance of your application. -### Problems with `async` and `*ngIf` +## Problems with `async` and `*ngIf` In Angular, a way of binding an observable to the view could look like that: @@ -28,7 +28,7 @@ you want to create a zone-less application, the `AsyncPipe` won't work as desire with its own strategies to manage change detection every time a new notification is sent from the bound Observable. -### Features of `*rxLet` +## Features of `*rxLet` Included features for `*rxLet`: @@ -42,7 +42,7 @@ Included features for `*rxLet`: - distinct same values in a row (`distinctUntilChanged` operator), - display custom templates for different observable notifications (suspense, next, error, complete) -### Binding an Observable and using the view context +## Binding an Observable and using the view context The `*rxLet` directive takes over several things and makes it more convenient and safe to work with streams in the template: @@ -74,7 +74,7 @@ We can track the observables: ``` -### Using the template-binding +## Using the template-binding You can also use template anchors and display template's content for different observable states: @@ -120,14 +120,14 @@ class LetDirective implements OnInit, OnDestroy { ### strategies -##### typeof: StrategySelection +#### typeof: StrategySelection All strategies initialized and registered for the `LetDirective`. Pass a name of one the `strategies` to the `strategy` input to switch between them on the fly. ### rxLet -##### typeof: ObservableInput<U> | null | undefined +#### typeof: ObservableInput<U> | null | undefined The Observable to be bound to the context of a template. @@ -141,7 +141,7 @@ _Example_ ### strategy -##### typeof: string | Observable<string> | undefined +#### typeof: string | Observable<string> | undefined The rendering strategy to be used when rendering with the reactive context within a template. Use it to dynamically manage your rendering strategy. You can switch the strategies @@ -180,7 +180,7 @@ export class AppComponent { ### rxLetComplete -##### typeof: TemplateRef<LetViewContext<U | undefined | null> | null> +#### typeof: TemplateRef<LetViewContext<U | undefined | null> | null> A template to show if the bound Observable is in "complete" state. @@ -197,7 +197,7 @@ _Example_ ### rxLetError -##### typeof: TemplateRef<LetViewContext<U | undefined | null> | null> +#### typeof: TemplateRef<LetViewContext<U | undefined | null> | null> A template to show if the bound Observable is in "error" state. @@ -214,7 +214,7 @@ _Example_ ### rxLetSuspense -##### typeof: TemplateRef<LetViewContext<U | undefined | null> | null> +#### typeof: TemplateRef<LetViewContext<U | undefined | null> | null> A template to show before the first value is emitted from the bound Observable. diff --git a/apps/docs/docs/template/api/unpatch-directive.md b/apps/docs/docs/template/api/unpatch-directive.md index c8ffa9f05d..2377a613fb 100644 --- a/apps/docs/docs/template/api/unpatch-directive.md +++ b/apps/docs/docs/template/api/unpatch-directive.md @@ -1,4 +1,4 @@ -## 🧪 UnpatchDirective +# 🧪 UnpatchDirective The `unpatch` directive helps developers to partially deactivate `NgZone`, as well as getting rid of unnecessary renderings through zones `addEventListener` patches. From b5beb8ad01d0b5901ddc62d5d03f06e927c3159c Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:15:32 +0200 Subject: [PATCH 036/109] docs: add missing footer links to docs app --- apps/docs/docusaurus.config.js | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/apps/docs/docusaurus.config.js b/apps/docs/docusaurus.config.js index 2561e5fc59..c2b5d81072 100644 --- a/apps/docs/docusaurus.config.js +++ b/apps/docs/docusaurus.config.js @@ -114,10 +114,14 @@ module.exports = { label: '@rx-angular/state', to: 'docs/state/getting-started/overview', }, - // { - // label: '@rx-angular/template', - // to: 'docs/template/', - // }, + { + label: '@rx-angular/template', + to: 'docs/template/', + }, + { + label: '@rx-angular/eslint-plugin', + to: 'docs/eslint-plugin/', + }, ], }, { From 9d6d8378a55af2f64b9172ea66ea312639ee60da Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:18:04 +0200 Subject: [PATCH 037/109] docs: fix footer links to path --- apps/docs/docusaurus.config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/docs/docusaurus.config.js b/apps/docs/docusaurus.config.js index c2b5d81072..ee24f466c1 100644 --- a/apps/docs/docusaurus.config.js +++ b/apps/docs/docusaurus.config.js @@ -108,11 +108,11 @@ module.exports = { items: [ { label: '@rx-angular/cdk', - to: 'docs/cdk/api/transformation-helpers', + to: 'docs/cdk/', }, { label: '@rx-angular/state', - to: 'docs/state/getting-started/overview', + to: 'docs/state/', }, { label: '@rx-angular/template', From 6fdbde3d6cb5741a57704b87c3e85a0369380a16 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:24:26 +0200 Subject: [PATCH 038/109] docs: add missing header nav links to docs app --- apps/docs/docusaurus.config.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/apps/docs/docusaurus.config.js b/apps/docs/docusaurus.config.js index ee24f466c1..20dbf18c54 100644 --- a/apps/docs/docusaurus.config.js +++ b/apps/docs/docusaurus.config.js @@ -80,12 +80,18 @@ module.exports = { position: 'left', type: 'doc', }, - // { - // docId: 'template/index', - // label: 'Template', - // position: 'left', - // type: 'doc', - // }, + { + docId: 'template/template', + label: 'Template', + position: 'left', + type: 'doc', + }, + { + docId: 'eslint-plugin/eslint-plugin', + label: 'ESLint-Plugin', + position: 'left', + type: 'doc' + }, // { to: 'blog', label: 'Blog', position: 'left' }, { href: `https://github.com/${organizationName}/${projectName}`, From 132352694a07a47a47cc08d9c630dafcbd168724 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:25:08 +0200 Subject: [PATCH 039/109] docs: fix header nav links to path --- apps/docs/docusaurus.config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/docs/docusaurus.config.js b/apps/docs/docusaurus.config.js index 20dbf18c54..98c1b049b9 100644 --- a/apps/docs/docusaurus.config.js +++ b/apps/docs/docusaurus.config.js @@ -69,13 +69,13 @@ module.exports = { // position: 'left', // }, { - docId: 'cdk/api/transformation-helpers/index', + docId: 'cdk/cdk', label: 'CDK', position: 'left', type: 'doc', }, { - docId: 'state/getting-started/overview', + docId: 'state/state', label: 'State', position: 'left', type: 'doc', From c2679b2a33cd37d4168a8cbc8a8420d012b96834 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:36:21 +0200 Subject: [PATCH 040/109] docs: add template link to landing page packeges --- apps/docs/src/components/HomepageFeatures/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/docs/src/components/HomepageFeatures/index.tsx b/apps/docs/src/components/HomepageFeatures/index.tsx index be87856834..8856190066 100644 --- a/apps/docs/src/components/HomepageFeatures/index.tsx +++ b/apps/docs/src/components/HomepageFeatures/index.tsx @@ -33,7 +33,7 @@ const FeatureList: FeatureItem[] = [ Svg: require('@site/static/img/undraw_rxangular_progressive_app.svg') .default, description: <>High-Performance Reactive Template Rendering for Angular., - url: null, + url: 'docs/template', }, ]; From 58ea9268b0c280fd7c7559bfce1dc347d018ab3a Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:37:23 +0200 Subject: [PATCH 041/109] docs: fix Markdown video link --- libs/state/README.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/libs/state/README.md b/libs/state/README.md index 06c09b4bbd..aebab83485 100644 --- a/libs/state/README.md +++ b/libs/state/README.md @@ -18,8 +18,7 @@ RxState is a lightweight, flexible, strongly typed and tested tool dedicated to ## Intro Video -![intro-video_rx-angular--state-rx-state](https://user-images.githubusercontent.com/10064416/147395467-876ec499-645f-4f84-bde9-9bffaac22c62.PNG) - +[![intro-video_rx-angular--state-rx-state](https://user-images.githubusercontent.com/10064416/147395467-876ec499-645f-4f84-bde9-9bffaac22c62.PNG)](https://www.youtube.com/watch?v=CcQYj4V2IKw) ## Description From 26f2fa34ae0dddbc6fe7141a558fbc71f748fbe7 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 13:42:44 +0200 Subject: [PATCH 042/109] docs: fix Markdown video link --- libs/state/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/libs/state/README.md b/libs/state/README.md index aebab83485..006f92b8cc 100644 --- a/libs/state/README.md +++ b/libs/state/README.md @@ -117,9 +117,9 @@ nx migrate @rx-angular/state ## Videos -![intro-video_rx-angular--state-rx-state](https://user-images.githubusercontent.com/10064416/147395467-876ec499-645f-4f84-bde9-9bffaac22c62.PNG)_🎥 RxAngular State, The Component Reactive Store | Marmicode Tasting Session_ +[![intro-video_rx-angular--state-rx-state](https://user-images.githubusercontent.com/10064416/147395467-876ec499-645f-4f84-bde9-9bffaac22c62.PNG)_🎥 RxAngular State, The Component Reactive Store | Marmicode Tasting Session_](https://www.youtube.com/watch?v=CcQYj4V2IKw) -![tackling-component-state-reactively](https://user-images.githubusercontent.com/10064416/147395866-031704dc-837d-4d1f-82d6-e758e4cb9556.PNG)_🎥 Tackling Component State Reactively (Live Demo at 24:47)_ +[![tackling-component-state-reactively](https://user-images.githubusercontent.com/10064416/147395866-031704dc-837d-4d1f-82d6-e758e4cb9556.PNG)_🎥 Tackling Component State Reactively (Live Demo at 24:47)_](https://www.youtube.com/watch?v=I8uaHMs8rw0) - [🎥 Extending Angular for the Reactive Web](https://youtu.be/pkN6CeZ8h_U?t=5913) From 16413e20a0d35eef5bd474f3d96ec6ed4a8a1cb9 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 14:28:38 +0200 Subject: [PATCH 043/109] docs: change template MD links to website links --- libs/template/README.md | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/libs/template/README.md b/libs/template/README.md index 94172410f7..1bb1f72465 100644 --- a/libs/template/README.md +++ b/libs/template/README.md @@ -19,14 +19,14 @@ structural directives, pipes, RxJS operators, or imperative functions to manage **@rx-angular/template** is nothing less than a revolution in `ChangeDetection` for angular applications. Developers are provided with tools for high-performance rendering, which are operated by a broad and intuitive API. -The [LetDirective (`*rxLet`)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/let-directive.md) & -[PushPipe (`push`)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/push-pipe.md) focus +The [LetDirective (`*rxLet`)](https://rx-angular.io/docs/template/api/let-directive) & +[PushPipe (`push`)](https://rx-angular.io/docs/template/api/push-pipe) focus on template rendering, the coordination and optimization of `ChangeDetection` cycles. While the `PushPipe` is a straight **drop-in replacement** for the `AsyncPipe (async)`, the `LetDirective` will often provide a more convenient way of managing reactive sources and lazy rendering of the view. -Should be noted that both [LetDirective (`*rxLet`)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/let-directive.md) & -[PushPipe (`push`)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/push.md) recognize only immutable changes. +Should be noted that both [LetDirective (`*rxLet`)](https://rx-angular.io/docs/template/api/let-directive) & +[PushPipe (`push`)](https://rx-angular.io/docs/template/api/push-pipe) recognize only immutable changes. Using those with the default strategy ([Local Strategy](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/docs/render-strategies/strategies.md#local)) should already improve the rendering performance of your application by a decent amount. @@ -41,8 +41,8 @@ Beyond the optimization of change detection cycles, `@rx-angular/template` by de If you want to deepen your knowledge about performance optimizations, consider reading through the following concepts and techniques: -- [Coalescing, Scoped Coalescing & Scheduling](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/concepts.md) -- [Rendering Issues in Angular](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/performance-issues.md) +- [Coalescing, Scoped Coalescing & Scheduling](https://rx-angular.io/docs/template/concepts) +- [Rendering Issues in Angular](https://rx-angular.io/docs/template/concepts/performance-issues) ## Installation @@ -96,19 +96,19 @@ export class MyModule {} ## Features - Directives - - [LetDirective (\*rxLet)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/let-directive.md) - - [UnpatchDirective (unpatch)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/unpatch-directive.md) + - [LetDirective (\*rxLet)](https://rx-angular.io/docs/template/api/let-directive) + - [UnpatchDirective (unpatch)](https://rx-angular.io/docs/template/unpatch-directive) - Pipes - - [PushPipe (push)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/push-pipe.md) + - [PushPipe (push)](https://rx-angular.io/docs/template/api/push-pipe) ## Experimental features Additionally, `@rx-angular/template` provides some experimental optimization tools which in general will give you more control about what changes are leading to re-renderings. -- [🧪 RxIf (\*rxIf)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/experimental/rx-if-directive.md) -- [🧪 RxFor (\*rxFor)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/experimental/rx-for-directive.md) -- [🧪 Viewport Priority (viewport-prio)](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/experimental/viewport-prio.md) +- [🧪 RxIf (\*rxIf)](https://rx-angular.io/docs/template/api/experimental/rx-if-directive) +- [🧪 RxFor (\*rxFor)](https://rx-angular.io/docs/template/api/experimental/rx-for-directive) +- [🧪 Viewport Priority (viewport-prio)](https://rx-angular.io/docs/template/api/experimental/viewport-prio) ## Version Compatibility From af4faa7f61be17a01e8a23e4850e8b996a48bcf0 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 14:46:36 +0200 Subject: [PATCH 044/109] docs: remove sub modules nav hierarchy --- .../docs/cdk/{sub-modules => }/coalesing/coalesing.mdx | 0 .../docs/cdk/{sub-modules => }/coalesing/resources.md | 0 .../docs/docs/cdk/{sub-modules => }/coercing/coercing.mdx | 0 .../docs/docs/cdk/{sub-modules => }/coercing/resources.md | 0 .../cdk/{sub-modules => }/notifications/notifications.mdx | 0 .../docs/cdk/{sub-modules => }/notifications/resources.md | 0 .../render-strategies/basic-strategies.md | 0 .../render-strategies/concurrent-strategies.md | 0 .../cdk/{sub-modules => }/render-strategies/overview.md | 0 .../render-strategies/render-strategies.mdx | 0 .../cdk/{sub-modules => }/render-strategies/strategies.md | 0 .../render-strategies/strategy-provider.md | 0 apps/docs/docs/cdk/sub-modules/_category_.json | 8 -------- .../template-management/template-management.mdx | 0 .../{sub-modules => }/transformations/transformations.mdx | 0 .../zone-configurations/how-to-debug-zone-flags.md | 0 .../zone-configurations/how-to-setup-zone-flags.md | 0 .../zone-configurations/zone-configurations.mdx | 0 .../{sub-modules => }/zone-configurations/zone-flags.md | 0 .../docs/cdk/{sub-modules => }/zone-less/resources.md | 0 .../docs/cdk/{sub-modules => }/zone-less/zone-less.mdx | 0 21 files changed, 8 deletions(-) rename apps/docs/docs/cdk/{sub-modules => }/coalesing/coalesing.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/coalesing/resources.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/coercing/coercing.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/coercing/resources.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/notifications/notifications.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/notifications/resources.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/render-strategies/basic-strategies.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/render-strategies/concurrent-strategies.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/render-strategies/overview.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/render-strategies/render-strategies.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/render-strategies/strategies.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/render-strategies/strategy-provider.md (100%) delete mode 100644 apps/docs/docs/cdk/sub-modules/_category_.json rename apps/docs/docs/cdk/{sub-modules => }/template-management/template-management.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/transformations/transformations.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/zone-configurations/how-to-debug-zone-flags.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/zone-configurations/how-to-setup-zone-flags.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/zone-configurations/zone-configurations.mdx (100%) rename apps/docs/docs/cdk/{sub-modules => }/zone-configurations/zone-flags.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/zone-less/resources.md (100%) rename apps/docs/docs/cdk/{sub-modules => }/zone-less/zone-less.mdx (100%) diff --git a/apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx b/apps/docs/docs/cdk/coalesing/coalesing.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/coalesing/coalesing.mdx rename to apps/docs/docs/cdk/coalesing/coalesing.mdx diff --git a/apps/docs/docs/cdk/sub-modules/coalesing/resources.md b/apps/docs/docs/cdk/coalesing/resources.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/coalesing/resources.md rename to apps/docs/docs/cdk/coalesing/resources.md diff --git a/apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx b/apps/docs/docs/cdk/coercing/coercing.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/coercing/coercing.mdx rename to apps/docs/docs/cdk/coercing/coercing.mdx diff --git a/apps/docs/docs/cdk/sub-modules/coercing/resources.md b/apps/docs/docs/cdk/coercing/resources.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/coercing/resources.md rename to apps/docs/docs/cdk/coercing/resources.md diff --git a/apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx b/apps/docs/docs/cdk/notifications/notifications.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/notifications/notifications.mdx rename to apps/docs/docs/cdk/notifications/notifications.mdx diff --git a/apps/docs/docs/cdk/sub-modules/notifications/resources.md b/apps/docs/docs/cdk/notifications/resources.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/notifications/resources.md rename to apps/docs/docs/cdk/notifications/resources.md diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md b/apps/docs/docs/cdk/render-strategies/basic-strategies.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/render-strategies/basic-strategies.md rename to apps/docs/docs/cdk/render-strategies/basic-strategies.md diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md b/apps/docs/docs/cdk/render-strategies/concurrent-strategies.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/render-strategies/concurrent-strategies.md rename to apps/docs/docs/cdk/render-strategies/concurrent-strategies.md diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/overview.md b/apps/docs/docs/cdk/render-strategies/overview.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/render-strategies/overview.md rename to apps/docs/docs/cdk/render-strategies/overview.md diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx b/apps/docs/docs/cdk/render-strategies/render-strategies.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/render-strategies/render-strategies.mdx rename to apps/docs/docs/cdk/render-strategies/render-strategies.mdx diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/strategies.md b/apps/docs/docs/cdk/render-strategies/strategies.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/render-strategies/strategies.md rename to apps/docs/docs/cdk/render-strategies/strategies.md diff --git a/apps/docs/docs/cdk/sub-modules/render-strategies/strategy-provider.md b/apps/docs/docs/cdk/render-strategies/strategy-provider.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/render-strategies/strategy-provider.md rename to apps/docs/docs/cdk/render-strategies/strategy-provider.md diff --git a/apps/docs/docs/cdk/sub-modules/_category_.json b/apps/docs/docs/cdk/sub-modules/_category_.json deleted file mode 100644 index ebe0c1790a..0000000000 --- a/apps/docs/docs/cdk/sub-modules/_category_.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "label": "Sub Modules", - "position": 1, - "link": { - "type": "generated-index", - "description": "Sub Modules in @rx-angular/cdk" - } -} diff --git a/apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx b/apps/docs/docs/cdk/template-management/template-management.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/template-management/template-management.mdx rename to apps/docs/docs/cdk/template-management/template-management.mdx diff --git a/apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx b/apps/docs/docs/cdk/transformations/transformations.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/transformations/transformations.mdx rename to apps/docs/docs/cdk/transformations/transformations.mdx diff --git a/apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-debug-zone-flags.md b/apps/docs/docs/cdk/zone-configurations/how-to-debug-zone-flags.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-debug-zone-flags.md rename to apps/docs/docs/cdk/zone-configurations/how-to-debug-zone-flags.md diff --git a/apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-setup-zone-flags.md b/apps/docs/docs/cdk/zone-configurations/how-to-setup-zone-flags.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/zone-configurations/how-to-setup-zone-flags.md rename to apps/docs/docs/cdk/zone-configurations/how-to-setup-zone-flags.md diff --git a/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx b/apps/docs/docs/cdk/zone-configurations/zone-configurations.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/zone-configurations/zone-configurations.mdx rename to apps/docs/docs/cdk/zone-configurations/zone-configurations.mdx diff --git a/apps/docs/docs/cdk/sub-modules/zone-configurations/zone-flags.md b/apps/docs/docs/cdk/zone-configurations/zone-flags.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/zone-configurations/zone-flags.md rename to apps/docs/docs/cdk/zone-configurations/zone-flags.md diff --git a/apps/docs/docs/cdk/sub-modules/zone-less/resources.md b/apps/docs/docs/cdk/zone-less/resources.md similarity index 100% rename from apps/docs/docs/cdk/sub-modules/zone-less/resources.md rename to apps/docs/docs/cdk/zone-less/resources.md diff --git a/apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx b/apps/docs/docs/cdk/zone-less/zone-less.mdx similarity index 100% rename from apps/docs/docs/cdk/sub-modules/zone-less/zone-less.mdx rename to apps/docs/docs/cdk/zone-less/zone-less.mdx From 908654cd7b77e88e31608802f316beeb0a441029 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 15:20:35 +0200 Subject: [PATCH 045/109] docs: change eslint MD links to website links --- libs/eslint-plugin/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/libs/eslint-plugin/README.md b/libs/eslint-plugin/README.md index 1b47d05296..3b0930e232 100644 --- a/libs/eslint-plugin/README.md +++ b/libs/eslint-plugin/README.md @@ -42,8 +42,8 @@ Alternatively, if you prefer a more manual approach, add the plugin to your ESLi This plugin has two pre-defined configurations for different scenarios: - `@rx-angular/recommended` is recommended for most Angular applications, -- `@rx-angular/zoneless` is a stricter configuration for applications that aspire to [avoid triggering Zone.js](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-less/docs). +- `@rx-angular/zoneless` is a stricter configuration for applications that aspire to [avoid triggering Zone.js](https://rx-angular.io/docs/cdk/zone-less). ## Rules -Documentation for individual rules may be found [here](https://github.com/rx-angular/rx-angular/tree/main/libs/eslint-plugin/docs/rules/). +Documentation for individual rules may be found [here](https://rx-angular.io/docs/category/eslint-rules). From 26a63865046a888b74e91d7a07ba8e674cf0ecf4 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 15:47:46 +0200 Subject: [PATCH 046/109] docs: change cdk/template Readme.md to README.md --- apps/docs/docs/cdk/template-management/template-management.mdx | 2 +- libs/cdk/template/{Readme.md => README.md} | 0 nx.json | 2 +- 3 files changed, 2 insertions(+), 2 deletions(-) rename libs/cdk/template/{Readme.md => README.md} (100%) diff --git a/apps/docs/docs/cdk/template-management/template-management.mdx b/apps/docs/docs/cdk/template-management/template-management.mdx index 5b75d0edd8..29263ecd82 100644 --- a/apps/docs/docs/cdk/template-management/template-management.mdx +++ b/apps/docs/docs/cdk/template-management/template-management.mdx @@ -7,7 +7,7 @@ hide_title: true import Readme, { toc as readmeToc, -} from '@site/../../libs/cdk/template/Readme.md'; +} from '@site/../../libs/cdk/template/README.md'; diff --git a/libs/cdk/template/Readme.md b/libs/cdk/template/README.md similarity index 100% rename from libs/cdk/template/Readme.md rename to libs/cdk/template/README.md diff --git a/nx.json b/nx.json index 9933e5747f..b2f3ffa3ac 100644 --- a/nx.json +++ b/nx.json @@ -18,7 +18,7 @@ "libs/cdk/transformations/README.md": ["docs"], "libs/cdk/zone-configurations/README.md": ["docs"], "libs/cdk/zone-less/README.md": ["docs"], - "libs/cdk/template/Readme.md": ["docs"], + "libs/cdk/template/README.md": ["docs"], "libs/eslint-plugin/README.md": ["docs"], "libs/state/README.md": ["docs"], "libs/template/README.md": ["docs"] From bf57334c79177f3507846afb4ef95fd08512bbab Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 16:00:25 +0200 Subject: [PATCH 047/109] docs: change template links to relative file paths --- apps/docs/docs/template/api/push-pipe.md | 4 ++-- apps/docs/docs/template/api/unpatch-directive.md | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/docs/docs/template/api/push-pipe.md b/apps/docs/docs/template/api/push-pipe.md index 3794491fcc..7aa3f5988a 100644 --- a/apps/docs/docs/template/api/push-pipe.md +++ b/apps/docs/docs/template/api/push-pipe.md @@ -18,7 +18,7 @@ components and does not work in zone-less mode. ## Solution -`push` pipe solves that problem. It contains intelligent handling of change detection by leveraging a [RenderStrategy](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/render-strategies/README.md) under the hood, which in turn, takes care of optimizing the `ChangeDetection` of your component. The `push` pipe can be used in zone-full as well as zone-less mode without any changes to the code. +`push` pipe solves that problem. It contains intelligent handling of change detection by leveraging a [RenderStrategy](./../../cdk/render-strategies/render-strategies.mdx) under the hood, which in turn, takes care of optimizing the `ChangeDetection` of your component. The `push` pipe can be used in zone-full as well as zone-less mode without any changes to the code. _Example_ @@ -42,7 +42,7 @@ _Example_ - Handling null and undefined values in a clean unified/structured way - Distinct same values in a row to increase performance - Coalescing of change detection calls to boost performance -- Lazy rendering (see [LetDirective](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/api/let-directive.md)) +- Lazy rendering (see [LetDirective](let-directive.md)) - Chunked rendering ## Signature diff --git a/apps/docs/docs/template/api/unpatch-directive.md b/apps/docs/docs/template/api/unpatch-directive.md index 2377a613fb..8f79d438bb 100644 --- a/apps/docs/docs/template/api/unpatch-directive.md +++ b/apps/docs/docs/template/api/unpatch-directive.md @@ -12,7 +12,7 @@ The current way of binding events to DOM: ``` The problem is that every event registered via `()`, e.g. `(mousemove)` (or custom `@Output()`) -marks the component and all its ancestors as dirty and re-renders the whole component tree. [read more about this here](https://github.com/rx-angular/rx-angular/tree/main/libs/template/docs/performance-issues.md) +marks the component and all its ancestors as dirty and re-renders the whole component tree. [read more about this here](../concepts/performance-issues.md) So even if your eventListener is not related to any change at all, your app will re-render the whole component tree. This can lead to very bad user experiences, especially if you work with frequently fired events such as `mousemove`. From c056fb857ed1a074e3eba2eccd9dc1317c54cbbb Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 17:00:19 +0200 Subject: [PATCH 048/109] docs: change libs/cdk MD link to website --- libs/cdk/README.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/libs/cdk/README.md b/libs/cdk/README.md index 9dad63ab3b..d86dc3f456 100644 --- a/libs/cdk/README.md +++ b/libs/cdk/README.md @@ -14,14 +14,14 @@ applications ## Sub Modules -- [⛔ Zone Configuration](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/zone-configurations) -- [🚫 Zone Less](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/zone-less) -- [🛠 Coercing](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/coercing) -- [🛠 Coalescing](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/coalescing) -- [📡 Notifications](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/notifications) -- [🖌 Render-Strategies](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/render-strategies) -- [🔳 Template Management](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/template) -- [🔳 Transformations](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/transformations) +- [⛔ Zone Configuration](https://rx-angular.io/docs/cdk/zone-configurations) +- [🚫 Zone Less](https://rx-angular.io/docs/cdk/zone-less) +- [🛠 Coercing](https://rx-angular.io/docs/cdk/coercing) +- [🛠 Coalescing](https://rx-angular.io/docs/cdk/coalescing) +- [📡 Notifications](https://rx-angular.io/docs/cdk/notifications) +- [🖌 Render-Strategies](https://rx-angular.io/docs/cdk/render-strategies) +- [🔳 Template Management](https://rx-angular.io/docs/cdk/template) +- [🔳 Transformations](https://rx-angular.io/docs/cdk/transformations) ## Demos: From 20edc28923457b0a50ea5d558bd4d9498fb9fdc3 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 17:01:07 +0200 Subject: [PATCH 049/109] docs: change demos app MD links to website --- .../src/app/features/template/render-callback/renderCallback.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/demos/src/app/features/template/render-callback/renderCallback.md b/apps/demos/src/app/features/template/render-callback/renderCallback.md index 7cba5956bd..a03be3867e 100644 --- a/apps/demos/src/app/features/template/render-callback/renderCallback.md +++ b/apps/demos/src/app/features/template/render-callback/renderCallback.md @@ -15,7 +15,7 @@ `LetDirective` as `@ViewChild()` and subscribe the event manually or providing a RenderCallback on your own. Please note that due to the built-in - [coalescing][https://github.com/rx-angular/rx-angular/blob/main/libs/template/docs/concepts.md] can cause this + [coalescing][https://rx-angular.io/docs/template/concepts] can cause this callback different in situations where multiple `LetDirectives` are used to render the same `Component`. Make sure to subscribe to every instance in your component to avoid missing render notifications. From b92a7d917ae5e3f815886c03ad46564d942ec048 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 17:02:47 +0200 Subject: [PATCH 050/109] docs: change cdk docs links to relative file paths --- apps/docs/docs/cdk/notifications/resources.md | 2 +- apps/docs/docs/cdk/render-strategies/overview.md | 6 +++--- apps/docs/docs/cdk/render-strategies/strategies.md | 4 ++-- apps/docs/docs/cdk/render-strategies/strategy-provider.md | 4 ++-- apps/docs/docs/cdk/zone-less/resources.md | 2 +- 5 files changed, 9 insertions(+), 9 deletions(-) diff --git a/apps/docs/docs/cdk/notifications/resources.md b/apps/docs/docs/cdk/notifications/resources.md index e32b0ed53b..ff34cacd85 100644 --- a/apps/docs/docs/cdk/notifications/resources.md +++ b/apps/docs/docs/cdk/notifications/resources.md @@ -62,7 +62,7 @@ For those states we use the term **reactive context** which includes the state a Whith this concept we can create helpers that support to implement the handling of reactive context in a more elegant way. -A good example is the [`rxLet`](https://github.com/rx-angular/rx-angular/blob/main/libs/template/docs/api/let-directive.md) directive: +A good example is the [`rxLet`](../../template/api/let-directive.md) directive: ```typescript @Component({ diff --git a/apps/docs/docs/cdk/render-strategies/overview.md b/apps/docs/docs/cdk/render-strategies/overview.md index 7390396eff..62b9bc7e85 100644 --- a/apps/docs/docs/cdk/render-strategies/overview.md +++ b/apps/docs/docs/cdk/render-strategies/overview.md @@ -15,7 +15,7 @@ Furthermore, they provide new ways of explicitly tying truly push-based state ma A strategy exposes the work to perform (e.g. `cdRef#markForCheck`, `cdRef#detectChanges`) as well as the scheduling mechanism to developers for configuration & customization via the interface `RxStrategyCredentials`. -`Directive`s, `Service`s or `Component`s of your application can make use of these strategies as an easy API for the key [concepts](https://github.com/rx-angular/rx-angular/blob/main/libs/template/docs/concepts.md) of rendering performance. +`Directive`s, `Service`s or `Component`s of your application can make use of these strategies as an easy API for the key [concepts](../../template/concepts/concepts.md) of rendering performance. This architecture enables modern features like: @@ -31,7 +31,7 @@ This architecture enables modern features like: **BasicStrategies** -[BasicStrategies](https://github.com/rx-angular/rx-angular/blob/master/libs/cdk/render-strategies/docs/basic-strategies.md) wrap modern ivy APIs like `ɵmarkDirty` and `ɵdetectChanges` as well as a strategy to "noop" change detection. +[BasicStrategies](basic-strategies.md) wrap modern ivy APIs like `ɵmarkDirty` and `ɵdetectChanges` as well as a strategy to "noop" change detection. As a fallback for the migration process or comparison testing, Angulars default change detection behaviour is also provided as a strategy. This set aims to get the first option for zone-less rendering (`ɵmarkDirty`), more control on the top-down process, and improve performance drastically by only rendering components that received updates. @@ -40,7 +40,7 @@ This set aims to get the first option for zone-less rendering (`ɵmarkDirty`), m **ConcurrentStrategies** -The [ConcurrentStrategies](https://github.com/rx-angular/rx-angular/blob/master/libs/cdk/render-strategies/docs/concurrent-strategies.md) utilize the latest technologies to enable priority-based change detection for non-blocking rendering and smooth user experiences. It combines the most performant scheduling techniques with a highly performant queueing mechanism. +The [ConcurrentStrategies](concurrent-strategies.md) utilize the latest technologies to enable priority-based change detection for non-blocking rendering and smooth user experiences. It combines the most performant scheduling techniques with a highly performant queueing mechanism. Read more about the internal techniques [here](https://www.npmjs.com/package/scheduler) or [here](https://github.com/WICG/scheduling-apis). The name **ConcurrentStrategies** implies that concepts of [react concurrent mode](https://reactjs.org/docs/concurrent-mode-intro.html) are transported into the world of Angular. diff --git a/apps/docs/docs/cdk/render-strategies/strategies.md b/apps/docs/docs/cdk/render-strategies/strategies.md index 63621f4a3c..4ce5fb2a01 100644 --- a/apps/docs/docs/cdk/render-strategies/strategies.md +++ b/apps/docs/docs/cdk/render-strategies/strategies.md @@ -21,8 +21,8 @@ Strategies give us a way to control how Angular's rendering is executed and whic **Strategy Sets:** -- [Basic Strategies](https://github.com/rx-angular/rx-angular/blob/master/libs/cdk/render-strategies/docs/basic-strategies.md) -- [Concurrent Strategies](https://github.com/rx-angular/rx-angular/blob/master/libs/cdk/render-strategies/docs/concurrent-strategies.md) +- [Basic Strategies](basic-strategies.md) +- [Concurrent Strategies](concurrent-strategies.md) ## Usage diff --git a/apps/docs/docs/cdk/render-strategies/strategy-provider.md b/apps/docs/docs/cdk/render-strategies/strategy-provider.md index 21b4f32dc2..b40d5a15d0 100644 --- a/apps/docs/docs/cdk/render-strategies/strategy-provider.md +++ b/apps/docs/docs/cdk/render-strategies/strategy-provider.md @@ -28,7 +28,7 @@ None of them has a full notion about what happens in the browser and can be unre To address the problem of long tasks and help browser split the work @rx-angular/cdk provides concurrent strategies. This strategies will help browser to chunk the work into non-blocking tasks whenever it's possible. -You can read detailed information about concurrent strategies [here](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/render-strategies/docs/concurrent-strategies.md). +You can read detailed information about concurrent strategies [here](concurrent-strategies.md). ## RxStrategyProvider APIs @@ -208,5 +208,5 @@ this.strategyProvider.scheduleCd(this.changeDetectorRef, { afterCD: myWork() }); ## Links - [Demo](https://stackblitz.com/edit/angular-ivy-1vfpoe) -- [Detailed information about strategies](https://github.com/rx-angular/rx-angular/tree/master/libs/cdk/render-strategies) +- [Detailed information about strategies](render-strategies.mdx) - [MessageChannel documentation](https://developer.mozilla.org/en-US/docs/Web/API/MessageChannel) diff --git a/apps/docs/docs/cdk/zone-less/resources.md b/apps/docs/docs/cdk/zone-less/resources.md index 3efbce2225..9c5eeb024a 100644 --- a/apps/docs/docs/cdk/zone-less/resources.md +++ b/apps/docs/docs/cdk/zone-less/resources.md @@ -185,4 +185,4 @@ The downside here is we need to inject `NgZone` and rely on dependency injection Zone configuration is a less granular way to disable zone. It helps to cinfigure zone in a way where it don't patches specific API's at all. -You can read in detail about it in the docs of [`@rx-angular/cdk/zone-configuration`](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/zone-configurations/docs/zone-flags.md). +You can read in detail about it in the docs of [`@rx-angular/cdk/zone-configuration`](../zone-configurations/zone-configurations.mdx). From ea92b75ffae7dad37098a3c9123600a5b10296a6 Mon Sep 17 00:00:00 2001 From: Chris Date: Thu, 13 Oct 2022 17:09:40 +0200 Subject: [PATCH 051/109] docs: change state docs links to relative paths --- apps/docs/docs/state/recipes/manage-viewmodel.md | 2 +- apps/docs/docs/state/tutorials/migrating-to-rxstate.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/docs/docs/state/recipes/manage-viewmodel.md b/apps/docs/docs/state/recipes/manage-viewmodel.md index 1724ff4841..4e2adda670 100644 --- a/apps/docs/docs/state/recipes/manage-viewmodel.md +++ b/apps/docs/docs/state/recipes/manage-viewmodel.md @@ -7,7 +7,7 @@ title: Selecting the ViewModel # Selecting the ViewModel -Here are some useful strategies to properly handle `ViewModels` with `@rx-angular/state`. In this examples we will use standalone [`selectSlice`](https://github.com/rx-angular/rx-angular/blob/main/libs/state/docs/api/operators/select-slice.md) operator. +Here are some useful strategies to properly handle `ViewModels` with `@rx-angular/state`. In this examples we will use standalone [`selectSlice`](../api/rxjs-operators/select-slice.md) operator. Imagine the following setup: diff --git a/apps/docs/docs/state/tutorials/migrating-to-rxstate.md b/apps/docs/docs/state/tutorials/migrating-to-rxstate.md index 8b7fbe8e0c..3fdf8df460 100644 --- a/apps/docs/docs/state/tutorials/migrating-to-rxstate.md +++ b/apps/docs/docs/state/tutorials/migrating-to-rxstate.md @@ -426,7 +426,7 @@ constructor(private api: TodoApiService, private state: RxState) { Note that we removed `withLatestFrom(this.tasks$)` in favor of the `projectionFunction` in `connect`. First we define fields to be updated, then the source of the changes and lastly we provide the `projectionFunction`. The functions' first first argument is the current state, the second is the change coming from -our source. More on possible `connect` variants [here](https://github.com/rx-angular/rx-angular/blob/main/libs/state/docs/api/rx-state.md#connect). +our source. More on possible `connect` variants [here](../api/rx-state.md#connect). **Full component code** From 3799db1ab0ccb0e71ab8849475e7a477de261f0b Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 11:53:31 +0200 Subject: [PATCH 052/109] docs: change main readme links to website docs --- README.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index 025c21cb3f..766f52c161 100644 --- a/README.md +++ b/README.md @@ -7,10 +7,10 @@ performance and template rendering. RxAngular is divided into different packages: -- [📦@rx-angular/cdk](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/README.md) -- [📦@rx-angular/eslint-plugin](https://github.com/rx-angular/rx-angular/tree/main/libs/eslint-plugin/README.md) -- [📦@rx-angular/state](https://github.com/rx-angular/rx-angular/tree/main/libs/state/README.md) -- [📦@rx-angular/template](https://github.com/rx-angular/rx-angular/tree/main/libs/template/README.md) +- [📦@rx-angular/cdk](https://rx-angular.io/docs/cdk) +- [📦@rx-angular/eslint-plugin](https://rx-angular.io/docs/eslint-plugin) +- [📦@rx-angular/state](https://rx-angular.io/docs/state) +- [📦@rx-angular/template](https://rx-angular.io/docs/template) Used together, you get a powerful tool for developing high-performance angular applications with or without NgZone. @@ -63,12 +63,12 @@ This repository holds a set of helpers to create **fully reactive** as well as * ## Packages -Find details in the linked readme files below for installation and setup instructions, examples and resources. +Find details in the links to the official docs below for installation and setup instructions, examples and resources. -- [📦@rx-angular/cdk](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/README.md) - Component Development Kit -- [📦@rx-angular/eslint-plugin](https://github.com/rx-angular/rx-angular/tree/main/libs/eslint-plugin/README.md) - ESLint Plugin -- [📦@rx-angular/state](https://github.com/rx-angular/rx-angular/tree/main/libs/state/README.md) - Imperative & Reactive Component State-Management -- [📦@rx-angular/template](https://github.com/rx-angular/rx-angular/tree/main/libs/template/README.md) - High-Performance Non-Blocking Rendering +- [📦@rx-angular/cdk](https://rx-angular.io/docs/cdk) - Component Development Kit +- [📦@rx-angular/eslint-plugin](https://rx-angular.io/docs/eslint-plugin) - ESLint Plugin +- [📦@rx-angular/state](https://rx-angular.io/docs/state) - Imperative & Reactive Component State-Management +- [📦@rx-angular/template](https://rx-angular.io/docs/template) - High-Performance Non-Blocking Rendering ## Version Compatibility From 50afe5b53d6a5651267adcd302977a08bd3975a7 Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 12:02:19 +0200 Subject: [PATCH 053/109] docs: revert sidebar order to default alphabetical --- apps/docs/docs/cdk/_category_.json | 3 +-- apps/docs/docs/contributing.mdx | 1 - apps/docs/docs/eslint-plugin/_category_.json | 3 +-- apps/docs/docs/state/_category_.json | 3 +-- apps/docs/docs/template/_category_.json | 3 +-- 5 files changed, 4 insertions(+), 9 deletions(-) diff --git a/apps/docs/docs/cdk/_category_.json b/apps/docs/docs/cdk/_category_.json index 499442772c..111d9f8584 100644 --- a/apps/docs/docs/cdk/_category_.json +++ b/apps/docs/docs/cdk/_category_.json @@ -1,4 +1,3 @@ { - "label": "@rx-angular/cdk", - "position": 3 + "label": "@rx-angular/cdk" } diff --git a/apps/docs/docs/contributing.mdx b/apps/docs/docs/contributing.mdx index 849ac0529f..fec1659c8b 100644 --- a/apps/docs/docs/contributing.mdx +++ b/apps/docs/docs/contributing.mdx @@ -1,6 +1,5 @@ --- sidebar_label: 'Contributing' -sidebar_position: 5 title: 'Contributing' hide_title: true --- diff --git a/apps/docs/docs/eslint-plugin/_category_.json b/apps/docs/docs/eslint-plugin/_category_.json index 80fcffc08e..098a426f26 100644 --- a/apps/docs/docs/eslint-plugin/_category_.json +++ b/apps/docs/docs/eslint-plugin/_category_.json @@ -1,4 +1,3 @@ { - "label": "@rx-angular/eslint-plugin", - "position": 3 + "label": "@rx-angular/eslint-plugin" } diff --git a/apps/docs/docs/state/_category_.json b/apps/docs/docs/state/_category_.json index 9688990ddb..979a643d40 100644 --- a/apps/docs/docs/state/_category_.json +++ b/apps/docs/docs/state/_category_.json @@ -1,4 +1,3 @@ { - "label": "@rx-angular/state", - "position": 2 + "label": "@rx-angular/state" } diff --git a/apps/docs/docs/template/_category_.json b/apps/docs/docs/template/_category_.json index 7b0d2da31a..7fc19f8936 100644 --- a/apps/docs/docs/template/_category_.json +++ b/apps/docs/docs/template/_category_.json @@ -1,4 +1,3 @@ { - "label": "@rx-angular/template", - "position": 3 + "label": "@rx-angular/template" } From fcb684aa9e722432bde26c4cbfc713874b313572 Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 12:06:19 +0200 Subject: [PATCH 054/109] docs: sort docs footer links alphabetically --- apps/docs/docusaurus.config.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/docs/docusaurus.config.js b/apps/docs/docusaurus.config.js index 98c1b049b9..1e7079c146 100644 --- a/apps/docs/docusaurus.config.js +++ b/apps/docs/docusaurus.config.js @@ -88,7 +88,7 @@ module.exports = { }, { docId: 'eslint-plugin/eslint-plugin', - label: 'ESLint-Plugin', + label: 'ESLint', position: 'left', type: 'doc' }, @@ -116,6 +116,10 @@ module.exports = { label: '@rx-angular/cdk', to: 'docs/cdk/', }, + { + label: '@rx-angular/eslint-plugin', + to: 'docs/eslint-plugin/', + }, { label: '@rx-angular/state', to: 'docs/state/', @@ -123,11 +127,7 @@ module.exports = { { label: '@rx-angular/template', to: 'docs/template/', - }, - { - label: '@rx-angular/eslint-plugin', - to: 'docs/eslint-plugin/', - }, + } ], }, { From 90a58817f0d5d02b1e09d72fb2beda4b8520161d Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 12:10:14 +0200 Subject: [PATCH 055/109] docs: sort docs header nav links alphabetically --- apps/docs/docusaurus.config.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/docs/docusaurus.config.js b/apps/docs/docusaurus.config.js index 1e7079c146..509140b705 100644 --- a/apps/docs/docusaurus.config.js +++ b/apps/docs/docusaurus.config.js @@ -74,6 +74,12 @@ module.exports = { position: 'left', type: 'doc', }, + { + docId: 'eslint-plugin/eslint-plugin', + label: 'ESLint', + position: 'left', + type: 'doc' + }, { docId: 'state/state', label: 'State', @@ -86,12 +92,6 @@ module.exports = { position: 'left', type: 'doc', }, - { - docId: 'eslint-plugin/eslint-plugin', - label: 'ESLint', - position: 'left', - type: 'doc' - }, // { to: 'blog', label: 'Blog', position: 'left' }, { href: `https://github.com/${organizationName}/${projectName}`, From a364c747457cb6b2b9eee7c96c77aca4eec0981b Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 12:28:32 +0200 Subject: [PATCH 056/109] docs: transclude state submodules to docs app --- apps/docs/docs/state/actions/actions.mdx | 15 +++++++++++++++ apps/docs/docs/state/api/_category_.json | 2 +- apps/docs/docs/state/effects/effects.mdx | 15 +++++++++++++++ apps/docs/docs/state/selections/selections.mdx | 15 +++++++++++++++ 4 files changed, 46 insertions(+), 1 deletion(-) create mode 100644 apps/docs/docs/state/actions/actions.mdx create mode 100644 apps/docs/docs/state/effects/effects.mdx create mode 100644 apps/docs/docs/state/selections/selections.mdx diff --git a/apps/docs/docs/state/actions/actions.mdx b/apps/docs/docs/state/actions/actions.mdx new file mode 100644 index 0000000000..a3a6acf065 --- /dev/null +++ b/apps/docs/docs/state/actions/actions.mdx @@ -0,0 +1,15 @@ +--- +sidebar_label: 'Actions' +sidebar_position: 10 +title: 'Actions' +hide_title: true +--- + +import Readme, { toc as readmeToc } from '@site/../../libs/state/actions/README.md'; + + + + + + +export const toc = [...readmeToc]; \ No newline at end of file diff --git a/apps/docs/docs/state/api/_category_.json b/apps/docs/docs/state/api/_category_.json index 4e5fc563d8..2a4dca6f95 100644 --- a/apps/docs/docs/state/api/_category_.json +++ b/apps/docs/docs/state/api/_category_.json @@ -1,5 +1,5 @@ { "label": "API", - "position": 8, + "position": 11, "link": null } diff --git a/apps/docs/docs/state/effects/effects.mdx b/apps/docs/docs/state/effects/effects.mdx new file mode 100644 index 0000000000..7e24e8bc1e --- /dev/null +++ b/apps/docs/docs/state/effects/effects.mdx @@ -0,0 +1,15 @@ +--- +sidebar_label: 'Effects' +sidebar_position: 9 +title: 'Effects' +hide_title: true +--- + +import Readme, { toc as readmeToc } from '@site/../../libs/state/effects/README.md'; + + + + + + +export const toc = [...readmeToc]; \ No newline at end of file diff --git a/apps/docs/docs/state/selections/selections.mdx b/apps/docs/docs/state/selections/selections.mdx new file mode 100644 index 0000000000..13f5db766a --- /dev/null +++ b/apps/docs/docs/state/selections/selections.mdx @@ -0,0 +1,15 @@ +--- +sidebar_label: 'Selections' +sidebar_position: 8 +title: 'Selections' +hide_title: true +--- + +import Readme, { toc as readmeToc } from '@site/../../libs/state/selections/README.md'; + + + + + + +export const toc = [...readmeToc]; \ No newline at end of file From 50b777c499e1b269f860bb50b6d0dc9332fa29a6 Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 13:08:56 +0200 Subject: [PATCH 057/109] docs: change state readme links to website docs --- libs/state/README.md | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/libs/state/README.md b/libs/state/README.md index 006f92b8cc..dbaf4519e0 100644 --- a/libs/state/README.md +++ b/libs/state/README.md @@ -12,9 +12,9 @@ RxState is a lightweight, flexible, strongly typed and tested tool dedicated to ## Sub Modules -- [🧩 Selections](https://github.com/rx-angular/rx-angular/blob/main/libs/state/selections/README.md) -- [☁ Effects](https://github.com/rx-angular/rx-angular/blob/main/libs/state/effects/README.md) -- [? Actions](https://github.com/rx-angular/rx-angular/blob/main/libs/state/actions/README.md) +- [🧩 Selections](https://rx-angular.io/docs/state/selections) +- [☁ Effects](https://rx-angular.io/docs/state/effects) +- [? Actions](https://rx-angular.io/docs/state/actions) ## Intro Video @@ -88,7 +88,7 @@ nx migrate @rx-angular/state ## Testing -[Testing](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/testing.md) +[Testing](https://rx-angular.io/docs/state/docs/testing.md) ## API @@ -96,24 +96,24 @@ nx migrate @rx-angular/state ## Tutorials -- [Basic Tutorial](https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics) +- [Basic Tutorial](https://rx-angular.io/docs/state/tutorials/basics) - [Counter - StackBlitz](https://stackblitz.com/edit/rx-angular-state-counter-demo?file=src%2Fapp%2Fcounter%2Fcounter.component.ts) ## Snippets -- [Logic comparison - Increment a Value](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/logic-comparison--increment-a-value.md) -- [Loading state and data fetching](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/loading-state-and-data-fetching.md) -- [Passing Observables directly](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/passing-observables-directly.md) -- [How to run partial state updates](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/how-can-i-run-partial-state-updates.md) +- [Logic comparison - Increment a Value](https://rx-angular.io/docs/state/tutorials/increment-a-value) +- [Loading state and data fetching](https://rx-angular.io/docs/state/recipes/load-data-on-route-change) +- [Passing Observables directly](https://rx-angular.io/docs/state/tutorials/passing-observables) +- [How to run partial state updates](https://rx-angular.io/docs/state/recipes/run-partial-updates) - [Get nested state slices](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/get-nested-state-slices.md) - [Deriving simple state](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/deriving-simple-state.md) -- [Composing state using NgRx selectors](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/composing-state-using-ngrx-selectors.md) -- [Manage entities using NgRx entity adapter](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/manage-collections-with-ngrx-entity.md) +- [Composing state using NgRx selectors](https://rx-angular.io/docs/state/integrations/resuse-ngrx-selectors-to-compose-state) +- [Manage entities using NgRx entity adapter](https://rx-angular.io/docs/manage-entities-using-ngrx-entity) - [BehaviorSubject vs RxState](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/behavior-subject-vs-rx-state.md) -- [Managing ViewModels with selectSlice](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/selecting-the-viewmodel.md) -- [Manage reactive HostBindings](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/hostbindings.md) -- [Difference between Global and Local state](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/global-state-vs-local-state.md) -- [Using RxState as Global State](https://github.com/rx-angular/rx-angular/blob/main/libs/state/docs/snippets/manage-global-state.md) +- [Managing ViewModels with selectSlice](https://rx-angular.io/docs/state/recipes/manage-viewmodel) +- [Manage reactive HostBindings](https://rx-angular.io/docs/state/recipes/work-with-hostbindings) +- [Difference between Global and Local state](https://rx-angular.io/docs/state/recipes/determine-state-type) +- [Using RxState as Global State](https://rx-angular.io/docs/state/recipes/use-rxstate-as-global-state) ## Videos From 9147078779a189433872d0b367ba7f5e798c325b Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 13:33:24 +0200 Subject: [PATCH 058/109] docs: change state readme links to website docs --- libs/state/README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/libs/state/README.md b/libs/state/README.md index dbaf4519e0..dff34510c2 100644 --- a/libs/state/README.md +++ b/libs/state/README.md @@ -105,11 +105,11 @@ nx migrate @rx-angular/state - [Loading state and data fetching](https://rx-angular.io/docs/state/recipes/load-data-on-route-change) - [Passing Observables directly](https://rx-angular.io/docs/state/tutorials/passing-observables) - [How to run partial state updates](https://rx-angular.io/docs/state/recipes/run-partial-updates) -- [Get nested state slices](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/get-nested-state-slices.md) -- [Deriving simple state](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/deriving-simple-state.md) +- [Get nested state slices](https://rx-angular.io/docs/state/concepts-and-best-practices/get-nested-state-slices) +- [Deriving simple state](https://rx-angular.io/docs/state/concepts-and-best-practices/deriving-simple-state) - [Composing state using NgRx selectors](https://rx-angular.io/docs/state/integrations/resuse-ngrx-selectors-to-compose-state) - [Manage entities using NgRx entity adapter](https://rx-angular.io/docs/manage-entities-using-ngrx-entity) -- [BehaviorSubject vs RxState](https://github.com/rx-angular/rx-angular/tree/main/libs/state/docs/snippets/behavior-subject-vs-rx-state.md) +- [BehaviorSubject vs RxState](https://rx-angular.io/docs/state/tutorials/migrating-to-rxstate) - [Managing ViewModels with selectSlice](https://rx-angular.io/docs/state/recipes/manage-viewmodel) - [Manage reactive HostBindings](https://rx-angular.io/docs/state/recipes/work-with-hostbindings) - [Difference between Global and Local state](https://rx-angular.io/docs/state/recipes/determine-state-type) From a42cf417a63de3f498cd5a571231e58c40df57ef Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 14:22:35 +0200 Subject: [PATCH 059/109] docs: change links in libs docs to point to web docs --- libs/cdk/coalescing/README.md | 2 +- libs/cdk/coercing/README.md | 2 +- libs/cdk/notifications/README.md | 2 +- libs/cdk/render-strategies/README.md | 8 ++++---- libs/cdk/template/README.md | 4 ++-- libs/cdk/transformations/README.md | 2 +- libs/cdk/zone-configurations/README.md | 6 +++--- libs/cdk/zone-less/README.md | 2 +- libs/cdk/zone-less/browser/README.md | 2 +- libs/cdk/zone-less/rxjs/README.md | 2 +- libs/state/selections/README.md | 2 +- libs/template/README.md | 4 ++-- 12 files changed, 19 insertions(+), 19 deletions(-) diff --git a/libs/cdk/coalescing/README.md b/libs/cdk/coalescing/README.md index 92170ce1ad..444928c772 100644 --- a/libs/cdk/coalescing/README.md +++ b/libs/cdk/coalescing/README.md @@ -33,4 +33,4 @@ yarn add @rx-angular/cdk ## Documentation -- [Coalescing](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/coalescing/docs/Readme.md) +- [Coalescing](https://rx-angular.io/docs/cdk/coalesing/resources) diff --git a/libs/cdk/coercing/README.md b/libs/cdk/coercing/README.md index 9514aafb48..5f3e14bba8 100644 --- a/libs/cdk/coercing/README.md +++ b/libs/cdk/coercing/README.md @@ -32,4 +32,4 @@ yarn add @rx-angular/cdk/coercing ## Documentation -- [Coercion](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/coercing/docs/Readme.md) +- [Coercion](https://rx-angular.io/docs/cdk/coercing/resources) diff --git a/libs/cdk/notifications/README.md b/libs/cdk/notifications/README.md index 6683e02d56..29a63ffc8c 100644 --- a/libs/cdk/notifications/README.md +++ b/libs/cdk/notifications/README.md @@ -28,5 +28,5 @@ yarn add @rx-angular/cdk ## Documentation -- [Notifications](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/notifications/docs/Readme.md) +- [Notifications](http://rx-angular.io/docs/cdk/notifications/resources) diff --git a/libs/cdk/render-strategies/README.md b/libs/cdk/render-strategies/README.md index 2e1af6f35a..0a9da3f8ae 100644 --- a/libs/cdk/render-strategies/README.md +++ b/libs/cdk/render-strategies/README.md @@ -33,8 +33,8 @@ yarn add @rx-angular/cdk ## Documentation -- [Render Strategies](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/render-strategies/docs/README.md) - - [Strategies](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/render-strategies/docs/strategies.md) - - [Basic Strategies](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/render-strategies/docs/basic-strategies.md) - - [Concurrent-strategies](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/render-strategies/docs/concurrent-strategies.md) +- [Render Strategies](https://rx-angular.io/docs/cdk/render-strategies/overview) + - [Strategies](https://rx-angular.io/docs/cdk/render-strategies/strategies) + - [Basic Strategies](https://rx-angular.io/docs/cdk/render-strategies/basic-strategies) + - [Concurrent-strategies](https://rx-angular.io/docs/cdk/render-strategies/concurrent-strategies) diff --git a/libs/cdk/template/README.md b/libs/cdk/template/README.md index e07495f103..6d2232ca24 100644 --- a/libs/cdk/template/README.md +++ b/libs/cdk/template/README.md @@ -30,5 +30,5 @@ yarn add @rx-angular/cdk ## Documentation -- [Template Manager](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/template/docs/template-manager.md) -- [List Manager](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/template/docs/list-manager.md) +- [Template Manager](https://rx-angular.io/docs/cdk/template/template-manager) +- [List Manager](https://rx-angular.io/docs/cdk/template/list-manager) diff --git a/libs/cdk/transformations/README.md b/libs/cdk/transformations/README.md index c0339d62c1..4a477cf129 100644 --- a/libs/cdk/transformations/README.md +++ b/libs/cdk/transformations/README.md @@ -26,5 +26,5 @@ yarn add @rx-angular/cdk ## Documentation -- [Transformations](https://github.com/rx-angular/rx-angular/tree/master/libs/cdk/transformations/docs/Readme.md) +- [Transformations](https://rx-angular.io/docs/cdk/transformations) diff --git a/libs/cdk/zone-configurations/README.md b/libs/cdk/zone-configurations/README.md index 563df226f2..49b628919f 100644 --- a/libs/cdk/zone-configurations/README.md +++ b/libs/cdk/zone-configurations/README.md @@ -33,6 +33,6 @@ yarn add @rx-angular/cdk ## Documentation -- [Zone Configurations with ZoneFlags](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-configurations/docs/zone-flags.md) - - [How to set up zone flags](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-configurations/docs/how-to-setup-zone-flags.md) - - [How to debug zone flags](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-configurations/docs/how-to-debug-zone-flags.md) +- [Zone Configurations with ZoneFlags](https://rx-angular.io/docs/cdk/zone-configurations/zone-flags) + - [How to set up zone flags](https://rx-angular.io/cdk/zone-configurations/how-to-debug-zone-flags) + - [How to debug zone flags](https://rx-angular.io/docs/cdk/zone-configurations/how-to-setup-zone-flags) diff --git a/libs/cdk/zone-less/README.md b/libs/cdk/zone-less/README.md index e3f2f0dda9..e658aecf38 100644 --- a/libs/cdk/zone-less/README.md +++ b/libs/cdk/zone-less/README.md @@ -31,4 +31,4 @@ yarn add @rx-angular/cdk ## Documentation -- [Zone-Less](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-less/docs) +- [Zone-Less](https://rx-angular.io/docs/cdk/zone-less/resources) diff --git a/libs/cdk/zone-less/browser/README.md b/libs/cdk/zone-less/browser/README.md index be801627e8..24cd26f879 100644 --- a/libs/cdk/zone-less/browser/README.md +++ b/libs/cdk/zone-less/browser/README.md @@ -28,4 +28,4 @@ yarn add @rx-angular/cdk ## Documentation -- [Zone-Less](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-less/docs) +- [Zone-Less](https://rx-angular.io/docs/cdk/zone-less) diff --git a/libs/cdk/zone-less/rxjs/README.md b/libs/cdk/zone-less/rxjs/README.md index acb99c3687..19f7154161 100644 --- a/libs/cdk/zone-less/rxjs/README.md +++ b/libs/cdk/zone-less/rxjs/README.md @@ -30,4 +30,4 @@ yarn add @rx-angular/cdk ## Documentation -- [Zone-Less](https://github.com/rx-angular/rx-angular/tree/main/libs/cdk/zone-less/docs) +- [Zone-Less](https://rx-angular.io/docscdk/zone-less) diff --git a/libs/state/selections/README.md b/libs/state/selections/README.md index 2c91948026..43b2cf46fa 100644 --- a/libs/state/selections/README.md +++ b/libs/state/selections/README.md @@ -26,5 +26,5 @@ yarn add @rx-angular/state ## Documentation -- [Selections](https://github.com/rx-angular/rx-angular/tree/main/libs/state/selections/docs/Readme.md) +- [Selections](https://rx-angular.io/cods/state/selections) diff --git a/libs/template/README.md b/libs/template/README.md index 1bb1f72465..64beda8ccf 100644 --- a/libs/template/README.md +++ b/libs/template/README.md @@ -28,11 +28,11 @@ convenient way of managing reactive sources and lazy rendering of the view. Should be noted that both [LetDirective (`*rxLet`)](https://rx-angular.io/docs/template/api/let-directive) & [PushPipe (`push`)](https://rx-angular.io/docs/template/api/push-pipe) recognize only immutable changes. -Using those with the default strategy ([Local Strategy](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/docs/render-strategies/strategies.md#local)) should already improve the rendering performance of +Using those with the default strategy ([Local Strategy](http://rx-angular.io/docs/cdk/render-strategies/basic-strategies#local)) should already improve the rendering performance of your application by a decent amount. The applied optimization behavior is fully customizable by using built-in or -custom-provided [RenderStrategies](https://github.com/rx-angular/rx-angular/blob/main/libs/cdk/render-strategies/docs/README.md). +custom-provided [RenderStrategies](https://rx-angular.io/docs/cdk/render-strategies/overview). However, `RenderStrategies` are also meant to be a tool developers can interact with inside their components, giving you even broader access to the rendering mechanisms of your application. The API comes with imperative as well as reactive ways to manage renderings. From c6fb658edf5a6476372aaf95b6f7cdf72b63121e Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 14 Oct 2022 14:30:58 +0200 Subject: [PATCH 060/109] docs: change file name from Readme.md to README.md --- .../app/features/tutorials/basics/README.md | 55 +++ libs/state/actions/docs/README.md | 309 +++++++++++++ libs/state/effects/docs/README.md | 415 ++++++++++++++++++ libs/state/selections/docs/README.md | 10 + 4 files changed, 789 insertions(+) create mode 100644 apps/demos/src/app/features/tutorials/basics/README.md create mode 100644 libs/state/actions/docs/README.md create mode 100644 libs/state/effects/docs/README.md create mode 100644 libs/state/selections/docs/README.md diff --git a/apps/demos/src/app/features/tutorials/basics/README.md b/apps/demos/src/app/features/tutorials/basics/README.md new file mode 100644 index 0000000000..3a46791e62 --- /dev/null +++ b/apps/demos/src/app/features/tutorials/basics/README.md @@ -0,0 +1,55 @@ +# Refactoring to a Reactive Component Setup + +In this tutorial, we will learn how to refactor a component written in the imperative style to a fully reactive implementation. + +To set up the project locally, complete the following steps: + +- `git clone https://github.com/rx-angular/rx-angular.git rx-angular` +- `cd rx-angular` +- `npm install` or `yarn install` +- `npm start demos` or `yarn nx serve demos` + +You can find the working application at `http://localhost:4200/rx-angular/demos`. + +The source can be found under `apps/demos/src/app/features/tutorials`. + +The example shows a simple component setup of a parent container and a child component displaying the data. + +In the child component, an expansion-panel is used to display the data. This panel can be opened and closed by clicking on the title. +The open/close state of the expansion-panel is forwarded to the parent component as an output binding. + +As an input binding, the parent container maintains a number over an input box. Every change of the number gets forwarded to the child component over an input binding. + +There is a background process running in the child component. The input value from the parent is used to start an interval and refresh the list data every [n] milliseconds. +Furthermore, there is a refresh button. A click on it also refreshes the list data. + +The topics we will discuss in this tutorial include: +- [Setting up a reactive state, selections, and UI interactions][1-setup] +- [Handling @Inputs reactively][2-input-bindings] +- [Handling @Output reactively][3-output-bindings] +- [Creating a global state and attach it to components][4-global-state] +- [Handling Side Effects reactively][5-side-effects] + + +You can also check out the full solution after applying all the above steps [here](https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics/solution). + +# How to use this tutorial + +Each chapter contains three files: + +- `.start.component.ts` showing the initial state of the file +- `.solution.component.ts` demonstrating the state of the file after applying all the changes discussed in that chapter +- `.container.component.ts`, a container where you can check the result of the solution; by default, it uses the `.start.component.ts` in the template, so change it by using the `.solution.component.ts` to see the difference + +> You can compare the `.start.component.ts` and `.solution.component.ts` against each other to see what changes have been made. + +> To compare two files against each other in VSCode, you have to:

+> 1- open the first file (in our case, the `.start.component.ts`)
+> 2- press Ctrl(Cmd)+Shift+P and choose `File: Compare Active file with ...`
+> 3- choose the second file (in our case, the `.solution.component.ts`) + +[1-setup]: https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics/1-setup +[2-input-bindings]: https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics/2-input-bindings +[3-output-bindings]: https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics/3-output-bindings +[4-global-state]: https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics/4-global-state +[5-side-effects]: https://github.com/rx-angular/rx-angular/tree/main/apps/demos/src/app/features/tutorials/basics/5-side-effects diff --git a/libs/state/actions/docs/README.md b/libs/state/actions/docs/README.md new file mode 100644 index 0000000000..66b66d20b2 --- /dev/null +++ b/libs/state/actions/docs/README.md @@ -0,0 +1,309 @@ +# Resources + +**Example applications:** +A demo application is available on [GitHub](https://github.com/BioPhoton/rx-angular-state-actions). + +# Motivation + +Signals, or a more commonly used name actions, are a common part of state management and reactive systems in general. +Even if `@rx-angular/state` provides `set` method, sometimes you need to add behaviour to your user input or incoming events. + +Subjects are normally used to implement this feature. This leads, especially in bigger applications, to a messy code that is bloated with Subjects. + +Let's have a look at this piece of code: + +```typescript +@Component({ + template: ` + Search for: {{search$ | async}}
+ + + `, }) class Component { private _submitBtn = new Subject(); private _searchInput = new Subject(); - + set submitBtn() { - _submitBtn.next() + _submitBtn.next(); } get submitBtn$() { return _searchInput.asObservable(); } set search(search: string) { - _searchInput.next(search) + _searchInput.next(search); } get search$() { return _searchInput.asObservable(); @@ -42,16 +47,16 @@ class Component { list$ = this.submitBtn$.pipe( withLatestFrom(this.search$), switchMap(([_, searchString]) => this.api.query(searchString)) - ) + ); - constructor(api: API) { } - + constructor(api: API) {} } ``` Just look at the amount of code we need to write for only 2 observable ui events. Downsides: + - Boilerplate for setter and getter - Transformations spreaded over class and template - Manual typing ov subjects and streams @@ -62,42 +67,43 @@ Imagine we could have configurable functions that return all UI logic typed unde ```typescript import { RxActionFactory } from '@rx-angular/state/actions'; interface UiActions { - submitBtn: void, - searchInput: string + submitBtn: void; + searchInput: string; } @Component({ template: ` - Search for: {{ui.search$ | async}}
- + `, - providers: [RxActionFactory] + providers: [RxActionFactory], }) class Component { - ui = this.factory.create({searchInput: (e) => e.target.value}); - + ui = this.factory.create({ searchInput: (e) => e.target.value }); + list$ = this.ui.submitBtn$.pipe( withLatestFrom(this.ui.search$), switchMap(([_, searchString]) => this.api.query(searchString)) - ) - - constructor( - api: API, - private factory: RxActionFactory - ) {} + ); + constructor(api: API, private factory: RxActionFactory) {} } ``` -# RxAngular Signals +## RxAngular Signals -This package helps to reduce code used to create composable action streams. +This package helps to reduce code used to create composable action streams. It mostly is used in combination with state management libs to handle user interaction and backend communication. -## Setup +### Setup The coalescing features can be used directly from the `cdk` package or indirectly through the `state` package. To do so, install the `cdk` package and, if needed, the packages depending on it: @@ -110,7 +116,7 @@ npm i @rx-angular/state yarn add @rx-angular/state ``` -## Basic usage +### Basic usage By using RxAngular Actions we can reduce the boilerplate significantly, to do so we can start by thinking about the specific section their events and event payload types: @@ -129,6 +135,7 @@ commands = getActions(); ``` The object can now be used to emit signals over setters: + ```typescript commands.refreshUser(value); commands.refreshList(value); @@ -136,6 +143,7 @@ commands.refreshGenres(value); ``` The emitted signals can be received over observable properties: + ```typescript refreshUser$ = commands.refreshUser$; refreshList$ = commands.refreshList$; @@ -143,47 +151,54 @@ refreshGenres$ = commands.refreshGenres$; ``` You can also emit multiple signals at once: + ```typescript - commands({refreshUser: true, refreshList: true}); +commands({ refreshUser: true, refreshList: true }); ``` If there is the need to make a combined signal you can also select multiple signals and get their emissions in one stream: + ```typescript refreshUserOrList$ = commands.$(['refreshUser', 'refreshList']); ``` -## Signals in components +### Signals in components In components/templates we can use signals to map user interaction as well as programmatic to effects or state changes. -This reduces the component class code as well as template. +This reduces the component class code as well as template. In addition, we can use it as a shorthand in the template and directly connect to action dispatching in the class. ```typescript interface UiActions { - submitBtn: void, - searchInput: string + submitBtn: void; + searchInput: string; } @Component({ template: ` - Search for: {{ui.search$ | async}}
- + `, - providers: [RxState, RxActionFactory] + providers: [RxState, RxActionFactory], }) class Component { - ui = this.factory.create({searchInput: (e) => e?.target?.value}); + ui = this.factory.create({ searchInput: (e) => e?.target?.value }); list$ = this.state.select('list'); submittedSearchQuery$ = this.ui.submitBtn$.pipe( - withLatestFrom(this.ui.search$), + withLatestFrom(this.ui.search$), map(([_, search]) => search), debounceTime(1500) ); - + constructor( private state: RxState, private factory: RxActionFactory, @@ -191,7 +206,7 @@ class Component { ) { super(); this.connect('list', this.globalState.refreshGenres$); - + this.state.hold(this.submittedSearchQuery$, this.globalState.refreshGenres); // Optional reactively: // this.globalState.connectRefreshGenres(this.submittedSearchQuery$); @@ -199,7 +214,7 @@ class Component { } ``` -### Using transforms +#### Using transforms Often we process `Events` from the template and occasionally also trigger those channels in the class programmatically. @@ -209,6 +224,7 @@ This is also true for the programmatic usage in the component class or a service To ease this pain we can manage this login with `transforms`. You can write you own transforms or use the predefined functions: + - preventDefault - stopPropagation - preventDefaultStopPropagation @@ -216,38 +232,43 @@ You can write you own transforms or use the predefined functions: ```typescript interface UiActions { - submitBtn: void, - searchInput: string + submitBtn: void; + searchInput: string; } @Component({ template: ` - Search for: {{ui.search$ | async}}
- + `, - providers: [RxState, RxActionFactory] + providers: [RxState, RxActionFactory], }) class Component { // (e) => e.target ? e.target.value : e - ui = this.factory.create({searchInput: eventValue}); + ui = this.factory.create({ searchInput: eventValue }); list$ = this.state.select('list'); submittedSearchQuery$ = this.ui.submitBtn$.pipe( - withLatestFrom(this.ui.search$), + withLatestFrom(this.ui.search$), map(([_, search]) => search), debounceTime(1500) ); - + constructor( private state: RxState, private factory: RxActionFactory, globalState: StateService ) { - super(); + super(); this.connect('list', this.globalState.refreshGenres$); - + this.state.hold(this.submittedSearchQuery$, this.globalState.refreshGenres); // Optional reactively: // this.globalState.connectRefreshGenres(this.submittedSearchQuery$); @@ -255,9 +276,9 @@ class Component { } ``` -## Usage for global services +### Usage for global services -In services, it comes in handy to have a minimal typed action system. +In services, it comes in handy to have a minimal typed action system. This helps to have them composable for further optimizations. Furthermore, we can still expose setters to trigger actions the imperative way. @@ -270,9 +291,8 @@ interface Commands { refreshGenres: string | number; } - @Injectable({ - providedIn: 'root' + providedIn: 'root', }) export class StateService extends RxState { private commands = new RxActionFactory().create(); @@ -284,26 +304,20 @@ export class StateService extends RxState { this.connect( 'genres', - this.commands.fetchGenres$.pipe( - exhaustMap(this.tmdb2Service.getGenres) - ) + this.commands.fetchGenres$.pipe(exhaustMap(this.tmdb2Service.getGenres)) ); } refreshGenres(genre: string): void { this.commands.fetchGenres(genre); } - + // Optionally the reactive way connectRefreshGenres(genre$: Observable): void { this.connect( 'genres', - this.commands.fetchGenres$.pipe( - exhaustMap(this.tmdb2Service.getGenres) - ) + this.commands.fetchGenres$.pipe(exhaustMap(this.tmdb2Service.getGenres)) ); } - } ``` - diff --git a/apps/docs/docs/state/actions/actions.mdx b/apps/docs/docs/state/actions/actions.mdx index a3a6acf065..2a8ca49cdb 100644 --- a/apps/docs/docs/state/actions/actions.mdx +++ b/apps/docs/docs/state/actions/actions.mdx @@ -1,15 +1,20 @@ --- sidebar_label: 'Actions' -sidebar_position: 10 +sidebar_position: 5 title: 'Actions' hide_title: true --- -import Readme, { toc as readmeToc } from '@site/../../libs/state/actions/README.md'; +import Readme, { + toc as readmeToc, +} from '@site/../../libs/state/actions/README.md'; +import Docs, { toc as docsToc } from './_docs.md'; + + -export const toc = [...readmeToc]; \ No newline at end of file +export const toc = [...readmeToc, ...docsToc]; diff --git a/libs/state/actions/README.md b/libs/state/actions/README.md index 5836aaff64..320765056d 100644 --- a/libs/state/actions/README.md +++ b/libs/state/actions/README.md @@ -4,16 +4,15 @@ ![rx-angular CI](https://github.com/rx-angular/rx-angular/workflows/rx-angular%20CI/badge.svg?branch=master) [![Coverage Status](https://raw.githubusercontent.com/rx-angular/rx-angular/github-pages/docs/test-coverage/state/jest-coverage-badge.svg)](https://rx-angular.github.io/rx-angular/test-coverage/state/lcov-report/index.html) -## This package provides a quick way to create an action channel and some configuration options. - +> This package provides a quick way to create an action channel and some configuration options. ## Key features - - ✅ Fully Typed - - ✅ No-Boilerplate - - ✅ Configurable transformations to have lines in the template - - ✅ Minimal memory footprint through a Proxy object and lazy initialization - +- ✅ Fully Typed +- ✅ No-Boilerplate +- ✅ Configurable transformations to have lines in the template +- ✅ Minimal memory footprint through a Proxy object and lazy initialization + ## Demos: - [⚡ GitHub](https://github.com/BioPhoton/rx-angular-state-actions) @@ -24,3 +23,4 @@ npm install --save @rx-angular/state # or yarn add @rx-angular/state +``` diff --git a/libs/state/actions/docs/Readme.md b/libs/state/actions/docs/Readme.md deleted file mode 100644 index 66b66d20b2..0000000000 --- a/libs/state/actions/docs/Readme.md +++ /dev/null @@ -1,309 +0,0 @@ -# Resources - -**Example applications:** -A demo application is available on [GitHub](https://github.com/BioPhoton/rx-angular-state-actions). - -# Motivation - -Signals, or a more commonly used name actions, are a common part of state management and reactive systems in general. -Even if `@rx-angular/state` provides `set` method, sometimes you need to add behaviour to your user input or incoming events. - -Subjects are normally used to implement this feature. This leads, especially in bigger applications, to a messy code that is bloated with Subjects. - -Let's have a look at this piece of code: - -```typescript -@Component({ - template: ` - Search for: {{search$ | async}}
-