Web Mini Program Runtime Library

We provide a runtime library for Web Mini Programs that can conveniently call some methods.

You can install through package management tools:

npm

npm install @agilebot/extension-runtime

yarn

yarn add @agilebot/extension-runtime

pnpm

pnpm add @agilebot/extension-runtime

You can also reference directly in the browser:

<script src="https://unpkg.com/@agilebot/extension-runtime/dist/browser.js"></script>

When you use the <script> tag to directly import the runtime library in the browser, all exported methods will be mounted on the global namespace gbtExtension .

For example, if you need to get the current language, you don't need to use import, but can directly call:

<script>
  gbtExtension.getLanguage().then(function (lang) {
    console.log(`Current language is: ${lang}`);
  });
</script>

Multi-language

When a Web Mini Program is opened in AgileLink, it needs to get the current language of the App and then switch the user's Web Mini Program language to be consistent with the App. This functionality can be implemented in the following way.

Example code:

import { getLanguage } from '@agilebot/extension-runtime';

const currentLang = await getLanguage();
console.log(`Current language: ${currentLang}`);

Enable Shortcuts

When the extension's Web page is opened, some shortcuts will be disabled, such as physical buttons on industrial teaching pendants. You can enable shortcuts in the following way:

import { enableShortcut } from '@agilebot/extension-runtime';

enableShortcut();

DANGER

If this method is not called, it may lead to the following consequences:

• After the industrial teaching pendant screen locks, the screen cannot be awakened through physical buttons
• You can only force shutdown and restart by pressing and holding the teaching pendant power button for more than 15 seconds

Display Components like Popups

To maintain a consistent style with AgileLink, we provide some common functions for displaying notification messages and popups.

import { rtmNotification, rtmMessageBox } from '@agilebot/extension-runtime';

// Show info notification
rtmNotification.info('This is an info message');
// Show error notification
rtmNotification.error('This is an error message');
// Show success notification
rtmNotification.success('Operation successful');
// Show warning notification
rtmNotification.warning('This is a warning message');

// Show confirmation dialog
rtmMessageBox
  .confirm('Are you sure you want to delete?')
  .then(() => {
    console.log('User confirmed the operation');
  })
  .catch(() => {
    console.log('User cancelled the operation');
  });

Get Extension Status

You can get the current status of an extension in the following way:

import { getExtensionState } from '@agilebot/extension-runtime';

const extension = await getExtensionState('myService');
console.log(`Extension enabled: ${extension.enabled}, Port: ${extension.port}`);

Whether in Extension Environment

When debugging Web pages locally, you can determine whether currently running in the extension environment or local computer:

import { isInExtension } from '@agilebot/extension-runtime';

console.log(`Currently in extension environment: ${isInExtension()}`);