@grabjs/superapp-sdk 2.0.0-beta.53 → 2.0.0-beta.55
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/api-reference/api.json +11560 -47939
- package/dist/index.d.ts +462 -1846
- package/dist/index.esm.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
- package/skills/SKILL.md +87 -85
package/skills/SKILL.md
CHANGED
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: 'grabjs-superapp-sdk'
|
|
3
|
-
description: 'API reference for
|
|
3
|
+
description: 'API reference for `@grabjs/superapp-sdk`. Use when building a MiniApp that runs in the Grab SuperApp WebView and needs to call native features (camera, payments, authorization, authentication, permission, location, device storage, container UI customization) via the Grab `JSBridge`. Keywords: miniapp, webview, android, ios, jsbridge, grab, superapp.'
|
|
4
4
|
license: 'MIT'
|
|
5
5
|
---
|
|
6
6
|
|
|
7
7
|
# @grabjs/superapp-sdk
|
|
8
8
|
|
|
9
|
-
Use this SDK to call native Grab SuperApp features from a MiniApp running in the WebView. Each module covers one domain (camera, payments, location, etc.) and communicates with the native layer via JSBridge
|
|
9
|
+
Use this SDK to call native Grab SuperApp features from a MiniApp running in the WebView. Each module covers one domain (camera, payments, location, etc.) and communicates with the native layer via `JSBridge`.
|
|
10
10
|
|
|
11
11
|
## Setup
|
|
12
12
|
|
|
13
13
|
### Installation
|
|
14
14
|
|
|
15
|
+
Install `@grabjs/superapp-sdk` with your package manager of choice.
|
|
16
|
+
|
|
15
17
|
#### NPM
|
|
16
18
|
|
|
17
19
|
```bash
|
|
@@ -55,11 +57,11 @@ If you are not using a bundler, load the SDK from a CDN and access it via the `S
|
|
|
55
57
|
|
|
56
58
|
## Core Concepts
|
|
57
59
|
|
|
58
|
-
SDK methods communicate with the native Grab SuperApp via JSBridge
|
|
60
|
+
SDK methods communicate with the native Grab SuperApp layer via `JSBridge`. They only work when your page is running inside the **Grab SuperApp WebView**. Calling a method outside that environment returns `{ status_code: 501 }`.
|
|
59
61
|
|
|
60
62
|
### Response Pattern
|
|
61
63
|
|
|
62
|
-
Every SDK method returns a
|
|
64
|
+
Every SDK method returns a response object with an HTTP-style `status_code`. SDK methods never throw — use type guards instead of try/catch.
|
|
63
65
|
|
|
64
66
|
```typescript
|
|
65
67
|
import { ProfileModule, isSuccess, isError } from '@grabjs/superapp-sdk';
|
|
@@ -105,15 +107,15 @@ The SDK uses HTTP-style status codes for all responses:
|
|
|
105
107
|
|
|
106
108
|
Type guards narrow the response type so TypeScript knows which fields are available:
|
|
107
109
|
|
|
108
|
-
| Guard | Matches
|
|
109
|
-
| --------------------------------- |
|
|
110
|
-
| `isSuccess(r)` | `200`, `204`
|
|
111
|
-
| `isOk(r)` | `200`
|
|
112
|
-
| `isNoContent(r)` | `204`
|
|
113
|
-
| `isRedirection(r)` / `isFound(r)` | `302`
|
|
114
|
-
| `isClientError(r)` | `400`, `401`, `403`, `404`, `424`, `426`
|
|
115
|
-
| `isServerError(r)` | `500`, `501`
|
|
116
|
-
| `isError(r)` |
|
|
110
|
+
| Guard | Matches |
|
|
111
|
+
| --------------------------------- | ------------------------------------------------------ |
|
|
112
|
+
| `isSuccess(r)` | `200`, `204` |
|
|
113
|
+
| `isOk(r)` | `200` |
|
|
114
|
+
| `isNoContent(r)` | `204` |
|
|
115
|
+
| `isRedirection(r)` / `isFound(r)` | `302` |
|
|
116
|
+
| `isClientError(r)` | `400`, `401`, `403`, `404`, `424`, `426` |
|
|
117
|
+
| `isServerError(r)` | `500`, `501` |
|
|
118
|
+
| `isError(r)` | `400`, `401`, `403`, `404`, `424`, `426`, `500`, `501` |
|
|
117
119
|
|
|
118
120
|
```typescript
|
|
119
121
|
import { isSuccess, isOk, isNoContent, isError } from '@grabjs/superapp-sdk';
|
|
@@ -245,7 +247,7 @@ if (isError(response) && response.status_code === 403) {
|
|
|
245
247
|
|
|
246
248
|
This guide covers the recommended setup for a MiniApp entry point — loading scopes, configuring the container UI, signalling readiness, and handling permissions.
|
|
247
249
|
|
|
248
|
-
> **Note:** The [demo](https://github.com/grab/superapp-sdk/tree/master/demo) folder contains two complete MiniApp samples demonstrating these integration patterns in action — one using CDN (vanilla HTML/JS) and one using React. Both implement the same user flow: OAuth authorization, user profile display, deferred location permissions, and checkout payment.
|
|
250
|
+
> **Note:** The [`demo`](https://github.com/grab/superapp-sdk/tree/master/demo) folder contains two complete MiniApp samples demonstrating these integration patterns in action — one using CDN (vanilla HTML/JS) and one using React. Both implement the same user flow: OAuth authorization, user profile display, deferred location permissions, and checkout payment.
|
|
249
251
|
|
|
250
252
|
### Initialization
|
|
251
253
|
|
|
@@ -525,164 +527,164 @@ For the complete API reference, see [GrabPay API](https://developer.grab.com/doc
|
|
|
525
527
|
### Classes
|
|
526
528
|
|
|
527
529
|
#### `CameraModule`
|
|
528
|
-
|
|
529
|
-
- `scanQRCode(request:
|
|
530
|
+
SDK module for accessing the device camera via `JSBridge`.
|
|
531
|
+
- `scanQRCode(request: ScanQRCodeRequest): Promise<ScanQRCodeResponse>` — Opens the native camera to scan a QR code.
|
|
530
532
|
|
|
531
533
|
#### `CheckoutModule`
|
|
532
|
-
|
|
533
|
-
- `triggerCheckout(request:
|
|
534
|
+
SDK module for triggering native payment flows via `JSBridge`.
|
|
535
|
+
- `triggerCheckout(request: TriggerCheckoutRequest): Promise<TriggerCheckoutResponse>` — Triggers the native checkout flow for payment processing. (**OAuth Scope:** mobile.checkout)
|
|
534
536
|
|
|
535
537
|
#### `ContainerModule`
|
|
536
|
-
|
|
537
|
-
- `close(): Promise<
|
|
538
|
-
- `getSessionParams(): Promise<
|
|
539
|
-
- `hideBackButton(): Promise<
|
|
540
|
-
- `hideLoader(): Promise<
|
|
541
|
-
- `hideRefreshButton(): Promise<
|
|
542
|
-
- `isConnected(): Promise<
|
|
543
|
-
- `onContentLoaded(): Promise<
|
|
544
|
-
- `onCtaTap(request: string): Promise<
|
|
545
|
-
- `openExternalLink(request: string): Promise<
|
|
546
|
-
- `sendAnalyticsEvent(request:
|
|
547
|
-
- `setBackgroundColor(request: string): Promise<
|
|
548
|
-
- `setTitle(request: string): Promise<
|
|
549
|
-
- `showBackButton(): Promise<
|
|
550
|
-
- `showLoader(): Promise<
|
|
551
|
-
- `showRefreshButton(): Promise<
|
|
538
|
+
SDK module for controlling the WebView container via `JSBridge`.
|
|
539
|
+
- `close(): Promise<CloseResponse>` — Close the container and return to the previous screen.
|
|
540
|
+
- `getSessionParams(): Promise<GetSessionParamsResponse>` — Get the session parameters from the container.
|
|
541
|
+
- `hideBackButton(): Promise<HideBackButtonResponse>` — Hide the back button on the container header.
|
|
542
|
+
- `hideLoader(): Promise<HideLoaderResponse>` — Hide the full-screen loading indicator.
|
|
543
|
+
- `hideRefreshButton(): Promise<HideRefreshButtonResponse>` — Hide the refresh button on the container header.
|
|
544
|
+
- `isConnected(): Promise<IsConnectedResponse>` — Check if the web app is connected to the Grab SuperApp via `JSBridge`.
|
|
545
|
+
- `onContentLoaded(): Promise<OnContentLoadedResponse>` — Notify the Grab SuperApp that the page content has loaded.
|
|
546
|
+
- `onCtaTap(request: string): Promise<OnCtaTapResponse>` — Notify the client that the user has tapped a call-to-action (CTA).
|
|
547
|
+
- `openExternalLink(request: string): Promise<OpenExternalLinkResponse>` — Open a link in the external browser.
|
|
548
|
+
- `sendAnalyticsEvent(request: SendAnalyticsEventRequest): Promise<SendAnalyticsEventResponse>` — Use this method to track user interactions and page transitions.
|
|
549
|
+
- `setBackgroundColor(request: string): Promise<SetBackgroundColorResponse>` — Set the background color of the container header.
|
|
550
|
+
- `setTitle(request: string): Promise<SetTitleResponse>` — Set the title of the container header.
|
|
551
|
+
- `showBackButton(): Promise<ShowBackButtonResponse>` — Show the back button on the container header.
|
|
552
|
+
- `showLoader(): Promise<ShowLoaderResponse>` — Show the full-screen loading indicator.
|
|
553
|
+
- `showRefreshButton(): Promise<ShowRefreshButtonResponse>` — Show the refresh button on the container header.
|
|
552
554
|
|
|
553
555
|
#### `DeviceModule`
|
|
554
|
-
|
|
555
|
-
- `isEsimSupported(): Promise<
|
|
556
|
+
SDK module for querying native device information via `JSBridge`.
|
|
557
|
+
- `isEsimSupported(): Promise<IsEsimSupportedResponse>` — Checks whether the current device supports eSIM. (**OAuth Scope:** mobile.device | **Minimum Grab App Version:** Android: 5.402.0, iOS: 5.402.0)
|
|
556
558
|
|
|
557
559
|
#### `FileModule`
|
|
558
|
-
|
|
559
|
-
- `downloadFile(request:
|
|
560
|
+
SDK module for downloading files to the user's device via `JSBridge`.
|
|
561
|
+
- `downloadFile(request: DownloadFileRequest): Promise<DownloadFileResponse>` — Downloads a file through `JSBridge`.
|
|
560
562
|
|
|
561
563
|
#### `IdentityModule`
|
|
562
|
-
|
|
563
|
-
- `authorize(request:
|
|
564
|
+
SDK module for authenticating users with GrabID via `JSBridge`.
|
|
565
|
+
- `authorize(request: AuthorizeRequest): Promise<AuthorizeResponse>` — Initiates an OAuth2 authorization flow with PKCE (Proof Key for Code Exchange).
|
|
564
566
|
This method handles both native in-app consent and web-based fallback flows.
|
|
565
|
-
- `clearAuthorizationArtifacts(): Promise<
|
|
567
|
+
- `clearAuthorizationArtifacts(): Promise<SDKNoContentResponse>` — Clears all stored PKCE authorization artifacts from local storage.
|
|
566
568
|
This should be called after a successful token exchange or when you need to
|
|
567
569
|
reset the authorization state (e.g., on error or logout).
|
|
568
|
-
- `getAuthorizationArtifacts(): Promise<
|
|
570
|
+
- `getAuthorizationArtifacts(): Promise<GetAuthorizationArtifactsResponse>` — Retrieves stored PKCE authorization artifacts from local storage.
|
|
569
571
|
These artifacts are used to complete the OAuth2 authorization code exchange.
|
|
570
572
|
|
|
571
573
|
#### `LocaleModule`
|
|
572
|
-
|
|
573
|
-
- `getLanguageLocaleIdentifier(): Promise<
|
|
574
|
+
SDK module for accessing device locale settings via `JSBridge`.
|
|
575
|
+
- `getLanguageLocaleIdentifier(): Promise<GetLanguageLocaleIdentifierResponse>` — Retrieves the current language locale identifier from the device.
|
|
574
576
|
|
|
575
577
|
#### `LocationModule`
|
|
576
|
-
|
|
577
|
-
- `getCoordinate(): Promise<
|
|
578
|
-
- `getCountryCode(): Promise<
|
|
578
|
+
SDK module for accessing device location services via `JSBridge`.
|
|
579
|
+
- `getCoordinate(): Promise<GetCoordinateResponse>` — Get the current geographic coordinates of the device. (**OAuth Scope:** mobile.geolocation)
|
|
580
|
+
- `getCountryCode(): Promise<GetCountryCodeResponse>` — Get the country code based on the device's current location. (**OAuth Scope:** mobile.geolocation)
|
|
579
581
|
- `observeLocationChange(): ObserveLocationChangeResponse` — Subscribe to location change updates from the device. (**OAuth Scope:** mobile.geolocation)
|
|
580
582
|
|
|
581
583
|
#### `Logger`
|
|
582
584
|
Provides scoped logging for SDK modules.
|
|
583
585
|
|
|
584
586
|
#### `MediaModule`
|
|
585
|
-
|
|
587
|
+
SDK module for playing DRM-protected media content via `JSBridge`.
|
|
586
588
|
- `observePlayDRMContent(data: DRMContentConfig): ObserveDRMPlaybackResponse` — Observes DRM-protected media content playback events. (**OAuth Scope:** mobile.media)
|
|
587
|
-
- `playDRMContent(data: DRMContentConfig): Promise<
|
|
589
|
+
- `playDRMContent(data: DRMContentConfig): Promise<PlayDRMContentResponse>` — Plays DRM-protected media content in the native media player. (**OAuth Scope:** mobile.media)
|
|
588
590
|
|
|
589
591
|
#### `NetworkModule`
|
|
590
|
-
|
|
591
|
-
- `send(request:
|
|
592
|
+
SDK module for making network requests through the native layer via `JSBridge`.
|
|
593
|
+
- `send(request: SendRequest): Promise<SendResponse>` — Sends a network request through `JSBridge`.
|
|
592
594
|
|
|
593
595
|
#### `PlatformModule`
|
|
594
|
-
|
|
595
|
-
- `back(): Promise<
|
|
596
|
+
SDK module for controlling platform navigation via `JSBridge`.
|
|
597
|
+
- `back(): Promise<BackResponse>` — Triggers the native platform back navigation.
|
|
596
598
|
This navigates back in the native navigation stack.
|
|
597
599
|
|
|
598
600
|
#### `ProfileModule`
|
|
599
|
-
|
|
600
|
-
- `fetchEmail(): Promise<
|
|
601
|
-
- `verifyEmail(request?:
|
|
601
|
+
SDK module for accessing user profile information via `JSBridge`.
|
|
602
|
+
- `fetchEmail(): Promise<FetchEmailResponse>` — Fetches the user's email address from their Grab profile. (**OAuth Scope:** mobile.profile | **Minimum Grab App Version:** Android: 5.399.0, iOS: 5.399.0)
|
|
603
|
+
- `verifyEmail(request?: VerifyEmailRequest): Promise<VerifyEmailResponse>` — Verifies the user's email address by triggering email capture bottom sheet and OTP verification. (**OAuth Scope:** mobile.profile | **Minimum Grab App Version:** Android: 5.399.0, iOS: 5.399.0)
|
|
602
604
|
|
|
603
605
|
#### `ScopeModule`
|
|
604
|
-
|
|
605
|
-
- `hasAccessTo(module: string, method: string): Promise<
|
|
606
|
-
- `reloadScopes(): Promise<
|
|
606
|
+
SDK module for checking and refreshing API access permissions via `JSBridge`.
|
|
607
|
+
- `hasAccessTo(module: string, method: string): Promise<HasAccessToResponse>` — Checks if the current client has access to a specific `JSBridge` API method.
|
|
608
|
+
- `reloadScopes(): Promise<ReloadScopesResponse>` — Requests to reload the consented OAuth scopes for the current client.
|
|
607
609
|
This refreshes the permissions from the server.
|
|
608
610
|
|
|
609
611
|
#### `SplashScreenModule`
|
|
610
|
-
|
|
611
|
-
- `dismiss(): Promise<
|
|
612
|
+
SDK module for controlling the native splash / Lottie loading screen via `JSBridge`.
|
|
613
|
+
- `dismiss(): Promise<DismissSplashScreenResponse>` — Dismisses the native splash (Lottie) loading view if it is presented.
|
|
612
614
|
|
|
613
615
|
#### `StorageModule`
|
|
614
|
-
|
|
615
|
-
- `getBoolean(key: string): Promise<
|
|
616
|
-
- `getDouble(key: string): Promise<
|
|
617
|
-
- `getInt(key: string): Promise<
|
|
618
|
-
- `getString(key: string): Promise<
|
|
619
|
-
- `remove(key: string): Promise<
|
|
620
|
-
- `removeAll(): Promise<
|
|
621
|
-
- `setBoolean(key: string, value: boolean): Promise<
|
|
622
|
-
- `setDouble(key: string, value: number): Promise<
|
|
623
|
-
- `setInt(key: string, value: number): Promise<
|
|
624
|
-
- `setString(key: string, value: string): Promise<
|
|
616
|
+
SDK module for persisting key-value data to native storage via `JSBridge`.
|
|
617
|
+
- `getBoolean(key: string): Promise<GetBooleanResponse>` — Retrieves a boolean value from the native storage. (**OAuth Scope:** mobile.storage)
|
|
618
|
+
- `getDouble(key: string): Promise<GetDoubleResponse>` — Retrieves a double (floating point) value from the native storage. (**OAuth Scope:** mobile.storage)
|
|
619
|
+
- `getInt(key: string): Promise<GetIntResponse>` — Retrieves an integer value from the native storage. (**OAuth Scope:** mobile.storage)
|
|
620
|
+
- `getString(key: string): Promise<GetStringResponse>` — Retrieves a string value from the native storage. (**OAuth Scope:** mobile.storage)
|
|
621
|
+
- `remove(key: string): Promise<RemoveResponse>` — Removes a single value from the native storage by key. (**OAuth Scope:** mobile.storage)
|
|
622
|
+
- `removeAll(): Promise<RemoveAllResponse>` — Removes all values from the native storage. (**OAuth Scope:** mobile.storage)
|
|
623
|
+
- `setBoolean(key: string, value: boolean): Promise<SetBooleanResponse>` — Stores a boolean value in the native storage. (**OAuth Scope:** mobile.storage)
|
|
624
|
+
- `setDouble(key: string, value: number): Promise<SetDoubleResponse>` — Stores a double (floating point) value in the native storage. (**OAuth Scope:** mobile.storage)
|
|
625
|
+
- `setInt(key: string, value: number): Promise<SetIntResponse>` — Stores an integer value in the native storage. (**OAuth Scope:** mobile.storage)
|
|
626
|
+
- `setString(key: string, value: string): Promise<SetStringResponse>` — Stores a string value in the native storage. (**OAuth Scope:** mobile.storage)
|
|
625
627
|
|
|
626
628
|
#### `SystemWebViewKitModule`
|
|
627
|
-
|
|
628
|
-
- `redirectToSystemWebView(request:
|
|
629
|
+
SDK module for opening URLs in the device's system browser via `JSBridge`.
|
|
630
|
+
- `redirectToSystemWebView(request: RedirectToSystemWebViewRequest): Promise<RedirectToSystemWebViewResponse>` — Opens a URL in the device's system web browser or web view.
|
|
629
631
|
|
|
630
632
|
#### `UserAttributesModule`
|
|
631
|
-
|
|
632
|
-
- `getSelectedTravelDestination(): Promise<
|
|
633
|
+
SDK module for reading user-related attributes from native code via `JSBridge`.
|
|
634
|
+
- `getSelectedTravelDestination(): Promise<GetSelectedTravelDestinationResponse>` — Returns the currently selected travel destination as a lowercase ISO 3166-1 alpha-2 country code.
|
|
633
635
|
|
|
634
636
|
### Functions
|
|
635
637
|
|
|
636
638
|
#### `hasResult`
|
|
637
|
-
Type guard to check if
|
|
639
|
+
Type guard to check if an SDK response has a `result` that is neither `null` nor `undefined`.
|
|
638
640
|
```ts
|
|
639
641
|
hasResult<T>(response: T): response is Extract<T, { result: {} }>
|
|
640
642
|
```
|
|
641
643
|
|
|
642
644
|
#### `isClientError`
|
|
643
|
-
Type guard to check if
|
|
645
|
+
Type guard to check if an SDK response has a client error status code (`400`, `401`, `403`, `404`, `424`, `426`).
|
|
644
646
|
```ts
|
|
645
647
|
isClientError<T>(response: T): response is Extract<T, { status_code: 400 | 401 | 403 | 404 | 424 | 426 }>
|
|
646
648
|
```
|
|
647
649
|
|
|
648
650
|
#### `isError`
|
|
649
|
-
Type guard to check if
|
|
651
|
+
Type guard to check if an SDK response has an error status code (`400`, `401`, `403`, `404`, `424`, `426`, `500`, `501`).
|
|
650
652
|
```ts
|
|
651
653
|
isError<T>(response: T): response is Extract<T, { error: string }>
|
|
652
654
|
```
|
|
653
655
|
|
|
654
656
|
#### `isFound`
|
|
655
|
-
Type guard to check if
|
|
657
|
+
Type guard to check if an SDK response has a `302` status code.
|
|
656
658
|
```ts
|
|
657
659
|
isFound<T>(response: T): response is Extract<T, { status_code: 302 }>
|
|
658
660
|
```
|
|
659
661
|
|
|
660
662
|
#### `isNoContent`
|
|
661
|
-
Type guard to check if
|
|
663
|
+
Type guard to check if an SDK response has a `204` status code.
|
|
662
664
|
```ts
|
|
663
665
|
isNoContent<T>(response: T): response is Extract<T, { status_code: 204 }>
|
|
664
666
|
```
|
|
665
667
|
|
|
666
668
|
#### `isOk`
|
|
667
|
-
Type guard to check if
|
|
669
|
+
Type guard to check if an SDK response has a `200` status code.
|
|
668
670
|
```ts
|
|
669
671
|
isOk<T>(response: T): response is Extract<T, { status_code: 200 }>
|
|
670
672
|
```
|
|
671
673
|
|
|
672
674
|
#### `isRedirection`
|
|
673
|
-
Type guard to check if
|
|
675
|
+
Type guard to check if an SDK response has a `302` status code.
|
|
674
676
|
```ts
|
|
675
677
|
isRedirection<T>(response: T): response is Extract<T, { status_code: 302 }>
|
|
676
678
|
```
|
|
677
679
|
|
|
678
680
|
#### `isServerError`
|
|
679
|
-
Type guard to check if
|
|
681
|
+
Type guard to check if an SDK response has a server error status code (`500`, `501`).
|
|
680
682
|
```ts
|
|
681
683
|
isServerError<T>(response: T): response is Extract<T, { status_code: 500 | 501 }>
|
|
682
684
|
```
|
|
683
685
|
|
|
684
686
|
#### `isSuccess`
|
|
685
|
-
Type guard to check if
|
|
687
|
+
Type guard to check if an SDK response has a success status code (`200`, `204`).
|
|
686
688
|
```ts
|
|
687
689
|
isSuccess<T>(response: T): response is Extract<T, { status_code: 200 | 204 }>
|
|
688
690
|
```
|