@symbiote-native/angular 0.6.0 → 0.6.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 -1
- package/babel-register-composed.cjs +11 -3
- package/build/angular/anchor-host-registry.d.ts +2 -0
- package/build/angular/anchor-host-registry.js +84 -0
- package/build/angular/anchor-host-registry.js.map +1 -0
- package/build/angular/components/input-accessory-view/index.d.ts +2 -1
- package/build/angular/components/input-accessory-view/index.js +28 -39
- package/build/angular/components/input-accessory-view/index.js.map +1 -1
- package/build/angular/components/scroll-view/projection.js +70 -48
- package/build/angular/components/scroll-view/projection.js.map +1 -1
- package/build/angular/components/scroll-view/shared.js +28 -25
- package/build/angular/components/scroll-view/shared.js.map +1 -1
- package/build/angular/components/scroll-view/sticky-header.d.ts +6 -7
- package/build/angular/components/scroll-view/sticky-header.js +82 -65
- package/build/angular/components/scroll-view/sticky-header.js.map +1 -1
- package/build/angular/components/touchable/index.d.ts +2 -5
- package/build/angular/components/touchable/index.js +36 -56
- package/build/angular/components/touchable/index.js.map +1 -1
- package/build/angular/components/virtualized-list/index.d.ts +5 -20
- package/build/angular/components/virtualized-list/index.js +145 -275
- package/build/angular/components/virtualized-list/index.js.map +1 -1
- package/build/angular/components/virtualized-section-list/index.js +2 -4
- package/build/angular/components/virtualized-section-list/index.js.map +1 -1
- package/build/angular/index.d.ts +2 -1
- package/build/angular/index.js +6 -1
- package/build/angular/index.js.map +1 -1
- package/build/angular/renderer/index.d.ts +0 -1
- package/build/angular/renderer/index.js +5 -60
- package/build/angular/renderer/index.js.map +1 -1
- package/package.json +8 -4
- package/src/anchor-host-registry.ts +88 -0
- package/src/components/input-accessory-view/index.ts +30 -39
- package/src/components/scroll-view/projection.ts +76 -46
- package/src/components/scroll-view/shared.ts +27 -19
- package/src/components/scroll-view/sticky-header.ts +89 -64
- package/src/components/touchable/index.ts +52 -66
- package/src/components/virtualized-list/index.ts +157 -368
- package/src/components/virtualized-section-list/index.ts +6 -3
- package/src/index.ts +6 -1
- package/src/renderer/index.ts +5 -63
- package/build/bootstrap.d.ts +0 -7
- package/build/bootstrap.js +0 -14
- package/build/components/activity-indicator/index.android.d.ts +0 -9
- package/build/components/activity-indicator/index.android.js +0 -64
- package/build/components/activity-indicator/index.d.ts +0 -1
- package/build/components/activity-indicator/index.ios.d.ts +0 -5
- package/build/components/activity-indicator/index.ios.js +0 -64
- package/build/components/activity-indicator/index.js +0 -3
- package/build/components/activity-indicator/shared.d.ts +0 -64
- package/build/components/activity-indicator/shared.js +0 -424
- package/build/components/button.d.ts +0 -60
- package/build/components/button.js +0 -456
- package/build/components/flat-list/index.d.ts +0 -119
- package/build/components/flat-list/index.js +0 -691
- package/build/components/image/index.android.d.ts +0 -7
- package/build/components/image/index.android.js +0 -88
- package/build/components/image/index.d.ts +0 -1
- package/build/components/image/index.ios.d.ts +0 -7
- package/build/components/image/index.ios.js +0 -88
- package/build/components/image/index.js +0 -2
- package/build/components/image/shared.d.ts +0 -101
- package/build/components/image/shared.js +0 -405
- package/build/components/image-background.d.ts +0 -78
- package/build/components/image-background.js +0 -583
- package/build/components/input-accessory-view/index.d.ts +0 -56
- package/build/components/input-accessory-view/index.js +0 -403
- package/build/components/keyboard-avoiding-view/index.d.ts +0 -79
- package/build/components/keyboard-avoiding-view/index.js +0 -504
- package/build/components/modal/index.d.ts +0 -89
- package/build/components/modal/index.js +0 -529
- package/build/components/pressable/index.d.ts +0 -120
- package/build/components/pressable/index.js +0 -639
- package/build/components/refresh-control/index.d.ts +0 -83
- package/build/components/refresh-control/index.js +0 -509
- package/build/components/safe-area-view/index.d.ts +0 -54
- package/build/components/safe-area-view/index.js +0 -388
- package/build/components/scroll-view/index.android.d.ts +0 -16
- package/build/components/scroll-view/index.android.js +0 -228
- package/build/components/scroll-view/index.d.ts +0 -3
- package/build/components/scroll-view/index.ios.d.ts +0 -6
- package/build/components/scroll-view/index.ios.js +0 -113
- package/build/components/scroll-view/index.js +0 -5
- package/build/components/scroll-view/projection.d.ts +0 -32
- package/build/components/scroll-view/projection.js +0 -311
- package/build/components/scroll-view/shared.d.ts +0 -225
- package/build/components/scroll-view/shared.js +0 -757
- package/build/components/scroll-view/sticky-header.d.ts +0 -38
- package/build/components/scroll-view/sticky-header.js +0 -257
- package/build/components/section-list/index.d.ts +0 -113
- package/build/components/section-list/index.js +0 -768
- package/build/components/switch/index.android.d.ts +0 -17
- package/build/components/switch/index.android.js +0 -107
- package/build/components/switch/index.d.ts +0 -1
- package/build/components/switch/index.ios.d.ts +0 -16
- package/build/components/switch/index.ios.js +0 -106
- package/build/components/switch/index.js +0 -3
- package/build/components/switch/shared.d.ts +0 -37
- package/build/components/switch/shared.js +0 -176
- package/build/components/text-input.d.ts +0 -150
- package/build/components/text-input.js +0 -821
- package/build/components/touchable/index.d.ts +0 -241
- package/build/components/touchable/index.js +0 -1672
- package/build/components/touchable-native-feedback/index.d.ts +0 -80
- package/build/components/touchable-native-feedback/index.js +0 -545
- package/build/components/virtualized-list/directives.d.ts +0 -41
- package/build/components/virtualized-list/directives.js +0 -249
- package/build/components/virtualized-list/index.d.ts +0 -265
- package/build/components/virtualized-list/index.js +0 -1343
- package/build/components/virtualized-section-list/directives.d.ts +0 -28
- package/build/components/virtualized-section-list/directives.js +0 -148
- package/build/components/virtualized-section-list/index.d.ts +0 -175
- package/build/components/virtualized-section-list/index.js +0 -854
- package/build/components.d.ts +0 -39
- package/build/components.js +0 -37
- package/build/create-portal/index.d.ts +0 -17
- package/build/create-portal/index.js +0 -128
- package/build/create-tunnel/index.d.ts +0 -29
- package/build/create-tunnel/index.js +0 -181
- package/build/descriptor-to-angular/index.d.ts +0 -19
- package/build/descriptor-to-angular/index.js +0 -186
- package/build/host-instance/index.d.ts +0 -2
- package/build/host-instance/index.js +0 -36
- package/build/index.d.ts +0 -21
- package/build/index.js +0 -40
- package/build/modules/animated/animated-leaf-binder/index.d.ts +0 -14
- package/build/modules/animated/animated-leaf-binder/index.js +0 -90
- package/build/modules/animated/animated-leaf-binder.d.ts +0 -14
- package/build/modules/animated/animated-leaf-binder.js +0 -90
- package/build/modules/animated/create-animated-component.d.ts +0 -48
- package/build/modules/animated/create-animated-component.js +0 -425
- package/build/modules/animated/index.d.ts +0 -51
- package/build/modules/animated/index.js +0 -58
- package/build/modules/app-registry/index.d.ts +0 -7
- package/build/modules/app-registry/index.js +0 -22
- package/build/modules/status-bar/index.d.ts +0 -17
- package/build/modules/status-bar/index.js +0 -121
- package/build/primitives/index.d.ts +0 -32
- package/build/primitives/index.js +0 -386
- package/build/primitives/shared.d.ts +0 -83
- package/build/primitives/shared.js +0 -230
- package/build/render/index.d.ts +0 -11
- package/build/render/index.js +0 -170
- package/build/renderer/index.d.ts +0 -38
- package/build/renderer/index.js +0 -355
- package/build/services/color-scheme.service.d.ts +0 -13
- package/build/services/color-scheme.service.js +0 -72
- package/build/services/index.d.ts +0 -2
- package/build/services/index.js +0 -2
- package/build/services/window-dimensions.service.d.ts +0 -13
- package/build/services/window-dimensions.service.js +0 -83
- package/src/__tests__/responder-change-detection.test.ts +0 -102
- package/src/__tests__/responder-nested-cd.test.ts +0 -113
- package/src/angular-gaps.test.ts +0 -142
- package/src/angular-imports.test.ts +0 -100
- package/src/components/activity-indicator/activity-indicator-class-style.test.ts +0 -44
- package/src/components/activity-indicator/activity-indicator.test.ts +0 -131
- package/src/components/flat-list/column-wrapper-style-class.test.ts +0 -116
- package/src/components/flat-list/flat-list-array-style.test.ts +0 -131
- package/src/components/flat-list/flat-list-class-style.test.ts +0 -74
- package/src/components/flat-list/flat-list-scroll-containment.test.ts +0 -107
- package/src/components/flat-list/flat-list.test.ts +0 -99
- package/src/components/image/image-class-style.test.ts +0 -46
- package/src/components/image-background-class-style.test.ts +0 -48
- package/src/components/image-background-style-class.test.ts +0 -79
- package/src/components/input-accessory-view/input-accessory-view.test.ts +0 -43
- package/src/components/keyboard-avoiding-view/keyboard-avoiding-view.test.ts +0 -54
- package/src/components/modal/modal.test.ts +0 -43
- package/src/components/pressable/pressable.test.ts +0 -85
- package/src/components/refresh-control/refresh-control.test.ts +0 -41
- package/src/components/safe-area-view/safe-area-view.test.ts +0 -43
- package/src/components/scroll-view/android-scroll-view-axis-projection.test.ts +0 -123
- package/src/components/scroll-view/content-container-style-class.test.ts +0 -75
- package/src/components/scroll-view/scroll-view-class-style.test.ts +0 -134
- package/src/components/scroll-view/scroll-view-projection.test.ts +0 -194
- package/src/components/switch/android-switch-class.test.ts +0 -42
- package/src/components/switch/switch.test.ts +0 -92
- package/src/components/text-input-class-style.test.ts +0 -54
- package/src/components/touchable/touchable.test.ts +0 -102
- package/src/components/touchable-native-feedback/touchable-native-feedback.test.ts +0 -49
- package/src/components/virtualized-list/virtualized-list-class-style.test.ts +0 -76
- package/src/components/virtualized-section-list/virtualized-section-list-class-style.test.ts +0 -60
- package/src/create-portal/create-portal.test.ts +0 -90
- package/src/create-tunnel/create-tunnel.test.ts +0 -120
- package/src/descriptor-to-angular/descriptor-outlet.test.ts +0 -94
- package/src/host-instance/host-instance.test.ts +0 -49
- package/src/modules/animated/animated-leaf-binder/animated-leaf-binder.test.ts +0 -116
- package/src/modules/animated/animated-leaf-binder.test.ts +0 -116
- package/src/modules/animated/animated-scroll-view.test.ts +0 -102
- package/src/modules/app-registry/app-registry.test.ts +0 -106
- package/src/modules/status-bar/status-bar.test.ts +0 -50
- package/src/render/render.test.ts +0 -147
- package/src/renderer/renderer.test.ts +0 -202
- package/src/services/services.test.ts +0 -163
|
@@ -1,230 +0,0 @@
|
|
|
1
|
-
var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
|
|
2
|
-
function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
|
|
3
|
-
var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
|
|
4
|
-
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
5
|
-
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
6
|
-
var _, done = false;
|
|
7
|
-
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
8
|
-
var context = {};
|
|
9
|
-
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
10
|
-
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
11
|
-
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
12
|
-
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
13
|
-
if (kind === "accessor") {
|
|
14
|
-
if (result === void 0) continue;
|
|
15
|
-
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
16
|
-
if (_ = accept(result.get)) descriptor.get = _;
|
|
17
|
-
if (_ = accept(result.set)) descriptor.set = _;
|
|
18
|
-
if (_ = accept(result.init)) initializers.unshift(_);
|
|
19
|
-
}
|
|
20
|
-
else if (_ = accept(result)) {
|
|
21
|
-
if (kind === "field") initializers.unshift(_);
|
|
22
|
-
else descriptor[key] = _;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
26
|
-
done = true;
|
|
27
|
-
};
|
|
28
|
-
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
29
|
-
var useValue = arguments.length > 2;
|
|
30
|
-
for (var i = 0; i < initializers.length; i++) {
|
|
31
|
-
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
32
|
-
}
|
|
33
|
-
return useValue ? value : void 0;
|
|
34
|
-
};
|
|
35
|
-
import { ChangeDetectorRef, Directive, ElementRef, inject, Input, Renderer2, } from '@angular/core';
|
|
36
|
-
import { flattenStyle, isSymbioteNode, } from '@symbiote-native/engine';
|
|
37
|
-
/**
|
|
38
|
-
* A composed Angular component (Pressable, SafeAreaView, ScrollView, ...) is created as a
|
|
39
|
-
* non-painting ANCHOR host (`ANCHOR_HOST_COMPONENTS` in renderer.ts) so it doesn't paint an
|
|
40
|
-
* extra native view over its own template's real content. `class="..."`/`[class.x]`/`[ngClass]`
|
|
41
|
-
* at the component's use site ALWAYS resolves through the renderer's addClass/removeClass onto
|
|
42
|
-
* that anchor — Angular gives no `@Input()` interception hook for `class` the way it does for
|
|
43
|
-
* `[style]` (which is why `style` alone was declared as an `@Input()` in the first place, see
|
|
44
|
-
* `SymbiotePrimitiveHost` above) — so the anchor ends up holding the fully-resolved class-derived
|
|
45
|
-
* style (`routeProp`'s `commitClassStyle` already wrote it to `anchor.props.style`) while the
|
|
46
|
-
* REAL native node the component's own template creates never sees it.
|
|
47
|
-
*
|
|
48
|
-
* Call this from a composed component's own `hostProps`/style getter and merge the result AHEAD
|
|
49
|
-
* of its own explicit `style` @Input, e.g. `style: [anchorHostStyle(this.elementRef),
|
|
50
|
-
* this.resolvedStyle]` — array order matters: `flattenStyle`'s later-wins collapse is what makes
|
|
51
|
-
* an explicit `[style]` on the component still beat its ambient class, mirroring the
|
|
52
|
-
* class-loses-to-explicit-style cascade `commitClassStyle` already enforces for a direct
|
|
53
|
-
* primitive. `this.elementRef` must be this component's OWN injected `ElementRef` (its anchor
|
|
54
|
-
* host), not a `@ViewChild` into its template's inner primitive.
|
|
55
|
-
*
|
|
56
|
-
* Skipping this call for a new `ANCHOR_HOST_COMPONENTS` entry compiles clean under `tsc` AND a
|
|
57
|
-
* real `ngc` AOT build — no type error, no template error — it just silently drops `class="..."`
|
|
58
|
-
* forever; only a device/simulator render (or a committed-node style assertion) catches it.
|
|
59
|
-
*/
|
|
60
|
-
export function anchorHostStyle(elementRef) {
|
|
61
|
-
const node = elementRef.nativeElement;
|
|
62
|
-
return isSymbioteNode(node) ? node.props.style : undefined;
|
|
63
|
-
}
|
|
64
|
-
// anchorHostStyle returns `unknown` (it reads whatever already resolved onto the anchor node's
|
|
65
|
-
// props bag); a style prop's fields are all optional so any object structurally satisfies it —
|
|
66
|
-
// this narrows just enough (falsy-per-IStyleProp, or an object/array) to fold it into a
|
|
67
|
-
// strictly-typed IStyleProp<T> array without an `as` cast, for a composed component whose own
|
|
68
|
-
// inner primitive declares a real `@Input() style: IStyleProp<SomeConcreteStyle>` (e.g.
|
|
69
|
-
// TouchableOpacity's Pressable, Button's TouchableOpacity) rather than the loosely-typed
|
|
70
|
-
// `symbioteHostProps` bag most composed components merge anchorHostStyle into directly.
|
|
71
|
-
function isStyleValue(value) {
|
|
72
|
-
return (value === undefined ||
|
|
73
|
-
value === null ||
|
|
74
|
-
value === false ||
|
|
75
|
-
value === '' ||
|
|
76
|
-
typeof value === 'object');
|
|
77
|
-
}
|
|
78
|
-
export function anchorStyleProp(elementRef) {
|
|
79
|
-
const value = anchorHostStyle(elementRef);
|
|
80
|
-
return isStyleValue(value) ? value : undefined;
|
|
81
|
-
}
|
|
82
|
-
function isRecord(value) {
|
|
83
|
-
return typeof value === 'object' && value !== null;
|
|
84
|
-
}
|
|
85
|
-
function shallowStyleEqual(a, b) {
|
|
86
|
-
const aKeys = Object.keys(a);
|
|
87
|
-
if (aKeys.length !== Object.keys(b).length)
|
|
88
|
-
return false;
|
|
89
|
-
return aKeys.every(key => a[key] === b[key]);
|
|
90
|
-
}
|
|
91
|
-
/**
|
|
92
|
-
* `anchorHostStyle` must be re-read on every check (a bare `class="x"` with no matching
|
|
93
|
-
* `[style]` binding never appears in Angular's `SimpleChanges`/dirty-check inputs, so nothing
|
|
94
|
-
* else signals "the anchor's class-derived style may have changed"). But `flattenStyle([...])`
|
|
95
|
-
* always allocates a FRESH object, even when its content is byte-for-byte identical to last
|
|
96
|
-
* time — and a windowed list component (FlatList/VirtualizedList/SectionList/
|
|
97
|
-
* VirtualizedSectionList) binds its resolved style into a structural-directive-bound `@Input()`
|
|
98
|
-
* chain where a fresh reference on an UNRELATED CD pass is mistaken for a real change, which
|
|
99
|
-
* reschedules ANOTHER CD tick (`VListOutletDirective`'s `context` `@Input()` calling
|
|
100
|
-
* `markForCheck()`) — free-running forever. See the `flat-list-array-style.test.ts` regression
|
|
101
|
-
* this fixes (and the near-identical `lastRecompute` dedup guard in `virtualized-list/index.ts`,
|
|
102
|
-
* which this mirrors at the style-merge call site instead of a whole recompute step). Returns
|
|
103
|
-
* `previous` unchanged when the freshly-flattened merge is shallow-equal to it, so a downstream
|
|
104
|
-
* `@Input() style` binding sees NO change and skips its own update on an unrelated tick.
|
|
105
|
-
*/
|
|
106
|
-
export function stableAnchorStyle(elementRef, explicitStyle, previous) {
|
|
107
|
-
const next = flattenStyle([anchorHostStyle(elementRef), explicitStyle]);
|
|
108
|
-
return isRecord(previous) && shallowStyleEqual(previous, next) ? previous : next;
|
|
109
|
-
}
|
|
110
|
-
const ON_PREFIX = /^on[A-Z]/;
|
|
111
|
-
/**
|
|
112
|
-
* Base for all Angular primitive host components (`symbiote-view`, `symbiote-text`, ...).
|
|
113
|
-
* RN's `StyleProp` can be an object, an array, nested arrays, falsy entries, and Animated
|
|
114
|
-
* values. Angular's raw `[style]` binding on a custom element routes through the CSS style
|
|
115
|
-
* engine (`setStyle` per key), which crashes on numeric array keys. By declaring `style` as
|
|
116
|
-
* an Angular `@Input()` on a known component, we intercept it here and forward a flattened
|
|
117
|
-
* style object through `Renderer2.setProperty`, bypassing Angular's CSS styling path.
|
|
118
|
-
*
|
|
119
|
-
* Other props (source, pointerEvents, ...) are intentionally *not* declared as inputs.
|
|
120
|
-
* Angular then treats them as host property bindings and still dispatches them through the
|
|
121
|
-
* custom renderer's `setProperty`, so the engine's `routeProp` handles them as usual.
|
|
122
|
-
*/
|
|
123
|
-
let SymbiotePrimitiveHost = (() => {
|
|
124
|
-
let _classDecorators = [Directive()];
|
|
125
|
-
let _classDescriptor;
|
|
126
|
-
let _classExtraInitializers = [];
|
|
127
|
-
let _classThis;
|
|
128
|
-
let _style_decorators;
|
|
129
|
-
let _style_initializers = [];
|
|
130
|
-
let _style_extraInitializers = [];
|
|
131
|
-
var SymbiotePrimitiveHost = class {
|
|
132
|
-
static { _classThis = this; }
|
|
133
|
-
static {
|
|
134
|
-
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
|
|
135
|
-
_style_decorators = [Input()];
|
|
136
|
-
__esDecorate(null, null, _style_decorators, { kind: "field", name: "style", static: false, private: false, access: { has: obj => "style" in obj, get: obj => obj.style, set: (obj, value) => { obj.style = value; } }, metadata: _metadata }, _style_initializers, _style_extraInitializers);
|
|
137
|
-
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
|
|
138
|
-
SymbiotePrimitiveHost = _classThis = _classDescriptor.value;
|
|
139
|
-
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
140
|
-
__runInitializers(_classThis, _classExtraInitializers);
|
|
141
|
-
}
|
|
142
|
-
renderer = inject(Renderer2);
|
|
143
|
-
elementRef = inject(ElementRef);
|
|
144
|
-
style = __runInitializers(this, _style_initializers, void 0);
|
|
145
|
-
/**
|
|
146
|
-
* The underlying engine host node (public instance). Exposed so `findNodeHandle` can resolve
|
|
147
|
-
* an Angular template ref (`#ref`) on a primitive host to its native reactTag.
|
|
148
|
-
*/
|
|
149
|
-
get nativeElement() {
|
|
150
|
-
return this.elementRef.nativeElement;
|
|
151
|
-
}
|
|
152
|
-
ngOnChanges(changes) {
|
|
153
|
-
if (!('style' in changes))
|
|
154
|
-
return;
|
|
155
|
-
const value = this.style === undefined ? undefined : flattenStyle(this.style);
|
|
156
|
-
this.renderer.setProperty(this.elementRef.nativeElement, 'style', value);
|
|
157
|
-
}
|
|
158
|
-
constructor() {
|
|
159
|
-
__runInitializers(this, _style_extraInitializers);
|
|
160
|
-
}
|
|
161
|
-
};
|
|
162
|
-
return SymbiotePrimitiveHost = _classThis;
|
|
163
|
-
})();
|
|
164
|
-
export { SymbiotePrimitiveHost };
|
|
165
|
-
/**
|
|
166
|
-
* Applies a whole resolved props record (a shared `renderX(...).props` bag) onto a host
|
|
167
|
-
* element via `Renderer2.setProperty`, one call per key. Angular templates compile bindings
|
|
168
|
-
* ahead of time — there is no `v-bind="obj"` equivalent for a custom element — so a component
|
|
169
|
-
* whose props come from a shared render function would otherwise have to declare every key as
|
|
170
|
-
* its own static `[prop]="hostProps['x']"` binding. This generalizes the pattern
|
|
171
|
-
* `SwitchHostPropsDirective` proved first: `<symbiote-x [symbioteHostProps]="hostProps" #ref="symbioteHost">`,
|
|
172
|
-
* with `ref.node` exposing the native element for any imperative follow-up call.
|
|
173
|
-
*/
|
|
174
|
-
let SymbioteHostPropsDirective = (() => {
|
|
175
|
-
let _classDecorators = [Directive({
|
|
176
|
-
selector: '[symbioteHostProps]',
|
|
177
|
-
standalone: true,
|
|
178
|
-
exportAs: 'symbioteHost',
|
|
179
|
-
inputs: ['symbioteHostProps'],
|
|
180
|
-
})];
|
|
181
|
-
let _classDescriptor;
|
|
182
|
-
let _classExtraInitializers = [];
|
|
183
|
-
let _classThis;
|
|
184
|
-
var SymbioteHostPropsDirective = class {
|
|
185
|
-
static { _classThis = this; }
|
|
186
|
-
static {
|
|
187
|
-
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
|
|
188
|
-
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
|
|
189
|
-
SymbioteHostPropsDirective = _classThis = _classDescriptor.value;
|
|
190
|
-
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
191
|
-
__runInitializers(_classThis, _classExtraInitializers);
|
|
192
|
-
}
|
|
193
|
-
renderer = inject(Renderer2);
|
|
194
|
-
elementRef = inject(ElementRef);
|
|
195
|
-
// The directive lives in its HOST component's template, so its injected ChangeDetectorRef IS
|
|
196
|
-
// that component's own view detector — the one thing that can refresh it (see wrapCallback).
|
|
197
|
-
cdr = inject(ChangeDetectorRef);
|
|
198
|
-
get node() {
|
|
199
|
-
return this.elementRef.nativeElement;
|
|
200
|
-
}
|
|
201
|
-
set symbioteHostProps(props) {
|
|
202
|
-
for (const [key, value] of Object.entries(props)) {
|
|
203
|
-
this.renderer.setProperty(this.elementRef.nativeElement, key, this.wrapCallback(key, value));
|
|
204
|
-
}
|
|
205
|
-
}
|
|
206
|
-
// A flat-bag `onX` callback (responder negotiation, onLongPress, …) is invoked by the engine's
|
|
207
|
-
// event dispatch — a plain JS call, entirely outside Angular. In Angular 20 a component compiles
|
|
208
|
-
// as a SignalView (not CheckAlways), so a plain (non-signal) state mutation inside such a callback
|
|
209
|
-
// does NOT dirty the view's reactive consumer, and the scheduler's root detectChanges() will NOT
|
|
210
|
-
// descend into it (a Global pass only refreshes CheckAlways / Dirty / RefreshView views) — the
|
|
211
|
-
// "pan does nothing" bug on a nested component. `markForCheck()` flags THIS component's view AND
|
|
212
|
-
// all its ancestors with RefreshView (which survives the descent) and notifies the CD scheduler,
|
|
213
|
-
// so the next root tick repaints the mutation. It targets the directive's injecting view
|
|
214
|
-
// (`_cdRefInjectingView`, i.e. the host component), unlike `detectChanges()` which acts on a
|
|
215
|
-
// resolved `_lView` that is NOT the host component here. The Angular twin of what React/Vue get
|
|
216
|
-
// for free (setState / proxy reactivity).
|
|
217
|
-
wrapCallback(key, value) {
|
|
218
|
-
if (!ON_PREFIX.test(key) || typeof value !== 'function')
|
|
219
|
-
return value;
|
|
220
|
-
const handler = value;
|
|
221
|
-
return (...args) => {
|
|
222
|
-
const result = handler(...args);
|
|
223
|
-
this.cdr.markForCheck();
|
|
224
|
-
return result;
|
|
225
|
-
};
|
|
226
|
-
}
|
|
227
|
-
};
|
|
228
|
-
return SymbioteHostPropsDirective = _classThis;
|
|
229
|
-
})();
|
|
230
|
-
export { SymbioteHostPropsDirective };
|
package/build/render/index.d.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { type IRootTag, type SymbioteSurface } from '@symbiote-native/engine';
|
|
2
|
-
import { type Type } from '@angular/core';
|
|
3
|
-
export interface IMountOptions {
|
|
4
|
-
initialProps?: object;
|
|
5
|
-
wrapperComponent?: Type<unknown>;
|
|
6
|
-
}
|
|
7
|
-
export declare function mount(rootTag: IRootTag, rootComponent: Type<unknown>, options?: IMountOptions): SymbioteSurface;
|
|
8
|
-
export declare function unmount(rootTag: IRootTag): void;
|
|
9
|
-
declare global {
|
|
10
|
-
var RN$stopSurface: ((surfaceId: number) => void) | undefined;
|
|
11
|
-
}
|
package/build/render/index.js
DELETED
|
@@ -1,170 +0,0 @@
|
|
|
1
|
-
// Mount an Angular app onto a Fabric surface. The native host hands us a rootTag; we
|
|
2
|
-
// create a surface and bootstrap a standalone Angular component WITHOUT platform-browser
|
|
3
|
-
// (no DOM) — createEnvironmentInjector + createComponent over @angular/core only, with our
|
|
4
|
-
// SymbioteRendererFactory provided so Angular drives the engine, which commits into
|
|
5
|
-
// nativeFabricUIManager; RN's own renderer never in the path. Angular twin of
|
|
6
|
-
// adapters/vue/src/render.ts.
|
|
7
|
-
import { createElement as createEngineElement, createSurface, disposeRoot, dlog, toPublicInstance, } from '@symbiote-native/engine';
|
|
8
|
-
import { descriptorFor } from '@symbiote-native/components';
|
|
9
|
-
import { ApplicationRef, createComponent, createEnvironmentInjector, DOCUMENT, ErrorHandler, RendererFactory2, ɵINJECTOR_SCOPE as INJECTOR_SCOPE, ɵprovideZonelessChangeDetectionInternal as provideZonelessChangeDetectionInternal, } from '@angular/core';
|
|
10
|
-
import { SymbioteRendererFactory } from '../renderer';
|
|
11
|
-
import { ColorSchemeService, WindowDimensionsService } from '../services';
|
|
12
|
-
// The two FFI-edge casts of this adapter, both confined here to bootstrap. Angular's core
|
|
13
|
-
// types model a browser: the injector parent is a non-null EnvironmentInjector, the host is
|
|
14
|
-
// a DOM Element. Our root has neither shape — a null parent IS a root injector, and the host
|
|
15
|
-
// is a SymbioteSurface (or, for a wrapped AppRegistry root, a plain engine node) the
|
|
16
|
-
// SymbioteRenderer (not the DOM) consumes. These are the sanctioned I/O-edge casts where our
|
|
17
|
-
// objects cross into Angular's web-typed API; revisit if Angular ever exposes a cast-free
|
|
18
|
-
// host. Nothing else in the adapter casts.
|
|
19
|
-
function rootInjectorParent() {
|
|
20
|
-
return null;
|
|
21
|
-
}
|
|
22
|
-
function asAngularHost(hostNode) {
|
|
23
|
-
// Angular's locateHostElement reads hostElement.tagName even when a concrete hostElement
|
|
24
|
-
// is supplied. The host container is given Angular the tiny DOM-shaped field it probes
|
|
25
|
-
// without changing the renderer target.
|
|
26
|
-
Object.defineProperty(hostNode, 'tagName', {
|
|
27
|
-
configurable: true,
|
|
28
|
-
value: 'symbiote-root',
|
|
29
|
-
});
|
|
30
|
-
return hostNode;
|
|
31
|
-
}
|
|
32
|
-
// A bare `symbiote-view` node, created directly through the engine (bypassing Angular's own
|
|
33
|
-
// createElement, which only resolves KNOWN symbiote primitives, never an arbitrary component's
|
|
34
|
-
// selector — see SymbioteRenderer.createElement). Used as the AppRegistry root's host when a
|
|
35
|
-
// wrapperComponentProvider is set: Angular has no hostElement-less bootstrap for our renderer
|
|
36
|
-
// (it would try `renderer.createElement(rootComponent.selector)`, which throws for anything
|
|
37
|
-
// that isn't one of our primitives), so the root needs an explicit host too, one we then hand
|
|
38
|
-
// to the wrapper as projectable content.
|
|
39
|
-
function createDetachedViewHost() {
|
|
40
|
-
const descriptor = descriptorFor('View');
|
|
41
|
-
return toPublicInstance(createEngineElement(descriptor.component, descriptor.isText));
|
|
42
|
-
}
|
|
43
|
-
function applyInputs(cmpRef, initialProps) {
|
|
44
|
-
if (initialProps === undefined)
|
|
45
|
-
return;
|
|
46
|
-
for (const [key, value] of Object.entries(initialProps)) {
|
|
47
|
-
cmpRef.setInput(key, value);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
// One Angular app per surface, so a surface can be torn down (unmount) or cleanly
|
|
51
|
-
// re-mounted on the same rootTag: the bridgeless host stops and restarts a surface on Fast
|
|
52
|
-
// Refresh and on lifecycle/focus changes, reusing the rootTag.
|
|
53
|
-
const apps = new Map();
|
|
54
|
-
function teardown(rootTag) {
|
|
55
|
-
const app = apps.get(rootTag);
|
|
56
|
-
if (app === undefined)
|
|
57
|
-
return;
|
|
58
|
-
app.rootRef?.destroy();
|
|
59
|
-
app.cmpRef.destroy();
|
|
60
|
-
app.injector.destroy();
|
|
61
|
-
apps.delete(rootTag);
|
|
62
|
-
disposeRoot(rootTag);
|
|
63
|
-
}
|
|
64
|
-
export function mount(rootTag, rootComponent, options) {
|
|
65
|
-
// A re-mount on a live rootTag starts clean; otherwise the stale app double-drives the surface.
|
|
66
|
-
teardown(rootTag);
|
|
67
|
-
const surface = createSurface(rootTag);
|
|
68
|
-
const injector = createEnvironmentInjector([
|
|
69
|
-
{
|
|
70
|
-
provide: RendererFactory2,
|
|
71
|
-
useValue: new SymbioteRendererFactory(surface),
|
|
72
|
-
},
|
|
73
|
-
{ provide: DOCUMENT, useValue: { head: surface, body: surface } },
|
|
74
|
-
// createEnvironmentInjector with a null parent gives this injector scope
|
|
75
|
-
// {'environment'} only (see EnvironmentNgModuleRefAdapter), so providedIn:'root'
|
|
76
|
-
// tokens — ApplicationRef included — never resolve on their own (R3Injector.get
|
|
77
|
-
// walks up looking for an injector whose `scopes` contains 'root', and a null
|
|
78
|
-
// parent means that search always dead-ends in NullInjector). platform-browser's
|
|
79
|
-
// BROWSER_MODULE_PROVIDERS solves this the same way for real DOM apps: it hands
|
|
80
|
-
// { provide: INJECTOR_SCOPE, useValue: 'root' } to its OWN app-level providers, and
|
|
81
|
-
// R3Injector's constructor reads that provider and self-tags this.scopes with
|
|
82
|
-
// 'root'. We do the same here — no PlatformRef, no DOM, just this one provider.
|
|
83
|
-
{ provide: INJECTOR_SCOPE, useValue: 'root' },
|
|
84
|
-
// Supplies the real ChangeDetectionSchedulerImpl (microtask-batched, self-scheduling
|
|
85
|
-
// via ApplicationRef.afterTick) + NoopNgZone + ZONELESS_ENABLED: true — the exact
|
|
86
|
-
// bundle internalCreateApplication() uses. With ApplicationRef reachable (see above),
|
|
87
|
-
// there is no more reason for a hand-rolled scheduler: it replaces our old
|
|
88
|
-
// unconditional `rootView.detectChanges(); cmpView.detectChanges()` (which force-ran
|
|
89
|
-
// BOTH root views on every tick regardless of cause) with Angular's own tick(), which
|
|
90
|
-
// only enters an attached view when something actually marked it (RefreshView / Dirty
|
|
91
|
-
// consumer / HasChildViewsToRefresh). NOTE: this does NOT stop the root's own template
|
|
92
|
-
// from re-running on a plain press or `ChangeDetectorRef.markForCheck()` anywhere in
|
|
93
|
-
// the tree — `markViewDirty` (which both native (event) bindings and `markForCheck()`
|
|
94
|
-
// go through, see SymbioteHostPropsDirective) unconditionally sets RefreshView on
|
|
95
|
-
// EVERY ancestor up to the root; that is fundamental, unavoidable Angular zoneless
|
|
96
|
-
// behavior, true in every Angular app, not something this swap changes. What DOES
|
|
97
|
-
// still protect a sibling branch from an unrelated press is a genuine child
|
|
98
|
-
// `@Component` boundary — SignalView-compiled children are skip-eligible regardless of
|
|
99
|
-
// this scheduler.
|
|
100
|
-
...provideZonelessChangeDetectionInternal(),
|
|
101
|
-
// Angular's own INTERNAL_APPLICATION_ERROR_HANDLER (core.mjs) reports a tick()
|
|
102
|
-
// exception by calling `injector.get(ErrorHandler)` — a normal `bootstrapApplication`
|
|
103
|
-
// registers this token by default (platform-browser's BROWSER_MODULE_PROVIDERS), but
|
|
104
|
-
// our from-scratch environment injector never did, so that lookup itself threw
|
|
105
|
-
// NG0201 and REPLACED whatever the real error was with an unrelated "No provider
|
|
106
|
-
// found for ErrorHandler" — the real exception never got logged, and the NG0201 itself
|
|
107
|
-
// propagated out of a bare Timeout callback uncaught (nothing above it in the stack to
|
|
108
|
-
// catch it), i.e. any async tick() exception, anywhere in the app, crashed hard instead
|
|
109
|
-
// of being reported. Providing the default `ErrorHandler` (same one bootstrapApplication
|
|
110
|
-
// ships) restores the intended behavior: `console.error('ERROR', e)` and keep running.
|
|
111
|
-
{ provide: ErrorHandler, useClass: ErrorHandler },
|
|
112
|
-
ColorSchemeService,
|
|
113
|
-
WindowDimensionsService,
|
|
114
|
-
], rootInjectorParent());
|
|
115
|
-
// hostElement = the surface: the component's template content commits straight into the
|
|
116
|
-
// surface with no wrapper view, the engine wrapping surface.children in its synthetic flex
|
|
117
|
-
// root — the Angular equivalent of Vue's `app.mount(surface)`.
|
|
118
|
-
let cmpRef;
|
|
119
|
-
let rootRef;
|
|
120
|
-
if (options?.wrapperComponent === undefined) {
|
|
121
|
-
cmpRef = createComponent(rootComponent, {
|
|
122
|
-
environmentInjector: injector,
|
|
123
|
-
hostElement: asAngularHost(surface),
|
|
124
|
-
});
|
|
125
|
-
applyInputs(cmpRef, options?.initialProps);
|
|
126
|
-
}
|
|
127
|
-
else {
|
|
128
|
-
// The root gets its own host node from the renderer (createComponent without a
|
|
129
|
-
// hostElement) but is not attached to the surface directly; it is handed to the
|
|
130
|
-
// wrapper as projectable content instead, so only the wrapper needs a real host.
|
|
131
|
-
const rootHost = asAngularHost(createDetachedViewHost());
|
|
132
|
-
rootRef = createComponent(rootComponent, {
|
|
133
|
-
environmentInjector: injector,
|
|
134
|
-
hostElement: rootHost,
|
|
135
|
-
});
|
|
136
|
-
applyInputs(rootRef, options.initialProps);
|
|
137
|
-
cmpRef = createComponent(options.wrapperComponent, {
|
|
138
|
-
environmentInjector: injector,
|
|
139
|
-
hostElement: asAngularHost(surface),
|
|
140
|
-
projectableNodes: [[rootHost]],
|
|
141
|
-
});
|
|
142
|
-
}
|
|
143
|
-
// Attach both root views to ApplicationRef so its own tick() (via the real
|
|
144
|
-
// ChangeDetectionSchedulerImpl provided above) drives them from here on — no manual
|
|
145
|
-
// ChangeDetectorRef juggling needed. markForCheck anywhere in the tree now notifies
|
|
146
|
-
// the real scheduler, which batches a microtask and calls appRef.tick() itself.
|
|
147
|
-
const appRef = injector.get(ApplicationRef);
|
|
148
|
-
appRef.attachView(cmpRef.hostView);
|
|
149
|
-
if (rootRef !== undefined) {
|
|
150
|
-
appRef.attachView(rootRef.hostView);
|
|
151
|
-
}
|
|
152
|
-
dlog(`angular mount root=${rootTag}`);
|
|
153
|
-
appRef.tick(); // first paint
|
|
154
|
-
surface.requestCommit();
|
|
155
|
-
apps.set(rootTag, { cmpRef, rootRef, injector });
|
|
156
|
-
return surface;
|
|
157
|
-
}
|
|
158
|
-
// Tear down a surface by rootTag: the public pair of `mount`, and the JS half of the
|
|
159
|
-
// bridgeless `RN$stopSurface` contract (see installStopSurfaceGlobal).
|
|
160
|
-
export function unmount(rootTag) {
|
|
161
|
-
dlog(`angular unmount root=${rootTag}`);
|
|
162
|
-
teardown(rootTag);
|
|
163
|
-
}
|
|
164
|
-
function installStopSurfaceGlobal() {
|
|
165
|
-
globalThis.RN$stopSurface = (surfaceId) => {
|
|
166
|
-
unmount(surfaceId);
|
|
167
|
-
};
|
|
168
|
-
dlog('installed global.RN$stopSurface');
|
|
169
|
-
}
|
|
170
|
-
installStopSurfaceGlobal();
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { SymbioteSurface, type ISymbioteNode } from '@symbiote-native/engine';
|
|
2
|
-
import type { Renderer2, RendererFactory2, RendererType2 } from '@angular/core';
|
|
3
|
-
type IHostNode = ISymbioteNode;
|
|
4
|
-
type IHostElement = ISymbioteNode | SymbioteSurface;
|
|
5
|
-
export declare function registerComposedComponent(selector: string): void;
|
|
6
|
-
export declare class SymbioteRenderer implements Renderer2 {
|
|
7
|
-
private readonly surface;
|
|
8
|
-
readonly data: Record<string, unknown>;
|
|
9
|
-
destroyNode: ((node: ISymbioteNode) => void) | null;
|
|
10
|
-
constructor(surface: SymbioteSurface);
|
|
11
|
-
destroy(): void;
|
|
12
|
-
createElement(name: string): IHostNode;
|
|
13
|
-
createComment(): IHostNode;
|
|
14
|
-
createText(value: string): IHostNode;
|
|
15
|
-
appendChild(parent: IHostElement | null, newChild: IHostNode): void;
|
|
16
|
-
insertBefore(parent: IHostElement | null, newChild: IHostNode, refChild: IHostNode | null): void;
|
|
17
|
-
removeChild(_parent: IHostElement | null, oldChild: IHostNode): void;
|
|
18
|
-
parentNode(node: IHostNode): IHostElement | null;
|
|
19
|
-
nextSibling(node: IHostNode): IHostNode | null;
|
|
20
|
-
selectRootElement(selectorOrNode: string | IHostElement): IHostElement;
|
|
21
|
-
setAttribute(el: IHostElement, name: string, value: string): void;
|
|
22
|
-
removeAttribute(el: IHostElement, name: string): void;
|
|
23
|
-
private readonly classTokens;
|
|
24
|
-
addClass(el: IHostElement, name: string): void;
|
|
25
|
-
removeClass(el: IHostElement, name: string): void;
|
|
26
|
-
setStyle(el: IHostElement, style: string, value: unknown): void;
|
|
27
|
-
removeStyle(el: IHostElement, style: string): void;
|
|
28
|
-
setProperty(el: IHostElement, name: string, value: unknown): void;
|
|
29
|
-
setValue(node: IHostNode, value: string): void;
|
|
30
|
-
listen(target: unknown, eventName: string, callback: (event: unknown) => boolean | void): () => void;
|
|
31
|
-
}
|
|
32
|
-
export declare class SymbioteRendererFactory implements RendererFactory2 {
|
|
33
|
-
private readonly surface;
|
|
34
|
-
private renderer;
|
|
35
|
-
constructor(surface: SymbioteSurface);
|
|
36
|
-
createRenderer(_hostElement: unknown, _type: RendererType2 | null): Renderer2;
|
|
37
|
-
}
|
|
38
|
-
export {};
|