@ucd-lib/theme-elements 3.1.4 → 3.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ucd-lib/theme-elements",
-  "version": "3.1.4",
+  "version": "3.3.0",
   "description": "Custom elements for the UCD brand theme",
   "main": "index.js",
   "scripts": {
@@ -14,7 +14,7 @@
     "dompurify": "^2.3.9",
     "ip-cidr": "^3.0.4",
     "lit": "^3.0.2",
-    "marked": "^4.0.18",
+    "marked": "^16.1.0",
     "photoswipe": "^4.1.3",
     "slim-select": "^1.26.2"
   }

package/ucdlib/ucdlib-icons/utils.js

@@ -1,14 +1,11 @@
-import "@ucd-lib/theme-elements/ucdlib/ucdlib-iconset/ucdlib-iconset";
-import "@ucd-lib/theme-elements/ucdlib/ucdlib-icon/ucdlib-icon";
-
 import { html, render } from "lit-html";
 
 /**
  * @description Creates iconset and moves to document head
  * @param {TemplateResult} icons - SVG html string of icons
- * @param {String} name - name of iconset. 
+ * @param {String} name - name of iconset.
  * @param {Number} size  - size of icons
- * @param {String} label - Friendly name of iconset 
+ * @param {String} label - Friendly name of iconset
  */
 function renderIconSet(icons, name, size=24, label=""){
   const containerId = `ucdlib-icons--${name}`;
@@ -17,8 +14,8 @@ function renderIconSet(icons, name, size=24, label=""){
     container = document.createElement("div");
     container.style.display = "none";
     container.id = containerId;
-    document.head.appendChild(container); 
-  } 
+    document.head.appendChild(container);
+  }
   const template = html`
     <ucdlib-iconset name=${name} size=${size} label=${label}>
       ${icons}
@@ -27,4 +24,4 @@ function renderIconSet(icons, name, size=24, label=""){
   render(template, container);
 }
 
-export { renderIconSet };
+export { renderIconSet };

package/ucdlib/ucdlib-md/ucdlib-md.js

@@ -64,13 +64,15 @@ export default class UcdlibMd extends LitElement {
    * @method updated
    * @description Lit method called when element is updated.
    */
-  updated() {
+  updated(changedProperties) {
     // config markdown renderer so elements are correctly styled
     this._setRendererOverrides();
   
-    // update markdown data with the latest, either when the content changes or data property is updated
-    this.data = DOMPurify.sanitize(marked.parse(this.data));
-    this.renderedElement.innerHTML = this.data;
+    // only process markdown if the data property actually changed
+    if (changedProperties.has('data')) {
+      const parsedData = DOMPurify.sanitize(marked.parse(this.data));
+      this.renderedElement.innerHTML = parsedData;
+    }
   }
 
   /**