Skip to content

Commit 5f873e8

Browse files
feat: standalone component architecture (#122)
1 parent d18b459 commit 5f873e8

21 files changed

+59
-22
lines changed

packages/angular/src/lib/cdk/action-bar/index.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@ const appendActionItem = (bar: NgActionBar, item: ActionItem) => {
7878
@Component({
7979
selector: 'ActionBar',
8080
template: '<ng-content></ng-content>',
81+
standalone: true,
8182
})
8283
export class ActionBarComponent {
8384
constructor(public element: ElementRef, @Optional() private page: Page) {
@@ -96,6 +97,7 @@ export class ActionBarComponent {
9697
@Component({
9798
selector: 'ActionBarExtension',
9899
template: '',
100+
standalone: true,
99101
})
100102
// eslint-disable-next-line @angular-eslint/component-class-suffix
101103
export class ActionBarScope {
@@ -130,6 +132,7 @@ export class ActionBarScope {
130132

131133
@Directive({
132134
selector: 'ActionItem', // tslint:disable-line:directive-selector
135+
standalone: true,
133136
})
134137
export class ActionItemDirective implements OnDestroy {
135138
constructor(public element: ElementRef, @Optional() private ownerScope: ActionBarScope) {
@@ -147,6 +150,7 @@ export class ActionItemDirective implements OnDestroy {
147150

148151
@Directive({
149152
selector: 'NavigationButton', // tslint:disable-line:directive-selector
153+
standalone: true,
150154
})
151155
export class NavigationButtonDirective implements OnDestroy {
152156
constructor(public element: ElementRef, @Optional() private ownerScope: ActionBarScope) {

packages/angular/src/lib/cdk/detached-loader.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import { ComponentRef, ComponentFactory, ViewContainerRef, Component, Type, ComponentFactoryResolver, ChangeDetectorRef, ApplicationRef, OnDestroy, TemplateRef, ViewChild, Injector } from '@angular/core';
1+
import { ApplicationRef, ChangeDetectorRef, Component, ComponentFactory, ComponentFactoryResolver, ComponentRef, Injector, NO_ERRORS_SCHEMA, OnDestroy, TemplateRef, Type, ViewChild, ViewContainerRef } from '@angular/core';
22
import { ProxyViewContainer, Trace } from '@nativescript/core';
3-
import { ComponentPortal, TemplatePortal } from './portal';
4-
import type { ComponentType } from '../utils/general';
53
import { registerElement } from '../element-registry';
4+
import type { ComponentType } from '../utils/general';
5+
import { ComponentPortal, TemplatePortal } from './portal';
66

77
registerElement('DetachedContainer', () => ProxyViewContainer, {
88
skipAddToDom: true,
@@ -19,6 +19,8 @@ registerElement('DetachedContainer', () => ProxyViewContainer, {
1919
template: `<Placeholder #loader></Placeholder>
2020
<ng-container #vc></ng-container>
2121
<ng-content></ng-content>`,
22+
standalone: true,
23+
schemas: [NO_ERRORS_SCHEMA],
2224
})
2325
// eslint-disable-next-line @angular-eslint/component-class-suffix
2426
export class DetachedLoader implements OnDestroy {

packages/angular/src/lib/cdk/dialog/dialog-content-directives.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { NativeDialogRef } from './dialog-ref';
1818
// eslint-disable-next-line @angular-eslint/directive-selector
1919
selector: '[native-dialog-close], [nativeDialogClose]',
2020
exportAs: 'nativeDialogClose',
21+
standalone: true,
2122
})
2223
export class NativeDialogCloseDirective implements OnInit, OnChanges {
2324
/** Dialog close input. */

packages/angular/src/lib/cdk/dialog/dialog-module.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { NativeDialogCloseDirective } from './dialog-content-directives';
33
import { NativeDialogService } from './dialog-services';
44

55
@NgModule({
6-
declarations: [NativeDialogCloseDirective],
6+
imports: [NativeDialogCloseDirective],
77
exports: [NativeDialogCloseDirective],
88
providers: [NativeDialogService],
99
})

packages/angular/src/lib/cdk/frame-page/frame-page.component.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ registerElement('FramePage', () => Frame, {
2424
// eslint-disable-next-line @angular-eslint/component-selector
2525
selector: 'FramePage',
2626
template: `<ng-content></ng-content>`,
27+
standalone: true,
2728
providers: [
2829
{
2930
provide: Frame,

packages/angular/src/lib/cdk/frame-page/frame-page.module.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { FrameDirective } from './frame.directive';
44
import { PageDirective } from './page.directive';
55

66
@NgModule({
7-
declarations: [FrameDirective, PageDirective, FramePageComponent],
7+
imports: [FrameDirective, PageDirective, FramePageComponent],
88
exports: [FrameDirective, PageDirective, FramePageComponent],
99
})
1010
export class FramePageModule {}

packages/angular/src/lib/cdk/frame-page/frame.directive.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export function customFrameDirectiveFactory(v: FrameDirective) {
88
@Directive({
99
// eslint-disable-next-line @angular-eslint/directive-selector
1010
selector: 'Frame',
11+
standalone: true,
1112
providers: [
1213
{
1314
provide: Frame,

packages/angular/src/lib/cdk/frame-page/page.directive.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export function customPageFactory(v: PageDirective) {
99
@Directive({
1010
// eslint-disable-next-line @angular-eslint/directive-selector
1111
selector: 'Page',
12+
standalone: true,
1213
providers: [
1314
{
1415
provide: Page,

packages/angular/src/lib/cdk/list-view/list-view.component.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@ import { ItemEventData, KeyedTemplate, LayoutBase, ListView, ObservableArray, pr
33

44
import { extractSingleViewRecursive } from '../../element-registry/registry';
55
import { NativeScriptDebug } from '../../trace';
6-
import { NgViewTemplate } from '../../view-refs';
76
import { isListLikeIterable } from '../../utils/general';
7+
import { NgViewTemplate } from '../../view-refs';
8+
import { DetachedLoader } from '../detached-loader';
89

910
const NG_VIEW = '_ngViewRef';
1011

@@ -89,7 +90,9 @@ export interface SetupItemViewArgs<T> {
8990
template: `<DetachedContainer>
9091
<ng-container #loader></ng-container>
9192
</DetachedContainer>`,
93+
standalone: true,
9294
changeDetection: ChangeDetectionStrategy.OnPush,
95+
imports: [DetachedLoader],
9396
providers: [{ provide: TEMPLATED_ITEMS_COMPONENT, useExisting: forwardRef(() => ListViewComponent) }],
9497
})
9598
export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterContentInit, TemplatedItemsHost {
@@ -293,7 +296,10 @@ export function getItemViewRoot(viewRef: EmbeddedViewRef<unknown>, rootLocator:
293296
}
294297

295298
// eslint-disable-next-line @angular-eslint/directive-selector
296-
@Directive({ selector: '[nsTemplateKey],[nsTemplateKeys]' })
299+
@Directive({
300+
selector: '[nsTemplateKey],[nsTemplateKeys]',
301+
standalone: true,
302+
})
297303
export class TemplateKeyDirective<T> {
298304
constructor(private templateRef: TemplateRef<T>, @Host() @Inject(TEMPLATED_ITEMS_COMPONENT) private comp: TemplatedItemsHost<T>) {}
299305

packages/angular/src/lib/cdk/platform-filters/android-filter.component.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
11
/* eslint-disable @angular-eslint/component-selector */
22
import { Component, Inject } from '@angular/core';
3-
import { platformNames, IDevice } from '@nativescript/core';
3+
import { IDevice, platformNames } from '@nativescript/core';
44
import { DEVICE } from '../../tokens';
55

66
@Component({
77
selector: 'android',
8-
template: `<ng-content *ngIf="show"></ng-content>`,
8+
template: `@if (show) {
9+
<ng-content></ng-content>
10+
}`,
11+
standalone: true,
912
})
1013
export class AndroidFilterComponent {
1114
public show: boolean;

0 commit comments

Comments
 (0)