Pega Marketplace Terms of Use
Pega Marketplace
Web Components SDK
A Web Component-based bridge and DX components that connect the ConstellationJS Engine to a design system based on Web Components: Lion and LitElement components.
By using or submitting listings via the Pega Marketplace, you agree to our Terms of Use.
Overview
The Web Components SDK includes a bridge and DX components that connect the Constellation JavaScript Engine to a Web Components-based design system. The SDK provides a front-end developer friendly NodeJS environment for building an application’s UI using a different design system than the Constellation design system. The alternative design system used in the Web Components SDK is based on Lion and LitElement. For more information about DX SDKs, see the Constellation SDKs documentation.
Background
Starting with 8.6, Pega Infinity™ is shipping a new technology stack which supports views instead of harnesses and sections and is authored in App studio. The technology consists of the Constellation technology stack and Cosmos design system. Constellation architecture contains the Constellation DX API, Constellation JavaScript Engine and Constellation JavaScript API. Constellation architecture combined with Cosmos is referred to as the Constellation design system. However, not all Pega customers want to use the Constellation design system user interface. Pega SDKs provide a front-end developer friendly toolset to use an alternative design system.
The Web Components SDK provides support for design systems based on web components. The included code uses Lion and LitElement components instead of the standard Cosmos design system.
The downloadable Web Components SDK Guide contains installation details and additional information.
Available Versions
| Web Components SDK | Compatible Pega Versions | Documentation |
| Version SDK-WC.87.1 | 8.8, 8.7.* | Web Components SDK 87.* Guide |
Key Features
The Web Components SDK leverages the Constellation JavaScript Engine to simplify implementation and improve quality and performance. The ConstellationJS Engine is the same acceleration layer utilized in Pega’s Constellation design system UI.
The SDK includes:
- ConstellationJS Engine to Web Components bridge
- Sample integration of the Web Components bridge with the Lion design system and LitElement
- DX components and presentation components that use the Web Components-based bridge
- MediaCo sample Infinity application
- Documentation: SDK Guide, ConstellationJS Engine overview, component building instructions, and ConstellationJS API documentation
The examples provided in the SDK allow you to run a Web Component-driven Pega Infinity application as embedded UI hosted by a customer Portal or a stand-alone-Portal. The Embedded use case is the most common use of the Web Components SDK. The Embedded use case presents a Pega flow action running inside a non-Pega web application. The Portal use case presents the Pega portal UI for a Constellation-based Pega application.
Version
Compatible with
Pega Platform 8.8 8.7.3 8.7.2 8.7.1 8.7Product Owner
John ArnoldLast updated
February 9, 2023Product Capability
User ExperienceScreenshots:
