Host Configuration
Configure Nebula host runtime behavior with NebulaAPI.wrap, including host APIs, loading UI, and server base URL.
Host configuration is centered around NebulaAPI.wrap(...).
This is the host-side entry point that applies Nebula runtime defaults before your host app renders. In practice, most host projects use it to configure:
- which Host APIs are exposed to miniapps
- how the loading experience is rendered
- how installation and remote bundle URLs are resolved
Basic shape
import { NebulaAPI } from '@nebula-rn/sdk';
export default NebulaAPI.wrap({
hostApis: [],
serverBaseURL: 'https://api.example.com',
})(App);The current public host configuration surface is:
type NebulaHostOptions = {
hostApis?: NebulaHostFeature[];
miniappLoading?: {
component: React.ComponentType<MiniappLoadingProps>;
delayMs?: number;
enterContentDelayMs?: number;
resolveProps?: (
context: MiniappLoadingResolveContext,
) => MiniappLoadingResolvedProps;
};
serverBaseURL?: string | null;
};Initialization flow
When the wrapped host app mounts, NebulaAPI.wrap() initializes Nebula in roughly this order:
- Configure host-owned miniapp loading behavior
- Start the host-side API server
- Register all configured host features
- Apply host runtime defaults such as
serverBaseURL - Subscribe to miniapp lifecycle events and clean up when the host unmounts
hostApis
hostApis defines the Host API surface available to miniapps.
Only APIs registered here can be called from the miniapp runtime. This makes hostApis the main capability boundary between host and miniapp.
import { NebulaAPI } from '@nebula-rn/sdk';
import { defaultHostApis } from '@nebula-rn/host-apis';
export default NebulaAPI.wrap({
hostApis: defaultHostApis,
})(App);Typical usage
- Use
defaultHostApiswhen you want Nebula’s standard host API set - Add custom Host APIs for business capabilities
- Omit APIs you do not want miniapps to access
Guidance
- Treat
hostApisas a reviewed contract, not as a convenience list - Do not expose APIs that the host has not audited
- Prefer explicit registration over broad or implicit capability exposure
miniappLoading
miniappLoading configures the host-side loading experience shown while a miniapp is installing or opening.
NebulaAPI.wrap({
miniappLoading: {
component: DefaultMiniappLoadingScreen,
delayMs: 5000,
enterContentDelayMs: 240,
resolveProps: ({ appId, installedInfo }) => ({
title: appId,
extraData: {
subtitle: installedInfo?.version
? `Version ${installedInfo.version}`
: 'Preparing runtime',
},
}),
},
})(App);miniappLoading.component
The React component rendered by the host while the miniapp is in a loading state.
This component receives MiniappLoadingProps:
type MiniappLoadingProps = {
appId: string;
mode: 'development' | 'production';
status: 'installing' | 'loading' | 'ready' | 'error';
title?: string | null;
icon?: ReactNode;
extraData?: Record<string, unknown> | null;
errorMessage?: string | null;
};Use it when you want:
- branded loading UI
- install / open progress messaging
- production-mode error or retry affordances
miniappLoading.delayMs
Controls how long the host keeps the loading UI visible before auto-hiding it after the miniapp reports readiness.
- Type:
number - Default:
0
Use it when the host needs a slightly slower transition to avoid abrupt visual changes.
For the full loading lifecycle and where this delay applies, see Miniapp Loading Screen.
miniappLoading.enterContentDelayMs
Adds a delay before the miniapp content is visually entered after the loading view is ready to leave.
- Type:
number - Default:
0
This is useful when you need a more deliberate transition between the host loading shell and the mounted miniapp content.
For the full loading lifecycle and where this delay applies, see Miniapp Loading Screen.
miniappLoading.resolveProps
Allows the host to derive display-only loading props from runtime context.
resolveProps: ({ appId, status, installedInfo }) => ({
title: appId === 'checkout' ? 'Checkout' : appId,
extraData: {
subtitle:
status === 'installing'
? 'Installing bundle'
: installedInfo?.version
? `Version ${installedInfo.version}`
: 'Loading',
},
});It receives:
type MiniappLoadingResolveContext = {
appId: string;
mode: 'development' | 'production';
status: 'installing' | 'loading' | 'ready' | 'error';
title?: string | null;
icon?: ReactNode;
extraData?: Record<string, unknown> | null;
errorMessage?: string | null;
installedInfo?: InstalledMiniAppInfo | null;
};It returns a partial override of:
titleiconextraData
Guidance
- Use
miniappLoadingonly for host-owned presentation - Do not treat it as a channel for miniapp business props
- Keep it focused on status communication, not business workflow
serverBaseURL
serverBaseURL defines the host-owned base URL used when Nebula needs to resolve remote installation or asset URLs.
In a standard Nebula deployment, this value usually points to your Nebula Cloud service endpoint.
NebulaAPI.wrap({
serverBaseURL: 'https://api.example.com',
hostApis: defaultHostApis,
})(App);Complete example
import { NebulaAPI } from '@nebula-rn/sdk';
import { defaultHostApis } from '@nebula-rn/host-apis';
export default NebulaAPI.wrap({
hostApis: defaultHostApis,
miniappLoading: {
component: DefaultMiniappLoadingScreen,
delayMs: 5000,
enterContentDelayMs: 240,
resolveProps: ({ appId, installedInfo }) => ({
title: appId,
extraData: {
subtitle: installedInfo?.version
? `Version ${installedInfo.version}`
: 'Preparing production runtime',
},
}),
},
serverBaseURL: 'https://api.example.com',
})(App);Runtime updates
Some host configuration can also be adjusted at runtime through the SDK, for example:
NebulaAPI.setServerBaseURL(...)NebulaAPI.setMiniappLoadingDelay(...)NebulaAPI.setMiniappLoadingEnterContentDelay(...)
Use runtime setters when the value must change after app startup.
Use NebulaAPI.wrap(...) when the value is part of the host’s default runtime configuration.
What is not configured here
Host Configuration covers host-owned runtime defaults. It does not cover:
- miniapp page configuration such as
app.jsonorpage.config.ts - miniapp update policy declared in a miniapp manifest
- platform-native setup such as iOS entitlements, Android permissions, or deep link files
For those topics, continue with: