This repository can be used as a starting point for developing custom widgets for UiPath Assistant using Angular 9. The project is an Angular library that contains the implementation of a sample widget that interacts with UiPath processes and saves its configuration in a local file.
Developing your widget
npm i. For npm 7 or higher, use the
npm run watch. This will rebuild the widget every time a project file is saved.
- Find the
UiPathAssistantfolder in your UiPath
- Close the Assistant if it is opened.
- Provide the path to your widget
.jsoutput to Assistant by running
UiPath.Assistant.exe --debug --dev-widget=C:\Users\...\Desktop\assistant-plugin-creator\dist\sample-widget\bundles\sample-widget.umd.js; The path may not contain spaces).
- You should see a new Assistant red tab that hosts your main widget component. The tab is always visible in dev mode, even if enabling
- You may open dev tools via
- By default, the Assistant will read the sibling
sample-widget.umd.js.mapsource map file and allow typescript debugging.
@uipath/widget.sdk exports reusable components and the APIs (such as
RobotService) for interacting with UiPath Assistant. You may use
ApiService to get access to Orchestrator. Do not import from
@uipath/agent.sdk, as it exposes unstable APIs.
When creating widgets at runtime, UiPath Assistant, is looking for a
MainComponent that is exported by a
MainModule (for each widget). Make sure you add them to
projects\sample-widget\src\public-api.ts. You may also expose metadata about the widget (such as title, description and icon for its tab in Assistant) via the functions or constants found in
To force a package into the final bundle, add it to the
bundledDependencies array in
projects/sample-widget/package.json. If you get the error
<module>, required by <widget> was not found when the widget is loading, you probably forgot to do this.
You may want to use
WidgetAppState.theme$ if you need to react to those changes.
Starting with Assistant 21.4.x, i18n is supported via ngx-translate.
WidgetTranslationPipe can be used to translate the keys found in
projects/sample-widge/src/lib/i18n. The fallback language is
Building a widget
ng build --prod
- The output is
dist\sample-widget\bundles\sample-widget.umd.js(or the minified version)
- Rename the output file. Each unpacked widget is uniquely identified by the file name.
Packing a widget
Assistant widgets can be bundled into nuget packges that can be published to nuget feeds and then installed into Assistant. To bundle a widget, simply build the widget, write the appropriate metadata to the
widget.nuspec file and run
npm run pack. If not running on Windows, you need a .NET compiler (such as Mono) to run nuget.exe.
Installing/updating a widget
Widgets can be installed locally by a simple drag and drop of the output (
sample-widget.umd.js) onto the main window of a running UiPath Assistant. Widgets are saved to
The changelog for
@uipath/widget.sdk can be found here.
You can use the contents of this repository/package subject to your license agreement with UiPath for the UiPath Platform.