@symbiote-native/components 0.1.1 → 0.2.0
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 +8 -0
- package/build/bootstrap.d.ts +9 -0
- package/build/bootstrap.js +43 -0
- package/package.json +11 -1
package/README.md
CHANGED
|
@@ -33,6 +33,14 @@ supplies only the third:
|
|
|
33
33
|
`Switch` is the canonical reference for a full three-layer component; `ActivityIndicator` is the
|
|
34
34
|
canonical render-only reference (no state machine needed).
|
|
35
35
|
|
|
36
|
+
### Install
|
|
37
|
+
|
|
38
|
+
Nearly every consumer gets this transitively, through an adapter. Building a new adapter yourself:
|
|
39
|
+
|
|
40
|
+
```bash
|
|
41
|
+
npm install @symbiote-native/components
|
|
42
|
+
```
|
|
43
|
+
|
|
36
44
|
---
|
|
37
45
|
|
|
38
46
|
## Usage
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type IColorValue, type IDeviceEventSource, type INativeViewConfigSource } from '@symbiote-native/engine';
|
|
2
|
+
export type IBootstrapHostOptions = {
|
|
3
|
+
colorProcessor?: (value: IColorValue) => unknown;
|
|
4
|
+
imageSourceResolver?: (source: unknown) => unknown;
|
|
5
|
+
deviceEventSource?: IDeviceEventSource;
|
|
6
|
+
nativeViewConfigSource?: INativeViewConfigSource;
|
|
7
|
+
debug?: boolean;
|
|
8
|
+
};
|
|
9
|
+
export declare function bootstrapHost(options?: IBootstrapHostOptions): void;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
// Zero-config host bootstrap for @symbiote-native/components' four RN-backed seams
|
|
2
|
+
// (colorProcessor, imageSourceResolver, deviceEventSource, nativeViewConfigSource), wired from
|
|
3
|
+
// real react-native in one call — collapses what every canary example currently hand-wires at
|
|
4
|
+
// startup. Lives OUTSIDE the package's main barrel (see package.json's separate "./bootstrap"
|
|
5
|
+
// export): react-native's own source is Flow syntax Vitest's transform can't parse, so anything
|
|
6
|
+
// importing it directly must stay unreachable from the tested main index.ts.
|
|
7
|
+
import { processColor, DeviceEventEmitter, Image } from 'react-native';
|
|
8
|
+
import { setColorProcessor, setDeviceEventSource, setNativeViewConfigSource, } from '@symbiote-native/engine';
|
|
9
|
+
import { setImageSourceResolver } from './view/render-image';
|
|
10
|
+
// @ts-expect-error react-native ships no types for this internal path (plain .js) — the
|
|
11
|
+
// try/catch below is what actually proves the shape, not TS.
|
|
12
|
+
import * as ReactNativeViewConfigRegistry from 'react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry';
|
|
13
|
+
// Third-party Fabric views derive their events + prop processors from RN's own ViewConfig
|
|
14
|
+
// registry; `get` throws for an unregistered name, so undefined is the right answer for
|
|
15
|
+
// anything the registry doesn't know (our built-ins never reach here).
|
|
16
|
+
function defaultNativeViewConfigSource(name) {
|
|
17
|
+
try {
|
|
18
|
+
return ReactNativeViewConfigRegistry.get(name);
|
|
19
|
+
}
|
|
20
|
+
catch {
|
|
21
|
+
return undefined;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
// require('./x.png') asset ids and {uri} sources are resolved by RN's own resolver before they
|
|
25
|
+
// reach the shared render fns. `source` is untyped at the setImageSourceResolver seam by design
|
|
26
|
+
// (any component's resolved shape flows through it) — this is the I/O edge where it crosses
|
|
27
|
+
// into RN's own typed Image API.
|
|
28
|
+
function defaultImageSourceResolver(source) {
|
|
29
|
+
return Image.resolveAssetSource(source);
|
|
30
|
+
}
|
|
31
|
+
// IColorValue is our own structural mirror of the runtime shapes RN's processColor accepts
|
|
32
|
+
// (CSS string / PlatformColor / DynamicColorIOS); RN's own ColorValue type is opaque, not
|
|
33
|
+
// structurally identical, so this is the I/O edge between the two color representations.
|
|
34
|
+
function defaultColorProcessor(value) {
|
|
35
|
+
return processColor(value);
|
|
36
|
+
}
|
|
37
|
+
export function bootstrapHost(options = {}) {
|
|
38
|
+
globalThis.__SYMBIOTE_DEBUG__ = options.debug ?? process.env.DEBUG === '1';
|
|
39
|
+
setColorProcessor(options.colorProcessor ?? defaultColorProcessor);
|
|
40
|
+
setImageSourceResolver(options.imageSourceResolver ?? defaultImageSourceResolver);
|
|
41
|
+
setDeviceEventSource(options.deviceEventSource ?? DeviceEventEmitter);
|
|
42
|
+
setNativeViewConfigSource(options.nativeViewConfigSource ?? defaultNativeViewConfigSource);
|
|
43
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@symbiote-native/components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Framework-agnostic component logic (state machines + render functions) for SymbioteNative — written once, inherited by every adapter (React, Vue, Angular, ...).",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -20,6 +20,10 @@
|
|
|
20
20
|
".": {
|
|
21
21
|
"types": "./build/index.d.ts",
|
|
22
22
|
"default": "./build/index.js"
|
|
23
|
+
},
|
|
24
|
+
"./bootstrap": {
|
|
25
|
+
"types": "./build/bootstrap.d.ts",
|
|
26
|
+
"default": "./build/bootstrap.js"
|
|
23
27
|
}
|
|
24
28
|
},
|
|
25
29
|
"files": [
|
|
@@ -31,6 +35,12 @@
|
|
|
31
35
|
"dependencies": {
|
|
32
36
|
"@symbiote-native/engine": "0.1.1"
|
|
33
37
|
},
|
|
38
|
+
"peerDependencies": {
|
|
39
|
+
"react-native": ">=0.86"
|
|
40
|
+
},
|
|
41
|
+
"devDependencies": {
|
|
42
|
+
"@types/node": "^26.0.0"
|
|
43
|
+
},
|
|
34
44
|
"scripts": {
|
|
35
45
|
"typecheck": "tsc --build",
|
|
36
46
|
"format": "prettier --write \"src/**/*.{ts,tsx}\""
|