@symbiote-native/system-ui 0.0.1 → 0.1.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 +3 -3
- package/build/angular/index.js +1 -1
- package/build/core/index.js +1 -1
- package/build/core/system-ui.js +1 -1
- package/build/react/index.js +1 -1
- package/build/vue/index.js +1 -1
- package/package.json +9 -6
- package/src/core/system-ui.test.ts +0 -62
package/README.md
CHANGED
|
@@ -90,9 +90,9 @@ export class RootComponent {
|
|
|
90
90
|
|
|
91
91
|
There's no per-instance service to `inject()` in the Angular case — both functions are plain
|
|
92
92
|
exports off the core package, called straight in the constructor or wherever the app's root is
|
|
93
|
-
set up. These snippets
|
|
94
|
-
|
|
95
|
-
|
|
93
|
+
set up. These snippets mirror the real canary demo screens —
|
|
94
|
+
`examples/expo-react/screens/SystemUiScreen.tsx`, `examples/expo-vue-sfc/screens/SystemUiScreen.vue`,
|
|
95
|
+
`examples/expo-vue-tsx/screens/SystemUiScreen.tsx`, `examples/expo-angular/src/screens/SystemUiScreen.ts`.
|
|
96
96
|
|
|
97
97
|
## API
|
|
98
98
|
|
package/build/angular/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
// @symbiote-native/system-ui/angular: the Angular entry over the framework-agnostic core.
|
|
2
2
|
// Same reasoning as the React/Vue entries — no per-instance state or event stream to wrap in a
|
|
3
3
|
// service, so this is a plain re-export.
|
|
4
|
-
export * from '../core';
|
|
4
|
+
export * from '../core/index.js';
|
package/build/core/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { getBackgroundColorAsync, setBackgroundColorAsync } from './system-ui';
|
|
1
|
+
export { getBackgroundColorAsync, setBackgroundColorAsync } from './system-ui.js';
|
package/build/core/system-ui.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Platform, processColor } from 'react-native';
|
|
2
|
-
import { expoSystemUI } from './native-module';
|
|
2
|
+
import { expoSystemUI } from './native-module.js';
|
|
3
3
|
/**
|
|
4
4
|
* Changes the root view background color. Call this outside of your component tree, e.g. in
|
|
5
5
|
* the root file, since it affects the whole app.
|
package/build/react/index.js
CHANGED
package/build/vue/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
// @symbiote-native/system-ui/vue: the Vue entry over the framework-agnostic core. Same
|
|
2
2
|
// reasoning as the React entry — no per-instance state or event stream to wire onto Vue's
|
|
3
3
|
// reactivity, so this is a plain re-export.
|
|
4
|
-
export * from '../core';
|
|
4
|
+
export * from '../core/index.js';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@symbiote-native/system-ui",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
4
4
|
"description": "expo-system-ui wrapped for SymbioteNative — one framework-agnostic core, built once and reachable from the React, Vue, and Angular adapters. Sets and reads the root view's background color.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -40,7 +40,10 @@
|
|
|
40
40
|
"src",
|
|
41
41
|
"build",
|
|
42
42
|
"build-ngc",
|
|
43
|
-
"native-link.json"
|
|
43
|
+
"native-link.json",
|
|
44
|
+
"!src/**/*.test.*",
|
|
45
|
+
"!src/**/*.spec.*",
|
|
46
|
+
"!src/**/*.detox.*"
|
|
44
47
|
],
|
|
45
48
|
"publishConfig": {
|
|
46
49
|
"access": "public"
|
|
@@ -56,7 +59,7 @@
|
|
|
56
59
|
"react": ">=19.0.0",
|
|
57
60
|
"react-native": ">=0.86",
|
|
58
61
|
"vue": ">=3.5.0",
|
|
59
|
-
"@symbiote-native/angular": "0.6.
|
|
62
|
+
"@symbiote-native/angular": "0.6.2",
|
|
60
63
|
"@symbiote-native/react": "0.2.8",
|
|
61
64
|
"@symbiote-native/vue": "0.3.8"
|
|
62
65
|
},
|
|
@@ -92,11 +95,11 @@
|
|
|
92
95
|
"@vue/runtime-core": "^3.5.13",
|
|
93
96
|
"react": "19.2.3",
|
|
94
97
|
"typescript": "~6.0.0",
|
|
95
|
-
"@symbiote-native/angular": "0.6.
|
|
98
|
+
"@symbiote-native/angular": "0.6.2",
|
|
99
|
+
"@symbiote-native/engine": "0.1.7",
|
|
96
100
|
"@symbiote-native/react": "0.2.8",
|
|
97
|
-
"@symbiote-native/vue": "0.3.8",
|
|
98
101
|
"@symbiote-native/test-utils": "0.1.6",
|
|
99
|
-
"@symbiote-native/
|
|
102
|
+
"@symbiote-native/vue": "0.3.8"
|
|
100
103
|
},
|
|
101
104
|
"scripts": {
|
|
102
105
|
"typecheck": "tsc --build",
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
import { afterEach, describe, expect, it, vi } from 'vitest';
|
|
2
|
-
|
|
3
|
-
const FAKE_NATIVE_SYSTEM_UI = {
|
|
4
|
-
setBackgroundColorAsync: vi.fn(async () => undefined),
|
|
5
|
-
getBackgroundColorAsync: vi.fn(async () => '#000000'),
|
|
6
|
-
};
|
|
7
|
-
|
|
8
|
-
// The real ExpoSystemUI native module only exists on device — resolving it via
|
|
9
|
-
// requireNativeModule() at import time would throw in this headless test run, so the
|
|
10
|
-
// module-lookup file is faked in place of expo-modules-core's runtime resolution, the same
|
|
11
|
-
// pattern packages/device/src/core/device.test.ts uses.
|
|
12
|
-
vi.mock('./native-module', () => ({
|
|
13
|
-
expoSystemUI: FAKE_NATIVE_SYSTEM_UI,
|
|
14
|
-
}));
|
|
15
|
-
|
|
16
|
-
// react-native's real Platform module reads native constants that don't exist in this headless
|
|
17
|
-
// run; processColor is stubbed to a simple, observable transform so the two branches
|
|
18
|
-
// (color == null / Platform.OS === 'web' / native processColor) are each independently provable.
|
|
19
|
-
vi.mock('react-native', () => ({
|
|
20
|
-
Platform: { OS: 'ios' },
|
|
21
|
-
processColor: vi.fn((color: string) => `processed(${color})`),
|
|
22
|
-
}));
|
|
23
|
-
|
|
24
|
-
const { getBackgroundColorAsync, setBackgroundColorAsync } = await import('./system-ui');
|
|
25
|
-
const { Platform, processColor } = await import('react-native');
|
|
26
|
-
|
|
27
|
-
afterEach(() => {
|
|
28
|
-
vi.clearAllMocks();
|
|
29
|
-
Platform.OS = 'ios';
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
describe('setBackgroundColorAsync', () => {
|
|
33
|
-
it('passes null straight through when color is null', async () => {
|
|
34
|
-
await setBackgroundColorAsync(null);
|
|
35
|
-
|
|
36
|
-
expect(processColor).not.toHaveBeenCalled();
|
|
37
|
-
expect(FAKE_NATIVE_SYSTEM_UI.setBackgroundColorAsync).toHaveBeenCalledWith(null);
|
|
38
|
-
});
|
|
39
|
-
|
|
40
|
-
it('runs a non-null color through processColor on native platforms', async () => {
|
|
41
|
-
await setBackgroundColorAsync('tomato');
|
|
42
|
-
|
|
43
|
-
expect(processColor).toHaveBeenCalledWith('tomato');
|
|
44
|
-
expect(FAKE_NATIVE_SYSTEM_UI.setBackgroundColorAsync).toHaveBeenCalledWith('processed(tomato)');
|
|
45
|
-
});
|
|
46
|
-
|
|
47
|
-
it('passes the raw color straight through on web, skipping processColor', async () => {
|
|
48
|
-
Platform.OS = 'web';
|
|
49
|
-
|
|
50
|
-
await setBackgroundColorAsync('tomato');
|
|
51
|
-
|
|
52
|
-
expect(processColor).not.toHaveBeenCalled();
|
|
53
|
-
expect(FAKE_NATIVE_SYSTEM_UI.setBackgroundColorAsync).toHaveBeenCalledWith('tomato');
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
describe('getBackgroundColorAsync', () => {
|
|
58
|
-
it('delegates to the native module', async () => {
|
|
59
|
-
await expect(getBackgroundColorAsync()).resolves.toBe('#000000');
|
|
60
|
-
expect(FAKE_NATIVE_SYSTEM_UI.getBackgroundColorAsync).toHaveBeenCalled();
|
|
61
|
-
});
|
|
62
|
-
});
|