SeaTalk Web App SDK

Installation

npm install @seatalk/web-app-sdk

Functions

getSSOToken(options)

Options

Property	Type	Required	Default	Description
onSuccess	(token: string) => void	true	-	Callback with the token as the first argument
onError	(code: number, message?: string, data?: any) => void		-	Callback when there's an error, refer to Error Code

Example

import { getSSOToken } from '@seatalk/web-app-sdk';

getSSOToken({
  onSuccess: (token) => {
    console.log(token);
  }
});

toast(options)

Options

Property	Type	Required	Default	Description
message	string	true	-	Text to show on toast

Example

import { toast } from '@seatalk/web-app-sdk';

toast({ message: 'Test' });

showDialog(options)

Options

Property	Type	Required	Default	Description
title	string		-	Dialog title text
message	string	true	-	Dialog body text
okText	string	true	-	Text on the primary button
cancelText	string		-	Text on the secondary button
onOk	() => void		-	Callback when user press the primary button
onCancel	() => void		-	Callback when user press the secondary button

Example

import { showDialog } from '@seatalk/web-app-sdk';

showDialog({
  title: 'Dialog Title',
  message: 'Dialog message',
  okText: 'Ok',
  cancelText: 'Cancel',
  onOk: () => {
    console.log('onOK');
  },
  onCancel: () => {
    console.log('onCancel');
  },
})

showImages(options)

Options

Property	Type	Required	Default	Description
urls	string[]	true	-	Array of image URLs, must be absolute URL
selectedIndex	number		-	Index of the selected image

Example

import { showImages } from '@seatalk/web-app-sdk';

showImages({
  urls: [
    'https://picsum.photos/600?id=0',
    'https://picsum.photos/600?id=1',
    'https://picsum.photos/600?id=2',
  ],
  selectedIndex: 2,
});

pickImages(options)

Options

Property	Type	Required	Default	Description
maxSelect	number		-	The maximum number of images allow user to select.
onSuccess	(images: { width: number; height: number; url: string }[]) => void	true	-	Callback with an array of object as the argument. If the user did not select any image, the images will be an empty array. Note: The url is internal, can be used as the src attribute of <img> elements, if you need to get the acutal content of the image, please use fetchImage(options)
onError	(code: number, message?: string, data?: any) => void		-	Callback when there's an error, refer to Error Code

Example

import { pickImages } from '@seatalk/web-app-sdk';

pickImages({
  maxSelect: 10,
  onSuccess: (images) => {
    images.forEach((image) => {
      console.log(image.width, image.height, image.url);
    });
  }
});

fetchImage(options)

Options

Property	Type	Required	Default	Description
url	string	true	-	Internal image url acquired by pickImages(options)
onSuccess	(file: Blob) => void	true	-	Callback with the image content in Blob format.
onError	(code: number, message?: string, data?: any) => void		-	Callback when there's an error, refer to Error Code

Example

import { pickImages, fetchImage } from '@seatalk/web-app-sdk';

pickImages({
  maxSelect: 1,
  onSuccess: (images) => {
    fetchImage({
      url: images[0].url,
      onSuccess: (file) => {
        console.log(file);
      }
    })
  }
});

shareAppLink

Options

Property	Type	Required	Default	Description
urlPath	string		Current webpage URL	Relative URL (relative to current webpage URL) to be shared. Note: Absolute URL (e.g. URL starts with https://) is not supported.
title	string		Title of the webpage (document.title)	The title of the shared message.
description	string		Description of the webpage (<meta name="description" />)	The description of the shared message.
icon	string		Favicon of the webpage (<link rel="icon">)	The icon image URL to be shown on the shared message. Can be both relative and absolute URL.
onSuccess	() => void		-	Callback when shared successfully.
onCancel	() => void		-	Callback when user canceled the sharing.
onError	(code: number, message?: string, data?: any) => void		-	Callback when there's an error, refer to Error Code

Example

import { shareAppLink } from '@seatalk/web-app-sdk';

shareAppLink({
  urlPath: '/post?id=1',
  title: 'Title of the post',
  description: 'Excerpt of the post content...',
  icon: 'https://picsum.photos/128',
  onSuccess: () => {
    console.log('Shared');
  },
  onCancel: () => {
    console.log('Canceled');
  }
});

Error Code

Code	Meaning
0	Success
1000	Native app internal error
1001	Invalid parameters
1002	Function not found

Error code from 1 to 999 are defined by each function.

Development

Environment setup

• npm version >= 7 (Comes with Node.js@15), in order to utilise the workspaces to support menorepo.
• Suggest to use nvm for Node.js version management, and setup the script and .nvmrc detection shell integration.