@symbiote-native/angular 0.3.1 → 0.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -4
- package/babel-linker.cjs +1 -2
- package/bin/symbiote-angular-dev.cjs +2 -2
- package/build/angular/components/activity-indicator/index.android.js +3 -3
- package/build/angular/components/activity-indicator/index.ios.js +3 -3
- package/build/angular/components/activity-indicator/index.js +1 -1
- package/build/angular/components/activity-indicator/index.js.map +1 -1
- package/build/angular/components/activity-indicator/shared.js +3 -3
- package/build/angular/components/button.js +6 -6
- package/build/angular/components/button.js.map +1 -1
- package/build/angular/components/flat-list/index.js +4 -5
- package/build/angular/components/flat-list/index.js.map +1 -1
- package/build/angular/components/image/index.android.js +3 -3
- package/build/angular/components/image/index.ios.js +3 -3
- package/build/angular/components/image-background.js +3 -3
- package/build/angular/components/input-accessory-view.js +3 -3
- package/build/angular/components/keyboard-avoiding-view.js +5 -5
- package/build/angular/components/keyboard-avoiding-view.js.map +1 -1
- package/build/angular/components/modal.js +3 -3
- package/build/angular/components/pressable/index.js +3 -3
- package/build/angular/components/refresh-control.js +5 -5
- package/build/angular/components/refresh-control.js.map +1 -1
- package/build/angular/components/safe-area-view.js +6 -7
- package/build/angular/components/safe-area-view.js.map +1 -1
- package/build/angular/components/scroll-view/index.android.js +8 -8
- package/build/angular/components/scroll-view/index.android.js.map +1 -1
- package/build/angular/components/scroll-view/index.ios.js +6 -6
- package/build/angular/components/scroll-view/index.ios.js.map +1 -1
- package/build/angular/components/scroll-view/index.js +1 -1
- package/build/angular/components/scroll-view/index.js.map +1 -1
- package/build/angular/components/scroll-view/shared.js +9 -9
- package/build/angular/components/scroll-view/shared.js.map +1 -1
- package/build/angular/components/scroll-view/sticky-header.js +4 -4
- package/build/angular/components/scroll-view/sticky-header.js.map +1 -1
- package/build/angular/components/section-list/index.js +3 -3
- package/build/angular/components/switch/index.android.js +3 -3
- package/build/angular/components/switch/index.ios.js +3 -3
- package/build/angular/components/switch/shared.js +3 -3
- package/build/angular/components/text-input.js +3 -3
- package/build/angular/components/touchable-native-feedback.js +5 -5
- package/build/angular/components/touchable-native-feedback.js.map +1 -1
- package/build/angular/components/touchable.js +12 -12
- package/build/angular/components/touchable.js.map +1 -1
- package/build/angular/components/virtualized-list/directives.js +19 -20
- package/build/angular/components/virtualized-list/directives.js.map +1 -1
- package/build/angular/components/virtualized-list/index.js +7 -8
- package/build/angular/components/virtualized-list/index.js.map +1 -1
- package/build/angular/components/virtualized-section-list/directives.js +13 -14
- package/build/angular/components/virtualized-section-list/directives.js.map +1 -1
- package/build/angular/components/virtualized-section-list/index.js +5 -5
- package/build/angular/components/virtualized-section-list/index.js.map +1 -1
- package/build/angular/create-portal.js +9 -9
- package/build/angular/create-portal.js.map +1 -1
- package/build/angular/create-tunnel.js +6 -6
- package/build/angular/descriptor-to-angular/index.js +6 -6
- package/build/angular/descriptor-to-angular/index.js.map +1 -1
- package/build/angular/index.js +6 -7
- package/build/angular/index.js.map +1 -1
- package/build/angular/modules/animated/create-animated-component.js +17 -17
- package/build/angular/modules/animated/create-animated-component.js.map +1 -1
- package/build/angular/modules/animated/index.js +1 -1
- package/build/angular/modules/animated/index.js.map +1 -1
- package/build/angular/modules/status-bar.js +3 -3
- package/build/angular/primitives/index.js +45 -45
- package/build/angular/primitives/shared.d.ts +1 -2
- package/build/angular/primitives/shared.js +8 -9
- package/build/angular/primitives/shared.js.map +1 -1
- package/build/angular/render.js +2 -3
- package/build/angular/render.js.map +1 -1
- package/build/angular/renderer.js +4 -6
- package/build/angular/renderer.js.map +1 -1
- package/build/angular/services/color-scheme.service.js +3 -3
- package/build/angular/services/window-dimensions.service.js +3 -3
- package/build/components/activity-indicator/index.js +1 -1
- package/build/components/button.js +3 -3
- package/build/components/flat-list/index.js +1 -2
- package/build/components/keyboard-avoiding-view.js +2 -2
- package/build/components/refresh-control.js +2 -2
- package/build/components/safe-area-view.js +3 -4
- package/build/components/scroll-view/index.android.js +2 -2
- package/build/components/scroll-view/index.ios.js +3 -3
- package/build/components/scroll-view/index.js +1 -1
- package/build/components/scroll-view/shared.js +3 -3
- package/build/components/scroll-view/sticky-header.js +1 -1
- package/build/components/touchable-native-feedback.js +2 -2
- package/build/components/touchable.js +3 -3
- package/build/components/virtualized-list/directives.js +1 -2
- package/build/components/virtualized-list/index.js +4 -5
- package/build/components/virtualized-section-list/directives.js +1 -2
- package/build/components/virtualized-section-list/index.js +2 -2
- package/build/create-portal.js +3 -3
- package/build/descriptor-to-angular/index.js +3 -3
- package/build/index.js +6 -7
- package/build/modules/animated/create-animated-component.js +2 -2
- package/build/modules/animated/index.js +1 -1
- package/build/primitives/shared.d.ts +1 -2
- package/build/primitives/shared.js +2 -3
- package/build/render.js +2 -3
- package/build/renderer.js +4 -6
- package/metro-config.cjs +3 -4
- package/metro-css-parser.cjs +1 -2
- package/package.json +5 -5
- package/src/__tests__/responder-change-detection.test.ts +1 -1
- package/src/__tests__/responder-nested-cd.test.ts +1 -1
- package/src/components/activity-indicator/activity-indicator-class-style.test.ts +1 -1
- package/src/components/activity-indicator/index.ts +1 -1
- package/src/components/button.ts +3 -3
- package/src/components/flat-list/flat-list-array-style.test.ts +1 -1
- package/src/components/flat-list/flat-list-class-style.test.ts +1 -1
- package/src/components/flat-list/flat-list-scroll-containment.test.ts +2 -2
- package/src/components/flat-list/index.ts +1 -2
- package/src/components/image/image-class-style.test.ts +1 -1
- package/src/components/image-background-class-style.test.ts +1 -1
- package/src/components/image-background.ts +1 -1
- package/src/components/keyboard-avoiding-view.ts +4 -4
- package/src/components/refresh-control.ts +5 -4
- package/src/components/safe-area-view.ts +5 -5
- package/src/components/scroll-view/android-scroll-view-axis-projection.test.ts +1 -1
- package/src/components/scroll-view/index.android.ts +2 -2
- package/src/components/scroll-view/index.ios.ts +3 -3
- package/src/components/scroll-view/index.ts +1 -1
- package/src/components/scroll-view/scroll-view-class-style.test.ts +1 -1
- package/src/components/scroll-view/shared.ts +5 -5
- package/src/components/scroll-view/sticky-header.ts +1 -1
- package/src/components/text-input-class-style.test.ts +1 -1
- package/src/components/text-input.ts +2 -2
- package/src/components/touchable-native-feedback.ts +3 -3
- package/src/components/touchable.ts +5 -5
- package/src/components/virtualized-list/directives.ts +1 -2
- package/src/components/virtualized-list/index.ts +6 -7
- package/src/components/virtualized-list/virtualized-list-class-style.test.ts +1 -1
- package/src/components/virtualized-section-list/directives.ts +1 -2
- package/src/components/virtualized-section-list/index.ts +4 -4
- package/src/components/virtualized-section-list/virtualized-section-list-class-style.test.ts +1 -1
- package/src/create-portal.ts +3 -3
- package/src/descriptor-to-angular/index.ts +3 -3
- package/src/host-instance/host-instance.test.ts +1 -1
- package/src/index.ts +6 -7
- package/src/modules/animated/create-animated-component.ts +2 -2
- package/src/modules/animated/index.ts +1 -1
- package/src/modules/app-registry/app-registry.test.ts +3 -3
- package/src/primitives/shared.ts +2 -3
- package/src/render.test.ts +3 -3
- package/src/render.ts +2 -3
- package/src/renderer.test.ts +1 -1
- package/src/renderer.ts +4 -6
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
// does nothing" bug, while React/Vue repainted the same demo. SymbioteHostPropsDirective now
|
|
5
5
|
// calls `cdr.markForCheck()` after each such callback (flags the component + ancestors with
|
|
6
6
|
// RefreshView and notifies the scheduler), so the mutation repaints. This is the flat-root case;
|
|
7
|
-
// responder-nested-cd.test.ts covers the App→child nesting the real app has.
|
|
7
|
+
// responder-nested-cd.test.ts covers the App→child nesting the real app has.
|
|
8
8
|
|
|
9
9
|
import '@angular/compiler';
|
|
10
10
|
import { Component } from '@angular/core';
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
// flat-bag responder callback does NOT dirty the child's reactive consumer, and the scheduler's
|
|
5
5
|
// root detectChanges() will NOT descend into it — the child's {{status}} used to stay stale
|
|
6
6
|
// ("pan does nothing"). SymbioteHostPropsDirective now refreshes its own host component's view
|
|
7
|
-
// right after the callback runs, so the nested child repaints.
|
|
7
|
+
// right after the callback runs, so the nested child repaints.
|
|
8
8
|
|
|
9
9
|
import '@angular/compiler';
|
|
10
10
|
import { Component } from '@angular/core';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: ActivityIndicator is its own
|
|
2
2
|
// ANCHOR_HOST_COMPONENTS entry AND renders through DescriptorOutlet (`symbiote-descriptor-outlet`,
|
|
3
3
|
// itself also an anchor entry) — a class= on <ActivityIndicator> resolves onto ActivityIndicator's
|
|
4
4
|
// OWN anchor, two levels up from the real committed wrapper View the descriptor builds, and needs
|
package/src/components/button.ts
CHANGED
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
// TouchableOpacity wrapping a Text. The base text style, the role constant, and the color fold are
|
|
3
3
|
// shared in @symbiote-native/components/view; here Angular only composes its TouchableOpacity + a
|
|
4
4
|
// symbiote-text child and re-maps the few Button-owned props. The Angular twin of the React/Vue
|
|
5
|
-
// adapter's Button. No JS-side platform branch, so this stays a flat single file
|
|
5
|
+
// adapter's Button. No JS-side platform branch, so this stays a flat single file.
|
|
6
6
|
//
|
|
7
7
|
// RN's Button fixes accessibilityRole="button", marks the root accessible, and propagates `disabled`
|
|
8
8
|
// into the accessibility state; those three win over any caller value. `title` becomes the Text
|
|
9
9
|
// child; disabled forwards straight; touchSoundDisabled maps to the pressable's android_disableSound.
|
|
10
10
|
// Every OTHER field of the shared IButtonProps (title, color, disabled, touchSoundDisabled, testID,
|
|
11
|
-
// TV-focus, accessibility state) is agnostic and stays RE-EXPORTED from @symbiote-native/components
|
|
12
|
-
//
|
|
11
|
+
// TV-focus, accessibility state) is agnostic and stays RE-EXPORTED from @symbiote-native/components
|
|
12
|
+
// verbatim. onPress and the four accessibility callbacks are the
|
|
13
13
|
// exceptions: each is a real @Output() here (`press`, `accessibilityAction`, `accessibilityTap`,
|
|
14
14
|
// `magicTap`, `accessibilityEscape`), mirroring the Vue adapter's Button, which forks the SAME onPress
|
|
15
15
|
// field the same way (`Omit<ICoreButtonProps, 'onPress'>` + a `press` emit) — not a new precedent, the
|
|
@@ -33,7 +33,7 @@ const chips: IChip[] = Array.from({ length: 24 }, (_unused, index) => ({
|
|
|
33
33
|
// it reaches a `[style]=` binding — required of app authors (see App.ts) AND of every adapter
|
|
34
34
|
// component that forwards its own `style` @Input() onward (see the `resolvedStyle` getters/fields
|
|
35
35
|
// in virtualized-list, section-list, virtualized-section-list — flat-list's own `rowStyle` had the
|
|
36
|
-
// identical landmine, always assigning an array).
|
|
36
|
+
// identical landmine, always assigning an array).
|
|
37
37
|
@Component({
|
|
38
38
|
selector: 'symbiote-chip-list-host',
|
|
39
39
|
standalone: true,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: FlatList is its own
|
|
2
2
|
// ANCHOR_HOST_COMPONENTS entry, separate from the VirtualizedList/ScrollView anchors it wraps two
|
|
3
3
|
// levels down — a class= on <FlatList> resolves onto FlatList's OWN anchor and needs its OWN
|
|
4
4
|
// anchorHostStyle merge (see index.ts's ngOnChanges), it is NOT transitively fixed by
|
|
@@ -21,8 +21,8 @@ const chips: IChip[] = Array.from({ length: 24 }, (_unused, index) => ({
|
|
|
21
21
|
}));
|
|
22
22
|
|
|
23
23
|
// Mirrors examples/angular/App.ts's "FlatList · 24 chips" demo end to end: a horizontal FlatList
|
|
24
|
-
// with getItemLayout. Regression coverage for a bug fixed 2026-07
|
|
25
|
-
//
|
|
24
|
+
// with getItemLayout. Regression coverage for a bug fixed 2026-07: cell content used to land
|
|
25
|
+
// OUTSIDE the ScrollView's content view entirely — as top-level siblings
|
|
26
26
|
// of the committed RCTScrollView node, instead of children of its RCTScrollContentView — which is
|
|
27
27
|
// why the device screenshot showed full-width vertically-stacked chips instead of a small
|
|
28
28
|
// horizontal row. Root cause was `<ng-content>` declared once per `@if`/`@else` branch in
|
|
@@ -31,8 +31,7 @@
|
|
|
31
31
|
// surface; FlatList re-exposes it by delegating to the inner VirtualizedList (@ViewChild). The
|
|
32
32
|
// element-returning props (renderItem / ItemSeparatorComponent / List{Header,Footer,Empty}Component)
|
|
33
33
|
// are templates in Angular, so they are absent from IFlatListProps, per the per-adapter
|
|
34
|
-
// children/render split
|
|
35
|
-
// IVirtualizedListProps.
|
|
34
|
+
// children/render prop split; everything agnostic mirrors IVirtualizedListProps.
|
|
36
35
|
|
|
37
36
|
import {
|
|
38
37
|
CUSTOM_ELEMENTS_SCHEMA,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: Image is its own
|
|
2
2
|
// ANCHOR_HOST_COMPONENTS entry — a class= on <Image> resolves onto Image's OWN anchor and needs
|
|
3
3
|
// its OWN anchorHostStyle merge (see index.ios.ts/index.android.ts's imageProps override), not
|
|
4
4
|
// transitively fixed by anything else. Mirrors pressable.test.ts's "resolves a class=" case.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: ImageBackground is its own
|
|
2
2
|
// ANCHOR_HOST_COMPONENTS entry, separate from the Image it composes internally — a class= on
|
|
3
3
|
// <ImageBackground> resolves onto ImageBackground's OWN anchor and needs its OWN anchorHostStyle
|
|
4
4
|
// merge onto its wrapper View (see image-background.ts's wrapperStyle getter), NOT onto its
|
|
@@ -41,7 +41,7 @@ import { anchorHostStyle, ViewHost } from '../primitives';
|
|
|
41
41
|
|
|
42
42
|
// Mirrors React's IImageBackgroundProps minus children (Angular takes children via <ng-content>):
|
|
43
43
|
// every forwarding Image prop flows onto the inner image; `style` is the WRAPPER View style and
|
|
44
|
-
// `imageStyle` the inner image's
|
|
44
|
+
// `imageStyle` the inner image's.
|
|
45
45
|
export interface IAngularImageBackgroundProps extends Omit<IImageProps, 'style'> {
|
|
46
46
|
style?: IStyleProp<IViewStyle>;
|
|
47
47
|
// A bare string resolves through the shared style registry, like `class` on the wrapper.
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
// Angular twin of React's setState / Vue's reactive ref), ngOnDestroy tears the subscriptions down,
|
|
7
7
|
// and the wrapper's onLayout measures the frame that feeds the next event's inset. The user
|
|
8
8
|
// children nest under the wrapper (or, for 'position', an inner View) via <ng-content>. No native
|
|
9
|
-
// host of its own — it wraps symbiote-view — so this stays a flat single file
|
|
9
|
+
// host of its own — it wraps symbiote-view — so this stays a flat single file.
|
|
10
10
|
//
|
|
11
11
|
// Full parity: behavior 'height'|'position'|'padding', enabled, keyboardVerticalOffset,
|
|
12
12
|
// contentContainerStyle, onLayout, plus the full a11y/aria surface every View carries.
|
|
@@ -58,8 +58,8 @@ function isSymbioteEvent(value: unknown): value is ISymbioteEvent {
|
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
// Mirrors React's IKeyboardAvoidingViewProps minus children (Angular takes children via
|
|
61
|
-
// <ng-content>), declared per-adapter over the shared
|
|
62
|
-
//
|
|
61
|
+
// <ng-content>), declared per-adapter over the shared accessibility base since a framework-specific
|
|
62
|
+
// children field keeps it from being fully shared across adapters.
|
|
63
63
|
export interface IAngularKeyboardAvoidingViewProps extends IAccessibilityProps, IAriaProps {
|
|
64
64
|
behavior?: IKeyboardAvoidingBehavior;
|
|
65
65
|
enabled?: boolean;
|
|
@@ -118,7 +118,7 @@ export class KeyboardAvoidingView implements IAngularKeyboardAvoidingViewInputs,
|
|
|
118
118
|
// The wrapper's onLayout is a real @Output(): `(layout)="…"`, not `[onLayout]="…"`. Safe to
|
|
119
119
|
// name it the same as the native `layout` event fired inside this component's own template
|
|
120
120
|
// (see the class's `handleLayout`) — the engine's bubble() treats ANCHOR_HOST_COMPONENTS as
|
|
121
|
-
// transparent to listener lookup, so there is no double-fire
|
|
121
|
+
// transparent to listener lookup, so there is no double-fire.
|
|
122
122
|
@Output() readonly layout = new EventEmitter<ISymbioteEvent>();
|
|
123
123
|
@Output() readonly accessibilityAction = new EventEmitter<ISymbioteEvent>();
|
|
124
124
|
@Output() readonly accessibilityTap = new EventEmitter<ISymbioteEvent>();
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
// RefreshControl, the Angular lifecycle half. On iOS this is the PullToRefreshView Fabric node that
|
|
2
2
|
// lives INSIDE a ScrollView (a childless sibling before the content container); on Android it is
|
|
3
|
-
// AndroidSwipeRefreshLayout and WRAPS the scroll view
|
|
3
|
+
// AndroidSwipeRefreshLayout and WRAPS the scroll view, receiving it through <ng-content>.
|
|
4
4
|
// The Angular twin of the React/Vue RefreshControl. There is no JS-side platform renaming and no
|
|
5
5
|
// shared render fn — every prop forwards straight to the native node, which reads the ones it
|
|
6
6
|
// understands and ignores the rest, so the Android-only and iOS-only families ride down harmlessly
|
|
7
7
|
// on both. So this folds aria/role through the shared resolveAccessibilityProps and maps the native
|
|
8
8
|
// props + a11y + onRefresh straight onto the symbiote-refresh-control host, children via <ng-content>.
|
|
9
|
-
// No platform branch (one composed component both platforms), so this stays a flat single file
|
|
9
|
+
// No platform branch (one composed component both platforms), so this stays a flat single file.
|
|
10
10
|
//
|
|
11
11
|
// `refreshing` is a controlled prop: the parent owns it and pushes it down each commit; native
|
|
12
12
|
// reports the gesture via the direct `topRefresh` event, which the engine routes to the host's
|
|
@@ -54,8 +54,9 @@ function isSymbioteEvent(value: unknown): value is ISymbioteEvent {
|
|
|
54
54
|
}
|
|
55
55
|
|
|
56
56
|
// Mirrors React's IRefreshControlProps minus children (Angular takes the Android-wrapped scroll view
|
|
57
|
-
// via <ng-content>), declared per-adapter over the shared
|
|
58
|
-
//
|
|
57
|
+
// via <ng-content>), declared per-adapter over the shared accessibility base since the framework-specific
|
|
58
|
+
// children slot keeps it from being fully shared across adapters. Read the React reference for the
|
|
59
|
+
// native prop names.
|
|
59
60
|
export interface IAngularRefreshControlProps extends IAccessibilityProps, IAriaProps {
|
|
60
61
|
refreshing: boolean;
|
|
61
62
|
// RN's onRefresh is `() => void | Promise<void>`, the handler may be async; the promise is
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
// so this folds aria/role through the shared resolveAccessibilityProps and maps style +
|
|
5
5
|
// a11y + onLayout straight onto the symbiote-safe-area-view host, children via <ng-content>.
|
|
6
6
|
// The Angular twin of the React/Vue SafeAreaView. No platform branch (one Fabric name both
|
|
7
|
-
// platforms), so this stays a flat single file
|
|
7
|
+
// platforms), so this stays a flat single file.
|
|
8
8
|
|
|
9
9
|
import {
|
|
10
10
|
CUSTOM_ELEMENTS_SCHEMA,
|
|
@@ -32,7 +32,8 @@ function isSymbioteEvent(value: unknown): value is ISymbioteEvent {
|
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
// Mirrors React's ISafeAreaViewProps minus children (Angular takes children via <ng-content>),
|
|
35
|
-
// declared per-adapter over the shared
|
|
35
|
+
// declared per-adapter over the shared accessibility base since the framework-specific children
|
|
36
|
+
// slot keeps it from being fully shared across adapters.
|
|
36
37
|
export interface IAngularSafeAreaViewProps extends IAccessibilityProps, IAriaProps {
|
|
37
38
|
style?: IStyleProp<IViewStyle>;
|
|
38
39
|
onLayout?: (event: ISymbioteEvent) => void;
|
|
@@ -73,8 +74,7 @@ export class SafeAreaView implements IAngularSafeAreaViewInputs {
|
|
|
73
74
|
@Input() style?: IStyleProp<IViewStyle>;
|
|
74
75
|
// Real @Output()s, not `[onX]="…"` callbacks. Safe to name `layout` the same as the native
|
|
75
76
|
// `layout` event fired inside this component's own template — the engine's bubble() treats
|
|
76
|
-
// ANCHOR_HOST_COMPONENTS as transparent to listener lookup, so there is no double-fire
|
|
77
|
-
// (angular-adapter skill §7).
|
|
77
|
+
// ANCHOR_HOST_COMPONENTS as transparent to listener lookup, so there is no double-fire.
|
|
78
78
|
@Output() readonly layout = new EventEmitter<ISymbioteEvent>();
|
|
79
79
|
@Output() readonly accessibilityAction = new EventEmitter<ISymbioteEvent>();
|
|
80
80
|
@Output() readonly accessibilityTap = new EventEmitter<ISymbioteEvent>();
|
|
@@ -134,7 +134,7 @@ export class SafeAreaView implements IAngularSafeAreaViewInputs {
|
|
|
134
134
|
// the host node never sees an aria-* key (native ignores them), same transform React's
|
|
135
135
|
// SafeAreaView runs over its whole `rawProps`. The anchor's class-derived style goes FIRST, this
|
|
136
136
|
// component's own explicit `style` @Input SECOND — flattenStyle's later-wins collapse keeps an
|
|
137
|
-
// explicit [style] winning over its ambient class
|
|
137
|
+
// explicit [style] winning over its ambient class.
|
|
138
138
|
get hostProps(): Record<string, unknown> {
|
|
139
139
|
return resolveAccessibilityProps({
|
|
140
140
|
style: [anchorHostStyle(this.elementRef), this.style],
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for
|
|
1
|
+
// Regression test for an Android content-projection bug:
|
|
2
2
|
// ScrollView on Android picks a different native content view per axis (RCTView vs
|
|
3
3
|
// AndroidHorizontalScrollContentView), which used to require a separate <ng-content> per
|
|
4
4
|
// axis x refresh-control combination — and Angular only reliably projects into a component's
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
// ScrollView on Android
|
|
1
|
+
// ScrollView on Android. An Android ScrollView accepts only ONE child, so a
|
|
2
2
|
// RefreshControl can't be a sibling of the content the way iOS allows ("addViewAt: failed to insert
|
|
3
3
|
// view ... at index 1"). RN solves this by having the RefreshControl (AndroidSwipeRefreshLayout)
|
|
4
4
|
// WRAP the scroll view (cloneElement(refreshControl, {style}, scrollView)). Angular mirrors that
|
|
5
5
|
// shape by querying a projected <RefreshControl>, re-rendering its native prop surface as the outer
|
|
6
6
|
// wrapper, and projecting every non-RefreshControl child into the inner scroll content.
|
|
7
7
|
//
|
|
8
|
-
//
|
|
8
|
+
// Android genuinely needs a different Fabric view per
|
|
9
9
|
// axis for BOTH the outer scroll container (RCTScrollView is vertical-only; AndroidHorizontalScrollView
|
|
10
10
|
// is a dedicated ViewManager) AND the inner content view (vertical content is a plain Android View,
|
|
11
11
|
// horizontal content is AndroidHorizontalScrollContentView, which carries its own ShadowNode::
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// ScrollView on iOS
|
|
1
|
+
// ScrollView on iOS. The RefreshControl is a CHILD of the scroll view, rendered
|
|
2
2
|
// as a SIBLING BEFORE the content container (RN ScrollView.js: {refreshControl}{contentContainer}).
|
|
3
3
|
// The developer composes it as a projected child of <ScrollView>; this template selects it into the
|
|
4
4
|
// sibling slot before the scroll-content. Also the base (index.ts re-exports it) for headless /
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
// FIRST (`@if`) branch never receives Angular's native catch-up placement, only the SECOND
|
|
14
14
|
// (`@else`) branch does (angular/angular#53310, #54840 — Angular's own docs: "You should not
|
|
15
15
|
// conditionally include <ng-content> with @if, @for, or @switch"). Symptom here was axis-specific:
|
|
16
|
-
// a horizontal FlatList's cells landed outside the ScrollView entirely.
|
|
17
|
-
//
|
|
16
|
+
// a horizontal FlatList's cells landed outside the ScrollView entirely. Fix: single unconditional
|
|
17
|
+
// `<ng-content>` call site.
|
|
18
18
|
|
|
19
19
|
import {
|
|
20
20
|
CUSTOM_ELEMENTS_SCHEMA,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// Base / default ScrollView. Re-exports the iOS build. Metro overrides this with index.ios.ts /
|
|
2
2
|
// index.android.ts on a real host; under tsx / tsc / web the host resolves here. Filename is the
|
|
3
|
-
// selector, no Platform.OS read.
|
|
3
|
+
// selector, no Platform.OS read.
|
|
4
4
|
|
|
5
5
|
export * from './index.ios';
|
|
6
6
|
export { ScrollViewStickyHeader } from './sticky-header';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: a composed component's own
|
|
2
2
|
// use-site `class="..."` resolves through Angular's addClass/removeClass onto the component's
|
|
3
3
|
// non-painting ANCHOR host (ANCHOR_HOST_COMPONENTS in renderer.ts), never onto the real Fabric
|
|
4
4
|
// node its own template renders — so the resolved style was silently lost. Fixed via
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// ScrollView, the Angular lifecycle half
|
|
1
|
+
// ScrollView, the Angular lifecycle half. The Fabric tree is nested: a scroll view
|
|
2
2
|
// wraps a content view that holds the children (RN's ScrollView.js shape). The platform-invariant
|
|
3
3
|
// math (decelerationRate, the per-axis intrinsics/base style, the content-size dedupe, the
|
|
4
4
|
// imperative handle, the native sticky scroll-attach, the aria/role fold) lives in
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
// flashScrollIndicators), the content-size dedupe, and the native sticky scroll-attach wired
|
|
9
9
|
// through whenCommitted. This is the Angular twin of the React useRef + Vue shallowRef host.
|
|
10
10
|
//
|
|
11
|
-
// What diverges per platform
|
|
11
|
+
// What diverges per platform, how a RefreshControl integrates, stays in the
|
|
12
12
|
// .ios/.android files (Metro filename-selected): iOS renders the RefreshControl as a SIBLING
|
|
13
13
|
// before the content container; on Android an AndroidSwipeRefreshLayout WRAPS the scroll view.
|
|
14
14
|
//
|
|
@@ -160,8 +160,8 @@ export const SCROLL_VIEW_INPUTS = [
|
|
|
160
160
|
// The Angular-facing prop surface. React's IScrollViewProps is React-coupled (ReactNode children,
|
|
161
161
|
// ReactElement refreshControl); Angular takes children via <ng-content> and composes the
|
|
162
162
|
// RefreshControl through projection / an outer wrap, so this mirrors the same pass-through surface
|
|
163
|
-
// minus those, declared per-adapter over the shared
|
|
164
|
-
//
|
|
163
|
+
// minus those, declared per-adapter over the shared accessibility base since a framework element/ref
|
|
164
|
+
// field can't live in a shared agnostic type. Every prop is accepted and typed against the full
|
|
165
165
|
// React surface so app code type-checks against parity now.
|
|
166
166
|
export interface IAngularScrollViewProps extends IAccessibilityProps, IAriaProps {
|
|
167
167
|
style?: IStyleProp<IViewStyle>;
|
|
@@ -734,7 +734,7 @@ export abstract class ScrollViewBase implements IAngularScrollViewInputs, AfterV
|
|
|
734
734
|
|
|
735
735
|
// The imperative API a parent reaches via @ViewChild(ScrollView). buildScrollViewHandle is the
|
|
736
736
|
// shared, proven handle (React/Vue use it verbatim); it reads the node through the LAZY getter on
|
|
737
|
-
// every call, so a command before commit no-ops rather than freezing a null node
|
|
737
|
+
// every call, so a command before commit no-ops rather than freezing a null node.
|
|
738
738
|
private readonly handle: IScrollViewHandle = buildScrollViewHandle(() => this.hostNode);
|
|
739
739
|
|
|
740
740
|
scrollTo(options?: { x?: number; y?: number; animated?: boolean }): void {
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
// it to the top (or bottom, inverted) until the next header collides with it. The native Fabric
|
|
7
7
|
// scroll view does NOT honor `stickyHeaderIndices` on its own. The load-bearing top/inverted
|
|
8
8
|
// interpolation math (computeStickyInterpolation) lives framework-agnostic in @symbiote-native/components
|
|
9
|
-
//
|
|
9
|
+
// this file holds the Angular component shell, the layout state, and the interpolation
|
|
10
10
|
// build, sharing the math verbatim with React/Vue. Angular supplies only the lifecycle (inputs +
|
|
11
11
|
// manual change detection instead of useState/useEffect or refs/watch).
|
|
12
12
|
//
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: TextInput is its own
|
|
2
2
|
// ANCHOR_HOST_COMPONENTS entry — a class= on <TextInput> resolves onto TextInput's OWN anchor and
|
|
3
3
|
// needs its OWN anchorHostStyle merge (see text-input.ts's buildPassthrough), for BOTH the
|
|
4
4
|
// single-line and multiline host it renders through (`@if`/`@else` picks one at runtime). Mirrors
|
|
@@ -90,8 +90,8 @@ function isSymbioteEvent(value: unknown): value is ISymbioteEvent {
|
|
|
90
90
|
}
|
|
91
91
|
|
|
92
92
|
// Mirrors React's ITextInputProps minus nothing (TextInput has no children) — declared
|
|
93
|
-
// per-adapter over the shared
|
|
94
|
-
//
|
|
93
|
+
// per-adapter over the shared accessibility base because Angular's input surface aliases the
|
|
94
|
+
// aria-* keys to camelCase @Inputs, unlike the plain agnostic fields shared across adapters.
|
|
95
95
|
export interface IAngularTextInputProps extends IAccessibilityProps, IAriaProps {
|
|
96
96
|
value?: string;
|
|
97
97
|
defaultValue?: string;
|
|
@@ -7,9 +7,9 @@
|
|
|
7
7
|
// so the child still renders with working press wiring. The static factories + background mapping
|
|
8
8
|
// are shared in @symbiote-native/components and reused verbatim — Angular only attaches them onto the
|
|
9
9
|
// component class and nests the feedback view. No JS-side platform branch (one Fabric path both
|
|
10
|
-
// platforms), so this stays a flat single file
|
|
10
|
+
// platforms), so this stays a flat single file, mirroring React/Vue.
|
|
11
11
|
//
|
|
12
|
-
// This component's own press/hover events are
|
|
12
|
+
// This component's own press/hover events are real @Output() EventEmitters too, matching
|
|
13
13
|
// Pressable (which it wraps) — `(press)="press.emit($event)"`, never `[onPress]="onPress"`.
|
|
14
14
|
// Non-event config (delayLongPress, hitSlop, ...) still rides down as plain @Input() bindings. The
|
|
15
15
|
// a11y identity bag + the four a11y events live on the feedback view — the one host intrinsic here —
|
|
@@ -57,7 +57,7 @@ export type {
|
|
|
57
57
|
// Mirrors React's ITouchableNativeFeedbackProps (Omit<IPressableProps, 'style'> + the native
|
|
58
58
|
// feedback config) minus children (Angular takes children via <ng-content>) and minus the press/
|
|
59
59
|
// hover events (declared as this component's OWN @Output()s below). Declared per-adapter over the
|
|
60
|
-
// shared Pressable INPUT surface
|
|
60
|
+
// shared Pressable INPUT surface.
|
|
61
61
|
export type IAngularTouchableNativeFeedbackProps = Omit<IAngularPressableInputs, 'style'> & {
|
|
62
62
|
background?: INativeFeedbackBackground;
|
|
63
63
|
useForeground?: boolean;
|
|
@@ -17,9 +17,9 @@
|
|
|
17
17
|
// (`(accessibilityAction)="accessibilityAction.emit($event)"`); accessibility STATE folds the web
|
|
18
18
|
// aria-*/role aliases and merges `disabled` into the a11y state on Pressable's own host — no re-fold
|
|
19
19
|
// here (the a11y host is Pressable's view, mirroring React's `...rest` -> Pressable). No JS-side
|
|
20
|
-
// platform branch, so this stays a flat single file
|
|
21
|
-
//
|
|
22
|
-
//
|
|
20
|
+
// platform branch, so this stays a flat single file, mirroring React/Vue. Each Touchable
|
|
21
|
+
// forwards the Angular Pressable surface verbatim; parity is against that surface, exactly as
|
|
22
|
+
// React's Touchable parity is against
|
|
23
23
|
// the React Pressable surface.
|
|
24
24
|
|
|
25
25
|
import {
|
|
@@ -62,8 +62,8 @@ import { Animated, AnimatedView } from '../modules/animated';
|
|
|
62
62
|
// The shared field base for all three: the Pressable INPUT surface (minus style, which each
|
|
63
63
|
// Touchable routes differently, and minus the press/hover events, which each Touchable declares as
|
|
64
64
|
// its OWN @Output()s below) + RN's press-timing config + the public style. Mirrors React/Vue's
|
|
65
|
-
// ITouchableBaseProps. Declared per-adapter over the Angular Pressable surface
|
|
66
|
-
//
|
|
65
|
+
// ITouchableBaseProps. Declared per-adapter over the Angular Pressable surface, since children
|
|
66
|
+
// ride <ng-content> here rather than a field, unlike React/Vue's element-returning props.
|
|
67
67
|
type IAngularTouchableBaseProps = Omit<IAngularPressableInputs, 'style'> &
|
|
68
68
|
IPressTimingProps & {
|
|
69
69
|
style?: IStyleProp<IViewStyle>;
|
|
@@ -3,8 +3,7 @@
|
|
|
3
3
|
// `ItemSeparatorComponent`. React/Vue pass an element-returning callback; that does NOT
|
|
4
4
|
// translate to Angular, where per-item content is a TEMPLATE. So the app supplies each
|
|
5
5
|
// slot as an `<ng-template>` carrying one of these structural directives, and the list
|
|
6
|
-
// stamps the windowed slice through them.
|
|
7
|
-
// <prop_types_split_agnostic_vs_per_adapter>: the agnostic windowing surface stays shared,
|
|
6
|
+
// stamps the windowed slice through them. The agnostic windowing surface stays shared,
|
|
8
7
|
// only the cell-AUTHORING shape is framework-specific.
|
|
9
8
|
//
|
|
10
9
|
// Authoring API (what FlatList / SectionList build on, and what the app imports):
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// VirtualizedList, the Angular lifecycle half. The windowing engine (offset table, window
|
|
2
2
|
// compute, batch throttle, viewability, edge-reached, the child PLAN, the imperative-handle
|
|
3
3
|
// geometry) lives in @symbiote-native/components/state, shared verbatim with the React and Vue adapters
|
|
4
|
-
//
|
|
4
|
+
// so every adapter keeps the same feature surface. Here Angular supplies only the lifecycle: plain fields
|
|
5
5
|
// for scroll offset / viewport / measurement bumps, a once-per-CD metrics + view recompute in
|
|
6
6
|
// ngDoCheck (the Angular twin of React render / Vue `computed` — it owns the controlled
|
|
7
7
|
// committedWindow throttle and assembles the windowed cells before the template bindings are read),
|
|
@@ -19,11 +19,10 @@
|
|
|
19
19
|
// (a core-only NgTemplateOutlet twin — @angular/common is not a dependency). See ./directives.ts.
|
|
20
20
|
// Every React/Vue behavior is present (windowing, onEndReached, viewability, headers/footers/empty/
|
|
21
21
|
// separators, refresh, imperative scroll, horizontal, inverted, MVCP); only the cell AUTHORING
|
|
22
|
-
// shape differs,
|
|
23
|
-
// <prop_types_split_agnostic_vs_per_adapter>.
|
|
22
|
+
// shape differs, since a callback prop returning an element has no Angular equivalent.
|
|
24
23
|
//
|
|
25
|
-
// Lists have no Descriptor render fn
|
|
26
|
-
//
|
|
24
|
+
// Lists have no Descriptor render fn — the cell content is the framework's own children.
|
|
25
|
+
// Cells/spacers are plain symbiote-view host elements.
|
|
27
26
|
|
|
28
27
|
import {
|
|
29
28
|
CUSTOM_ELEMENTS_SCHEMA,
|
|
@@ -127,8 +126,8 @@ export type { IVListItemContext, IVListSeparatorContext } from './directives';
|
|
|
127
126
|
|
|
128
127
|
// The Angular VirtualizedList prop surface. Mirrors React/Vue's IVirtualizedListProps MINUS the
|
|
129
128
|
// element-returning props (renderItem, ListHeader/Footer/Empty Component, ItemSeparatorComponent):
|
|
130
|
-
// those are the per-adapter children/render fields and become `<ng-template>` directives in Angular
|
|
131
|
-
//
|
|
129
|
+
// those are the per-adapter children/render fields and become `<ng-template>` directives in Angular.
|
|
130
|
+
// Everything agnostic is the SAME surface.
|
|
132
131
|
export interface IVirtualizedListProps<ItemT> extends IAccessibilityProps, IAriaProps {
|
|
133
132
|
data: unknown;
|
|
134
133
|
getItem: (data: unknown, index: number) => ItemT;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: VirtualizedList is its own
|
|
2
2
|
// ANCHOR_HOST_COMPONENTS entry — a class= on <VirtualizedList> resolves onto VirtualizedList's OWN
|
|
3
3
|
// anchor and needs its OWN anchorHostStyle merge (see index.ts's recomputeView), it is NOT
|
|
4
4
|
// transitively fixed by ScrollView's own fix one level down. Mirrors pressable.test.ts's
|
|
@@ -3,8 +3,7 @@
|
|
|
3
3
|
// React/Vue pass element-returning callbacks; that does NOT translate to Angular, where per-cell
|
|
4
4
|
// content is a TEMPLATE. So the app supplies each section slot as an `<ng-template>` carrying one
|
|
5
5
|
// of these structural directives, and VirtualizedSectionList stamps the windowed slice through
|
|
6
|
-
// them.
|
|
7
|
-
// the shared flatten/window surface stays in @symbiote-native/components, only the cell-AUTHORING shape is
|
|
6
|
+
// them. The shared flatten/window surface stays in @symbiote-native/components, only the cell-AUTHORING shape is
|
|
8
7
|
// framework-specific. SectionList (the next layer) reuses these same directives verbatim.
|
|
9
8
|
//
|
|
10
9
|
// Authoring API (what the app imports and what SectionList builds on):
|
|
@@ -12,8 +12,8 @@
|
|
|
12
12
|
// `vListItem` template that @switch-es on the flattened entry's tag and stamps the matching app
|
|
13
13
|
// template (captured via @ContentChild on the vSection* directives) through VListOutletDirective.
|
|
14
14
|
// list-level header/footer/empty/item-separator reuse VirtualizedList's own directives, forwarded
|
|
15
|
-
// the same way.
|
|
16
|
-
//
|
|
15
|
+
// the same way. Only the cell-AUTHORING shape is framework-specific; the rest of the surface
|
|
16
|
+
// stays shared with React/Vue.
|
|
17
17
|
//
|
|
18
18
|
// Accessibility / aria props are forwarded unchanged to the inner VirtualizedList, which owns the
|
|
19
19
|
// shared aria→accessibility* fold before the props reach the ScrollView host.
|
|
@@ -88,8 +88,8 @@ export type { IVSectionContext, IVSectionItemContext } from './directives';
|
|
|
88
88
|
|
|
89
89
|
// The Angular VirtualizedSectionList prop surface. Mirrors React/Vue's IVirtualizedSectionListProps
|
|
90
90
|
// MINUS the element-returning props (renderItem, renderSectionHeader/Footer, the *Component slots):
|
|
91
|
-
// those are the per-adapter children/render fields and become `<ng-template>` directives in Angular
|
|
92
|
-
//
|
|
91
|
+
// those are the per-adapter children/render fields and become `<ng-template>` directives in Angular.
|
|
92
|
+
// Everything agnostic is the SAME surface as the
|
|
93
93
|
// React/Vue adapters, including the a11y/aria prop family forwarded through VirtualizedList.
|
|
94
94
|
export interface IVirtualizedSectionListProps<ItemT> extends IAccessibilityProps, IAriaProps {
|
|
95
95
|
sections: ReadonlyArray<ISection<ItemT>>;
|
package/src/components/virtualized-section-list/virtualized-section-list-class-style.test.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug
|
|
1
|
+
// Regression test for the anchor/class bug: VirtualizedSectionList is its
|
|
2
2
|
// own ANCHOR_HOST_COMPONENTS entry — a class= on <VirtualizedSectionList> resolves onto its OWN
|
|
3
3
|
// anchor and needs its OWN anchorHostStyle merge (see index.ts's resolvedStyle getter), it is NOT
|
|
4
4
|
// transitively fixed by VirtualizedList's/ScrollView's own fixes further down. Mirrors
|
package/src/create-portal.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
// createPortal for @symbiote-native/angular — the Angular twin of the React/Vue same-surface portal
|
|
2
2
|
// (create-portal.ts / Teleport in runtime-helpers.ts). Scope is identical: the target must be
|
|
3
|
-
// an already-mounted location WITHIN THE SAME SURFACE as the portal's call site —
|
|
4
|
-
//
|
|
5
|
-
//
|
|
3
|
+
// an already-mounted location WITHIN THE SAME SURFACE as the portal's call site — moving content
|
|
4
|
+
// across independently-mounted surfaces has no safe host-level primitive to hook into, so
|
|
5
|
+
// createTunnel (create-tunnel.ts) covers that cross-surface case instead.
|
|
6
6
|
//
|
|
7
7
|
// React/Vue implement this as a thin validating wrapper around a mechanism the FRAMEWORK
|
|
8
8
|
// ITSELF already has (react-reconciler's Fiber-level HostPortal, Vue's own <Teleport>) — all
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
// Angular descriptor outlet. The React/Vue bridges can return framework elements directly
|
|
2
2
|
// (`descriptorToReact` / `descriptorToVue`); Angular needs a tiny standalone component that
|
|
3
|
-
// consumes a Descriptor tree and drives Renderer2 imperatively
|
|
4
|
-
//
|
|
5
|
-
//
|
|
3
|
+
// consumes a Descriptor tree and drives Renderer2 imperatively, patching same type/key nodes
|
|
4
|
+
// instead of clearing and recreating the subtree so it keeps retained-node identity and Fabric
|
|
5
|
+
// stays on the clone-on-write path.
|
|
6
6
|
|
|
7
7
|
import {
|
|
8
8
|
ChangeDetectionStrategy,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// Co-located test for findNodeHandle
|
|
1
|
+
// Co-located test for findNodeHandle, the Angular twin of adapters/vue/src/host-instance/host-instance.test.ts.
|
|
2
2
|
// Proves the Angular adapter can resolve a raw engine node, an engine public instance, a bare
|
|
3
3
|
// reactTag, and null/undefined to a native tag using the engine's getNativeTag.
|
|
4
4
|
|
package/src/index.ts
CHANGED
|
@@ -3,8 +3,7 @@
|
|
|
3
3
|
// lives in the engine, shared with every other adapter. App code names only @symbiote-native/angular.
|
|
4
4
|
//
|
|
5
5
|
// SEAM SCAFFOLD: mount/unmount + the renderer seam + host intrinsic selectors. Full RN-like
|
|
6
|
-
// composed components still flow through the shared @symbiote-native/components bridge
|
|
7
|
-
// `angular-adapter` skill (§6 descriptorToAngular, the layered milestones).
|
|
6
|
+
// composed components still flow through the shared @symbiote-native/components bridge.
|
|
8
7
|
|
|
9
8
|
export {
|
|
10
9
|
ActivityIndicator,
|
|
@@ -49,8 +48,8 @@ export {
|
|
|
49
48
|
} from './components';
|
|
50
49
|
export { Animated } from './modules/animated';
|
|
51
50
|
// Also exposed as named top-level symbols (not just Animated.View/.Text/...): ngtsc's partial-mode
|
|
52
|
-
// static evaluator
|
|
53
|
-
//
|
|
51
|
+
// static evaluator can't trace a component class through property access on an external
|
|
52
|
+
// namespace object, only through a direct named import binding —
|
|
54
53
|
// so `<AnimatedView>` in a template requires `import { AnimatedView } from '@symbiote-native/angular'`,
|
|
55
54
|
// not `const AnimatedView = Animated.View`. Plain tsc/vitest don't catch this; only a real ngc run does.
|
|
56
55
|
export {
|
|
@@ -123,8 +122,8 @@ export type {
|
|
|
123
122
|
} from './components';
|
|
124
123
|
export { setImageSourceResolver } from './components';
|
|
125
124
|
export { mount, unmount } from './render';
|
|
126
|
-
// The generic Descriptor→Angular bridge
|
|
127
|
-
//
|
|
125
|
+
// The generic Descriptor→Angular bridge, the twin of descriptorToReact/descriptorToVue.
|
|
126
|
+
// Exported so a component defined OUTSIDE this package (e.g.
|
|
128
127
|
// @symbiote-native/slider) can render a shared @symbiote-native/components/@symbiote-native/slider Descriptor tree
|
|
129
128
|
// without hand-writing its own Renderer2 walker.
|
|
130
129
|
export { DescriptorOutlet } from './descriptor-to-angular';
|
|
@@ -133,7 +132,7 @@ export { DescriptorOutlet } from './descriptor-to-angular';
|
|
|
133
132
|
// Angular can't synthesize components at runtime (no JIT under Metro/Hermes), so both are
|
|
134
133
|
// static, pre-authored structural directives (`*portal`/`*tunnelIn`, the `*ngIf`/`*ngFor`
|
|
135
134
|
// idiom) parameterized by an `@Input()`, rather than a factory returning fresh components per
|
|
136
|
-
// call
|
|
135
|
+
// call.
|
|
137
136
|
export { PortalDirective, PortalOutletDirective } from './create-portal';
|
|
138
137
|
export { createTunnel, TunnelInDirective, TunnelOut, type ITunnelStore } from './create-tunnel';
|
|
139
138
|
export { SymbioteRenderer, SymbioteRendererFactory } from './renderer';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// createAnimatedComponent for @symbiote-native/angular: the Angular twin of the React/Vue
|
|
2
2
|
// wrapper. React/Vue have a runtime HOC (`createAnimatedComponent(Component)` builds a
|
|
3
3
|
// fresh wrapped component on the fly). Angular has NO such idiom AND it cannot have one:
|
|
4
|
-
// the AOT-under-Metro build
|
|
4
|
+
// the AOT-under-Metro build compiles every @Component at build
|
|
5
5
|
// time and ships NO JIT compiler to Hermes, so a runtime `Component({...})(class)` would
|
|
6
6
|
// throw. The idiomatic, AOT-safe equivalent is therefore an EXPLICIT set of standalone
|
|
7
7
|
// components — AnimatedView / AnimatedText / AnimatedImage / AnimatedScrollView — each a
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
//
|
|
14
14
|
// The framework-agnostic half (reduceProps / readPassthroughStyle / resolveHostNode /
|
|
15
15
|
// AnimatedProps / attachNativeEventHandler / isNativeAnimatedAvailable) comes from
|
|
16
|
-
// @symbiote-native/engine, shared verbatim with React and Vue
|
|
16
|
+
// @symbiote-native/engine, shared verbatim with React and Vue. Angular supplies
|
|
17
17
|
// only the lifecycle wiring. The per-frame path NEVER goes through Angular change
|
|
18
18
|
// detection: value.setValue / animation -> flushValue -> AnimatedProps.update() ->
|
|
19
19
|
// setNativeProps(node), exactly as on the other adapters.
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
// animated/index.ts. The animated COMPONENTS (View / Text / Image / ScrollView) are explicit
|
|
3
3
|
// standalone components (Angular has no runtime HOC — see create-animated-component.ts); the
|
|
4
4
|
// value graph, easing and imperative drivers come from @symbiote-native/engine (framework-agnostic,
|
|
5
|
-
// JS-driven
|
|
5
|
+
// JS-driven), spread in verbatim. Both halves meet here so the familiar surface,
|
|
6
6
|
// `Animated.timing(new Animated.Value(0), …).start()`, works against the Angular-driven engine.
|
|
7
7
|
|
|
8
8
|
import {
|