@ulb-darmstadt/shacl-form 1.10.1 → 1.10.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ulb-darmstadt/shacl-form",
-    "version": "1.10.1",
+    "version": "1.10.2",
     "description": "SHACL form generator",
     "main": "dist/form-default.js",
     "module": "dist/form-default.js",

package/src/form.ts

@@ -44,6 +44,8 @@ export class ShaclForm extends HTMLElement {
     private initialize() {
         clearTimeout(this.initDebounceTimeout)
         this.initDebounceTimeout = setTimeout(async () => {
+            // set loading attribute on element so that hosting app can apply special css rules
+            this.setAttribute('loading', '')
             // remove all child elements from form and show loading indicator
             this.form.replaceChildren(document.createTextNode(this.config.attributes.loading))
             try {
@@ -116,6 +118,7 @@ export class ShaclForm extends HTMLElement {
                 errorDisplay.innerText = String(e)
                 this.form.replaceChildren(errorDisplay)
             }
+            this.removeAttribute('loading')
         }, 200)
     }
 

package/src/property-template.ts

@@ -115,17 +115,15 @@ export class ShaclPropertyTemplate {
         if (!this.label && !this.shaclAnd) {
             this.label = this.path ? removePrefixes(this.path, this.config.prefixes) : 'unknown'
         }
-        // resolve extended shapes
-        if (this.node || this.shaclAnd) {
-            if (this.node) {
-                this.extendedShapes.push(this.node)
-            }
-            if (this.shaclAnd) {
-                const list = this.config.lists[this.shaclAnd]
-                if (list?.length) {
-                    for (const node of list) {
-                        this.extendedShapes.push(node as NamedNode)
-                    }
+        // register extended shapes
+        if (this.node) {
+            this.extendedShapes.push(this.node)
+        }
+        if (this.shaclAnd) {
+            const list = this.config.lists[this.shaclAnd]
+            if (list?.length) {
+                for (const node of list) {
+                    this.extendedShapes.push(node as NamedNode)
                 }
             }
         }

package/src/property.ts

@@ -19,14 +19,13 @@ export class ShaclProperty extends HTMLElement {
     constructor(shaclSubject: BlankNode | NamedNode, parent: ShaclNode, config: Config, valueSubject?: NamedNode | BlankNode) {
         super()
         this.template = new ShaclPropertyTemplate(config.store.getQuads(shaclSubject, null, null, null), parent, config)
+        this.container = this
         if (this.template.extendedShapes.length && this.template.config.attributes.collapse !== null && (!this.template.maxCount || this.template.maxCount > 1)) {
             const collapsible = new RokitCollapsible()
             collapsible.classList.add('collapsible', 'shacl-group');
             collapsible.open = config.attributes.collapse === 'open';
             collapsible.label = this.template.label;
             this.container = collapsible
-        } else {
-            this.container = this
         }
 
         if (this.template.order !== undefined) {
@@ -35,7 +34,6 @@ export class ShaclProperty extends HTMLElement {
         if (this.template.cssClass) {
             this.classList.add(this.template.cssClass)
         }
-
         if (config.editMode && !parent.linked) {
             this.addButton = this.createAddButton()
             this.container.appendChild(this.addButton)