@symbiote-native/application 0.3.0 → 2.0.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 +97 -33
- package/package.json +27 -15
package/README.md
CHANGED
|
@@ -4,12 +4,11 @@ A wrapper package for [SymbioteNative](../../README.md) that makes
|
|
|
4
4
|
[`expo-application`](https://github.com/expo/expo/tree/main/packages/expo-application)
|
|
5
5
|
— native app version/build/name/ID, the Android ID, install-referrer and install/update-time
|
|
6
6
|
lookups, and the iOS vendor ID / release type / push-notification-service environment — usable
|
|
7
|
-
from **every** adapter, React, Vue,
|
|
7
|
+
from **every** adapter, React, Vue, Svelte, Solid, and Angular. Like
|
|
8
8
|
[`@symbiote-native/local-auth`](../local-auth) (and unlike `@symbiote-native/sensors`'s
|
|
9
9
|
`EventEmitter` + live-subscription surface), everything here is either a plain constant resolved
|
|
10
10
|
once at import time or a one-shot async call with no per-instance state, so there is no hook/
|
|
11
|
-
composable/service to wrap —
|
|
12
|
-
the same `core`.
|
|
11
|
+
composable/service to wrap — every adapter's entry point is a plain re-export of the same `core`.
|
|
13
12
|
|
|
14
13
|
## Install
|
|
15
14
|
|
|
@@ -54,16 +53,16 @@ src/core/ nativeApplicationVersion / nativeBuildVersion / applicationName /
|
|
|
54
53
|
src/angular/ @symbiote-native/application/angular — export * from '../core'
|
|
55
54
|
```
|
|
56
55
|
|
|
57
|
-
`./react`, `./vue`, and `./
|
|
58
|
-
physical per-framework file, since there's nothing to subscribe to or clean up. `./angular`
|
|
59
|
-
a physical file/subpath since Angular ships through a separate `ngc`/AOT build (`build-ngc/`).
|
|
56
|
+
`./react`, `./vue`, `./svelte`, and `./solid` are `exports`-map aliases straight onto `src/core/`
|
|
57
|
+
— no physical per-framework file, since there's nothing to subscribe to or clean up. `./angular`
|
|
58
|
+
stays a physical file/subpath since Angular ships through a separate `ngc`/AOT build (`build-ngc/`).
|
|
60
59
|
|
|
61
60
|
## Use it
|
|
62
61
|
|
|
63
62
|
```tsx
|
|
64
63
|
// React
|
|
65
64
|
import { useEffect, useState } from 'react';
|
|
66
|
-
import { Platform
|
|
65
|
+
import { Platform } from '@symbiote-native/react';
|
|
67
66
|
import {
|
|
68
67
|
applicationId,
|
|
69
68
|
applicationName,
|
|
@@ -80,17 +79,17 @@ function ApplicationScreen() {
|
|
|
80
79
|
}, []);
|
|
81
80
|
|
|
82
81
|
return (
|
|
83
|
-
<
|
|
84
|
-
<
|
|
82
|
+
<view>
|
|
83
|
+
<text>
|
|
85
84
|
{applicationName} ({applicationId})
|
|
86
|
-
</
|
|
87
|
-
<
|
|
85
|
+
</text>
|
|
86
|
+
<text>
|
|
88
87
|
v{nativeApplicationVersion} (build {nativeBuildVersion})
|
|
89
|
-
</
|
|
88
|
+
</text>
|
|
90
89
|
{Platform.OS === 'android' && installedAt && (
|
|
91
|
-
<
|
|
90
|
+
<text>Installed {installedAt.toLocaleDateString()}</text>
|
|
92
91
|
)}
|
|
93
|
-
</
|
|
92
|
+
</view>
|
|
94
93
|
);
|
|
95
94
|
}
|
|
96
95
|
```
|
|
@@ -99,7 +98,7 @@ function ApplicationScreen() {
|
|
|
99
98
|
<!-- Vue -->
|
|
100
99
|
<script setup lang="ts">
|
|
101
100
|
import { onMounted, ref } from 'vue';
|
|
102
|
-
import { Platform
|
|
101
|
+
import { Platform } from '@symbiote-native/vue';
|
|
103
102
|
import {
|
|
104
103
|
applicationId,
|
|
105
104
|
applicationName,
|
|
@@ -116,22 +115,22 @@ onMounted(() => {
|
|
|
116
115
|
</script>
|
|
117
116
|
|
|
118
117
|
<template>
|
|
119
|
-
<
|
|
120
|
-
<
|
|
121
|
-
<
|
|
122
|
-
>v{{ nativeApplicationVersion }} (build {{ nativeBuildVersion }})</
|
|
118
|
+
<view>
|
|
119
|
+
<text>{{ applicationName }} ({{ applicationId }})</text>
|
|
120
|
+
<text
|
|
121
|
+
>v{{ nativeApplicationVersion }} (build {{ nativeBuildVersion }})</text
|
|
123
122
|
>
|
|
124
|
-
<
|
|
123
|
+
<text v-if="Platform.OS === 'android' && installedAt">
|
|
125
124
|
Installed {{ installedAt?.toLocaleDateString() }}
|
|
126
|
-
</
|
|
127
|
-
</
|
|
125
|
+
</text>
|
|
126
|
+
</view>
|
|
128
127
|
</template>
|
|
129
128
|
```
|
|
130
129
|
|
|
131
130
|
```ts
|
|
132
131
|
// Angular
|
|
133
132
|
import { Component, signal } from '@angular/core';
|
|
134
|
-
import { Platform,
|
|
133
|
+
import { Platform, SYMBIOTE_ELEMENTS } from '@symbiote-native/angular';
|
|
135
134
|
import {
|
|
136
135
|
applicationId,
|
|
137
136
|
applicationName,
|
|
@@ -142,17 +141,17 @@ import {
|
|
|
142
141
|
|
|
143
142
|
@Component({
|
|
144
143
|
standalone: true,
|
|
145
|
-
imports: [
|
|
144
|
+
imports: [SYMBIOTE_ELEMENTS],
|
|
146
145
|
template: `
|
|
147
|
-
<
|
|
148
|
-
<
|
|
149
|
-
<
|
|
150
|
-
>v{{ nativeApplicationVersion }} (build {{ nativeBuildVersion }})</
|
|
146
|
+
<view>
|
|
147
|
+
<text>{{ applicationName }} ({{ applicationId }})</text>
|
|
148
|
+
<text
|
|
149
|
+
>v{{ nativeApplicationVersion }} (build {{ nativeBuildVersion }})</text
|
|
151
150
|
>
|
|
152
151
|
@if (Platform.OS === 'android' && installedAt(); as date) {
|
|
153
|
-
<
|
|
152
|
+
<text>Installed {{ date.toLocaleDateString() }}</text>
|
|
154
153
|
}
|
|
155
|
-
</
|
|
154
|
+
</view>
|
|
156
155
|
`,
|
|
157
156
|
})
|
|
158
157
|
export class ApplicationScreen {
|
|
@@ -165,10 +164,75 @@ export class ApplicationScreen {
|
|
|
165
164
|
}
|
|
166
165
|
```
|
|
167
166
|
|
|
167
|
+
```svelte
|
|
168
|
+
<!-- Svelte -->
|
|
169
|
+
<script lang="ts">
|
|
170
|
+
import { Platform } from '@symbiote-native/svelte';
|
|
171
|
+
import {
|
|
172
|
+
applicationId,
|
|
173
|
+
applicationName,
|
|
174
|
+
getInstallationTimeAsync,
|
|
175
|
+
nativeApplicationVersion,
|
|
176
|
+
nativeBuildVersion,
|
|
177
|
+
} from '@symbiote-native/application/svelte';
|
|
178
|
+
|
|
179
|
+
let installedAt = $state<Date | null>(null);
|
|
180
|
+
|
|
181
|
+
getInstallationTimeAsync().then(value => {
|
|
182
|
+
installedAt = value;
|
|
183
|
+
});
|
|
184
|
+
</script>
|
|
185
|
+
|
|
186
|
+
<view>
|
|
187
|
+
<text>{applicationName} ({applicationId})</text>
|
|
188
|
+
<text>v{nativeApplicationVersion} (build {nativeBuildVersion})</text>
|
|
189
|
+
{#if Platform.OS === 'android' && installedAt !== null}
|
|
190
|
+
<text>Installed {installedAt.toLocaleDateString()}</text>
|
|
191
|
+
{/if}
|
|
192
|
+
</view>
|
|
193
|
+
```
|
|
194
|
+
|
|
195
|
+
```tsx
|
|
196
|
+
// Solid
|
|
197
|
+
import { createSignal } from 'solid-js';
|
|
198
|
+
import { Platform } from '@symbiote-native/solid';
|
|
199
|
+
import {
|
|
200
|
+
applicationId,
|
|
201
|
+
applicationName,
|
|
202
|
+
getInstallationTimeAsync,
|
|
203
|
+
nativeApplicationVersion,
|
|
204
|
+
nativeBuildVersion,
|
|
205
|
+
} from '@symbiote-native/application/solid';
|
|
206
|
+
|
|
207
|
+
function ApplicationScreen() {
|
|
208
|
+
const [installedAt, setInstalledAt] = createSignal<Date | null>(null);
|
|
209
|
+
|
|
210
|
+
getInstallationTimeAsync().then(setInstalledAt);
|
|
211
|
+
|
|
212
|
+
return (
|
|
213
|
+
<view>
|
|
214
|
+
<text>
|
|
215
|
+
{applicationName} ({applicationId})
|
|
216
|
+
</text>
|
|
217
|
+
<text>
|
|
218
|
+
v{nativeApplicationVersion} (build {nativeBuildVersion})
|
|
219
|
+
</text>
|
|
220
|
+
{Platform.OS === 'android' && installedAt() !== null && (
|
|
221
|
+
<text>Installed {installedAt()!.toLocaleDateString()}</text>
|
|
222
|
+
)}
|
|
223
|
+
</view>
|
|
224
|
+
);
|
|
225
|
+
}
|
|
226
|
+
```
|
|
227
|
+
|
|
168
228
|
There's no per-instance service to `inject()` in the Angular case — every function is a plain
|
|
169
|
-
free function off the core package, called straight from the constructor
|
|
170
|
-
mirror the real canary demo screens —
|
|
171
|
-
`examples/expo-
|
|
229
|
+
free function off the core package, called straight from the constructor (or, on Solid, straight
|
|
230
|
+
from the component body). All five examples mirror the real canary demo screens —
|
|
231
|
+
`examples/expo-react/screens/ApplicationScreen.tsx`,
|
|
232
|
+
`examples/expo-vue-sfc/screens/ApplicationScreen.vue`,
|
|
233
|
+
`examples/expo-vue-tsx/screens/ApplicationScreen.tsx`,
|
|
234
|
+
`examples/expo-svelte/screens/ApplicationScreen.svelte`,
|
|
235
|
+
`examples/expo-solid/screens/ApplicationScreen.tsx`,
|
|
172
236
|
`examples/expo-angular/src/screens/ApplicationScreen.ts`.
|
|
173
237
|
|
|
174
238
|
## API
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@symbiote-native/application",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "expo-application wrapped for SymbioteNative — one framework-agnostic core, built once and reachable from the React, Vue, Svelte, Solid, and Angular adapters. Native app version/build/name/ID constants, the Android ID, install-referrer and install/update-time lookups, and the iOS vendor ID, release type, and push-notification-service environment.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -13,6 +13,18 @@
|
|
|
13
13
|
"url": "https://github.com/OneEyed1366/symbiote-native/issues"
|
|
14
14
|
},
|
|
15
15
|
"author": "Andrey Prokopenko <psevdoproger@gmail.com>",
|
|
16
|
+
"keywords": [
|
|
17
|
+
"react-native",
|
|
18
|
+
"symbiote-native",
|
|
19
|
+
"expo-application",
|
|
20
|
+
"react",
|
|
21
|
+
"vue",
|
|
22
|
+
"svelte",
|
|
23
|
+
"solid",
|
|
24
|
+
"angular",
|
|
25
|
+
"app-version",
|
|
26
|
+
"android-id"
|
|
27
|
+
],
|
|
16
28
|
"type": "module",
|
|
17
29
|
"main": "./build/core/index.js",
|
|
18
30
|
"module": "./build/core/index.js",
|
|
@@ -61,19 +73,19 @@
|
|
|
61
73
|
"expo-modules-core": "57.0.5"
|
|
62
74
|
},
|
|
63
75
|
"peerDependencies": {
|
|
64
|
-
"@symbiote-native/angular": ">=0.6.2",
|
|
65
|
-
"@symbiote-native/engine": ">=0.1.7",
|
|
66
|
-
"@symbiote-native/react": ">=0.2.8",
|
|
67
|
-
"@symbiote-native/solid": ">=0.0.1",
|
|
68
|
-
"@symbiote-native/svelte": ">=0.1.0",
|
|
69
|
-
"@symbiote-native/vue": ">=0.3.8",
|
|
70
76
|
"@angular/core": ">=20",
|
|
71
77
|
"@vue/runtime-core": "^3.5.13",
|
|
72
78
|
"react": ">=19.0.0",
|
|
73
79
|
"react-native": ">=0.86",
|
|
74
80
|
"solid-js": ">=1.9.0",
|
|
75
81
|
"svelte": ">=5.56.0",
|
|
76
|
-
"vue": ">=3.5.0"
|
|
82
|
+
"vue": ">=3.5.0",
|
|
83
|
+
"@symbiote-native/angular": "^2.0.0",
|
|
84
|
+
"@symbiote-native/engine": "^0.5.0",
|
|
85
|
+
"@symbiote-native/react": "^2.0.0",
|
|
86
|
+
"@symbiote-native/solid": "^2.0.0",
|
|
87
|
+
"@symbiote-native/svelte": "^2.0.0",
|
|
88
|
+
"@symbiote-native/vue": "^2.0.0"
|
|
77
89
|
},
|
|
78
90
|
"peerDependenciesMeta": {
|
|
79
91
|
"@symbiote-native/angular": {
|
|
@@ -121,13 +133,13 @@
|
|
|
121
133
|
"solid-js": "^1.9.14",
|
|
122
134
|
"svelte": "^5.56.0",
|
|
123
135
|
"typescript": "~6.0.0",
|
|
124
|
-
"@symbiote-native/angular": "0.
|
|
125
|
-
"@symbiote-native/engine": "0.
|
|
126
|
-
"@symbiote-native/react": "0.
|
|
127
|
-
"@symbiote-native/solid": "0.
|
|
128
|
-
"@symbiote-native/svelte": "0.
|
|
129
|
-
"@symbiote-native/test-utils": "0.
|
|
130
|
-
"@symbiote-native/vue": "0.
|
|
136
|
+
"@symbiote-native/angular": "2.0.0",
|
|
137
|
+
"@symbiote-native/engine": "0.5.0",
|
|
138
|
+
"@symbiote-native/react": "2.0.0",
|
|
139
|
+
"@symbiote-native/solid": "2.0.0",
|
|
140
|
+
"@symbiote-native/svelte": "2.0.0",
|
|
141
|
+
"@symbiote-native/test-utils": "0.3.0",
|
|
142
|
+
"@symbiote-native/vue": "2.0.0"
|
|
131
143
|
},
|
|
132
144
|
"scripts": {
|
|
133
145
|
"typecheck": "tsc --build",
|