Pages In Library Support

AIMMS WebUI now introduces support for Pages in Library, a powerful feature designed to promote modular development and reuse of WebUI pages across multiple projects. This enhancement allows developers to organize and manage WebUI content within separate libraries, improving maintainability, scalability, and collaboration in larger projects. It also offers ease of maintenance—shared UI components can be updated in a single location, and by distributing the updated library version, those changes are automatically reflected in all dependent projects. This ensures consistency, reduces duplication, and minimizes maintenance overhead.

What’s New?

You can now add WebUI pages to AIMMS libraries which are already part of your AIMMS project. These library pages function just like any other page and can be referenced throughout the application—including in:

• Workflows

• Tabbed Widget

• Navigation Menu

• Side Panels

• Dialogs

• Any other supported navigation or interaction context

Note

The Support for Pages in Library feature is made available starting from WebUI Library version 25.3 as part of our experimental features. The underlying code structure is complete, the feature is stable and ready for use. We are actively seeking feedback from users to help evaluate real-world usage and refine the experience before formally promoting it to a standard, supported feature.

For details on how to enable experimental features, please refer to the Experimental Features page.

How It Works

Adding Libraries

Library integration is handled through the standard AIMMS Library Manager. For detailed steps, refer to our How-To article on Adding Libraries.

WebUI Application Manager

Once added, all libraries are listed in the Application Manager in the same order as they are arranged in the AIMMS Library Manager.

Important

Libraries marked as Read-Only will appear in the Application Manager only if they contain WebUI pages.

Adding Pages to Libraries

Adding pages to a library works similarly to adding pages in the main project. Each library entry in the Application Manager provides a context menu for adding:

• Regular pages

• Side panels

• Dialog pages

You can create any number and combination of these pages as needed. When a page is added to a library:

• A webui.json file is automatically created in the library subfolder to store WebUI-specific information.

• The page is listed in the WebUI::AllPageIds set of the AIMMSWebUI library, with its URI prefixed by the library’s namespace to ensure uniqueness across libraries.

Note

Only Grid layout pages are supported in libraries.

Pages can be rearranged within a single library using drag-and-drop. Cross-library drag-and-drop is not supported, including between the Main Project and libraries, and vice versa.

Adding Widgets to Library Pages

Widget behavior within library pages mirrors that of the main project. Widgets can be:

• Dragged and dropped within the same library.

• Cut, copied, and pasted within the same library. Cross-library operations are not supported, including between the Main Project and libraries, and vice versa.

Custom Styling of Library Pages and Widgets

With this release, WebUI enhances the DOM structure of pages by adding metadata that enables targeted styling. Each page now includes a data-library.name="{Name of the Library}" attribute, allowing styles to be scoped specifically to pages originating from a particular library.

Note

If no custom styles are applied, the default styles of the main project will apply to library pages as well.

Translation Support for Pages and Widgets in Libraries

AIMMS recommends using the WebUI::IdentifierElementText function from the AIMMSWebUI library for translations. However, .properties files are also supported and can be maintained independently within each library’s directory.

Translations are cascaded, with those defined in individual libraries taking precedence over translations in the main project.

Referencing Library Pages in the Main Project

Pages defined within a library can be referenced in the same way as native pages—whether as part of:

• Workflows

• Tabbed Widget

• Navigation Menu

• Side Panels

• Dialogs

• Any other supported navigation or interaction context

To reference a library page, use its fully qualified page URI, which includes the library namespace. These URIs are listed in the WebUI::AllPageIds set and help differentiate between similarly named pages from different libraries.

The example below illustrates how Side Panels and Dialogs from a library can be used within the Main Project. The Navigation Menu Bar also includes links to pages from multiple libraries. Similarly, pages from libraries can be integrated into other interactive components such as Workflows, Tabbed Widgets, and more.

Note

• Only identifiers that are local to the library, or have been explicitly exposed as public by other libraries, will be accessible for use within widgets and pages in a library.

• Experimental features, whether enabled or disabled, are configured at the application level and apply globally, including to all integrated libraries.

• Images used in the Image widget, Text widget, or elsewhere can only be referenced from the resources/images folder of the specific library and cannot be accessed across libraries. For example, if ‘OurFactory.jpg’ is present in the resources/images folder of Library1, it cannot be accessed in an image widget within Library2 or the Main Project. Additionally, if ‘OurFactory.jpg’ exists in the Main Project’s resources/images folder but is missing from the library’s resources/images folder, specifying ‘OurFactory.jpg’ in an image widget within the library page will not display the image, as there is no fallback to the Main Project’s resources/images folder.

• Custom page layouts created within a library are available only within that specific library.

• After making changes on the AIMMS Library Manager, please close the entire WebUI session including any open WebUI tabs or windows. Then restart WebUI to ensure the changes take effect.