@vaadin/vaadin-template-renderer - npm Package Compare versions

Comparing version 21.0.0-alpha0.b163d3a8c to 21.0.0-alpha1

package.json

 {
   "name": "@vaadin/vaadin-template-renderer",
-  "version": "21.0.0-alpha0.b163d3a8c",
+  "version": "21.0.0-alpha1",
   "description": "vaadin-template-renderer",
@@ -33,3 +33,3 @@ "main": "vaadin-template-renderer.js",
   },
-  "gitHead": "e1ed53b0be7b77493e3a23a076f4e47c16674dbd"
+  "gitHead": "8542c7dadc4c86e454a48613f0f2d027dcb5aa86"
 }

src/vaadin-template-renderer-templatizer.js

@@ -15,45 +15,52 @@ import { PolymerElement } from '@polymer/polymer';
 
-  static get properties() {
-    return {
-      __template: Object,
-      __TemplateClass: Object,
-      __templateInstance: Object
-    };
+  constructor() {
+    super();
+
+    this.__template = null;
+    this.__TemplateClass = null;
+    this.__templateInstances = new Set();
   }
 
-  /**
-   * @public
-   */
-  render(element) {
-    // TODO: Support creating multiple instances of the template
-    if (!this.__templateInstance) {
-      this.__createTemplateInstance();
+  render(element, properties = {}) {
+    // If the template instance exists and has been instantiated by this templatizer,
+    // it only re-renders the instance with the new properties.
+    if (this.__templateInstances.has(element.__templateInstance)) {
+      element.__templateInstance.setProperties(properties);
+      return;
+    }
 
-      element.__templateInstance = this.__templateInstance;
-      element.replaceChildren(this.__templateInstance.root);
-    }
+    // Otherwise, it instantiates a new template instance
+    // with the given properties and then renders the result to the element
+    const templateInstance = this.__createTemplateInstance(properties);
+    element.innerHTML = '';
+    element.__templateInstance = templateInstance;
+    element.appendChild(templateInstance.root);
   }
 
-  /**
-   * @private
-   */
-  __createTemplateInstance() {
-    this.__createTemplateClass();
+  __createTemplateInstance(properties) {
+    this.__createTemplateClass(properties);
 
-    this.__templateInstance = new this.__TemplateClass();
+    const instance = new this.__TemplateClass(properties);
+    this.__templateInstances.add(instance);
+    return instance;
   }
 
-  /**
-   * @private
-   */
-  __createTemplateClass() {
-    if (this.__TemplateClass) {
-      return;
-    }
+  __createTemplateClass(properties) {
+    if (this.__TemplateClass) return;
 
+    const instanceProps = Object.keys(properties).reduce((accum, key) => {
+      return { ...accum, [key]: true };
+    }, {});
+
     this.__TemplateClass = templatize(this.__template, this, {
+      // This property prevents the template instance properties
+      // from passing into the `forwardHostProp` callback
+      instanceProps,
+
+      // When changing a property of the data host component, this callback forwards
+      // the changed property to the template instances so that cause their re-rendering.
       forwardHostProp(prop, value) {
-        if (this.__templateInstance) {
-          this.__templateInstance.forwardHostProp(prop, value);
-        }
+        this.__templateInstances.forEach((instance) => {
+          instance.forwardHostProp(prop, value);
+        });
       }
@@ -60,0 +67,0 @@ });

src/vaadin-template-renderer.js

@@ -7,5 +7,5 @@ import './vaadin-template-renderer-templatizer.js';
 
-  return (root) => {
+  return (root, _owner, model) => {
     template.__templatizer = templatizer;
-    template.__templatizer.render(root);
+    template.__templatizer.render(root, model);
   };
@@ -12,0 +12,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4819

increased by21.35%

Lines of code

94

increased by4.44%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes