Build 462 has released. It includes an exciting new interop with web components (beta) and some nice new PDF and ReportViewer features. It also includes a fix for license validation in older versions of Chrome.
As we already announced, Wijmo supports Angular version 6.0.0. We're still working on upgrading all our samples to Angular version 6 and our TypeScript version to 2.7. A future release will include those.
This build introduces a beta version of the Wijmo web components interop, which exposes Wijmo controls as web components, or more specifically as custom elements. Wijmo web components allows you to declaratively add Wijmo controls to HTML page, and manipulate them as usual DOM elements, without the use of any additional framework. Some browsers that don't fully support web components standards may require some additional polyfills.
If you're not familiar with web components, here's a good introduction to this technology.
The key aspects of the current state of the Wijmo web components implementation:
Wijmo "top-level" web components that represent Wijmo controls, like wjc-flex-grid component representing FlexGrid control, are inherited from the corresponding control classes. For example, WjcFlexGrid component class extends FlexGrid control class. This also means that the base Wijmo Control class extends the HTMLElement class when Wijmo is used in the "web components mode".
Child components that are complementary to top-level components, like wjc-flex-grid-column components that define FlexGrid columns, function as wrappers over Wijmo classes they represent. Child components are directly inherited from the HTMLElement class, and the underlying Wijmo class instance is accessible via the special control property of the component.
Wijmo class properties can be defined using attributes on the component element. When the attribute value changes, the corresponding Wijmo class property is updated accordingly. Changing the class property value doesn't entail changing of the corresponding attribute value. This probably can be changed in the future, but right now we have not decided whether it's necessary.
Wijmo components don't use Shadow DOM now. This will be addressed in future versions of the interop. One of the challenges here is that Wijmo allows deep customization of its control's parts via CSS, whereas the goal of Shadow DOM is to prevent it. There are new proposals to the Shadow DOM specification that can mitigate this limitation. We continue to keep track of the changes. For now, Wijmo web components and their parts can be customized in the same way as ordinary Wijmo controls, using global CSS.
One of the benefits of web components is that the same component can be used in different frameworks and benefit from the frameworks’ additional capabilities like attribute, property, and event bindings.
For now, we added the Web Components In Angular sample that demonstrates how to use Wijmo web components in an Angular application. Samples for other popular frameworks like React, Vue, Polymer, and others are on the way.
We have also added ES6 versions of Wijmo modules (Beta version), which you can find in the NpmImages folder of Wijmo download zip:
We will be continuing to research and develop our ES6 support this year. Feedback here is also welcome.