@ulb-darmstadt/shacl-form 2.0.0-rc5 → 2.0.0-rc7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundle.js +41 -38
- package/dist/index.js +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -47,7 +47,7 @@ a, a:visited { color: inherit; }
|
|
|
47
47
|
.ref-link { cursor: pointer; }
|
|
48
48
|
.ref-link:hover { text-decoration: underline; }
|
|
49
49
|
.node-id-display { color: #999; font-size: 11px; }`;class Pe{constructor(e){let t=Ne;e&&(t+=`
|
|
50
|
-
`+e),this.stylesheet=new CSSStyleSheet,this.stylesheet.replaceSync(t)}apply(e){}createViewer(e,t,n){const i=document.createElement("div"),a=document.createElement("label");a.innerHTML=e+":",n.description&&a.setAttribute("title",n.description.value),i.appendChild(a);let o=t.value,l=null;if(t instanceof N){const d=n.config.store.getQuads(o,null,null,null);if(d.length){const r=D(d,n.config.languages);r&&(o=r)}}else t instanceof C&&(t.language?(l=document.createElement("span"),l.classList.add("lang"),l.innerText=`@${t.language}`):t.datatype.value===`${x}date`?o=new Date(Date.parse(t.value)).toDateString():t.datatype.value===`${x}dateTime`&&(o=new Date(Date.parse(t.value)).toLocaleString()));let c;return G(t.value)?(c=document.createElement("a"),c.setAttribute("href",t.value)):c=document.createElement("div"),c.classList.add("d-flex"),c.innerText=o,l&&c.appendChild(l),i.appendChild(c),i}}function ke(s,e,t){if(t){const n=s.minCount!==void 0&&s.minCount>0;if(s.class)return s.config.theme.createListEditor(s.label,e,n,J(s.class,s),s);if(s.shaclIn){const i=s.config.lists[s.shaclIn];if(i?.length){const a=le(i,s.config.store,s.config.languages);return s.config.theme.createListEditor(s.label,e,n,a,s)}else console.error("list not found:",s.shaclIn,"existing lists:",s.config.lists)}if(s.datatype?.value===`${E}langString`||s.languageIn?.length)return s.config.theme.createLangStringEditor(s.label,e,n,s);switch(s.datatype?.value.replace(x,"")){case"integer":case"float":case"double":case"decimal":return s.config.theme.createNumberEditor(s.label,e,n,s);case"date":case"dateTime":return s.config.theme.createDateEditor(s.label,e,n,s);case"boolean":return s.config.theme.createBooleanEditor(s.label,e,n,s);case"base64Binary":return s.config.theme.createFileEditor(s.label,e,n,s)}return s.config.theme.createTextEditor(s.label,e,n,s)}else{if(e)return s.config.theme.createViewer(s.label,e,s);const n=document.createElement("div");return n.innerHTML="No value",n}}function Fe(s,e,t){if(e==="application/ld+json")return _e(s);{const n=new ue({format:e,prefixes:t});n.addQuads(s);let i="";return n.end((a,o)=>{a&&console.error(a),i=o}),i}}function _e(s){const e=[];for(const t of s){const n={"@id":t.subject.id};if(t.predicate===m)n["@type"]=t.object.id;else{let i=t.object.value;t.object instanceof C?t.object.language?i={"@language":t.object.language,"@value":t.object.value}:t.object.datatype&&t.object.datatype.value!==`${x}#string`&&(i={"@type":t.object.datatype.value,"@value":t.object.value}):i={"@id":t.object.id},n[t.predicate.value]=i}e.push(n)}return JSON.stringify(e)}function qe(s){let e=s.shaclDatatype,t=s.value;if(t){if(t.startsWith("<")&&t.endsWith(">")&&t.indexOf(":")>-1)return f.namedNode(t.substring(1,t.length-1));if(s.dataset.class||s.dataset.nodeKind===h+"IRI")return f.namedNode(t);if(s.dataset.link)return JSON.parse(s.dataset.link);if(s.dataset.lang?e=s.dataset.lang:s.type==="number"?t=parseFloat(t):s.type==="file"&&s.binaryData?t=s.binaryData:s.type==="datetime-local"&&(t=new Date(t).toISOString().slice(0,19)),!e&&typeof t=="string"){let n=t.split("^^");n.length===2&&n[0].startsWith('"')&&n[0].endsWith('"')&&n[1].split(":").length===2?(t=n[0].substring(1,n[0].length-1),e=f.namedNode(n[1])):(n=t.split("@"),n.length===2&&n[0].startsWith('"')&&n[0].endsWith('"')&&(t=n[0].substring(1,n[0].length-1),e=n[1]))}return f.literal(t,e)}else if((s.type==="checkbox"||s.getAttribute("type")==="checkbox")&&(s.checked||parseInt(s.dataset.minCount||"0")>0))return f.literal(s.checked?"true":"false",e)}const R={};function Qe(s){s.predicate===void 0&&s.datatype===void 0?console.warn('not registering plugin because it does neither define "predicate" nor "datatype"',s):R[`${s.predicate}^${s.datatype}`]=s}function Ve(){return Object.entries(R).map(s=>s[1])}function Me(s,e){let t=R[`${s}^${e}`];return t||(t=R[`${s}^undefined`],t)?t:R[`undefined^${e}`]}class et{constructor(e,t){this.predicate=e.predicate,this.datatype=e.datatype,t&&(this.stylesheet=new CSSStyleSheet,this.stylesheet.replaceSync(t))}createViewer(e,t){return e.config.theme.createViewer(e.label,t,e)}}class _ extends HTMLElement{constructor(e,t,n,i){if(super(),this.template=new Ae(n.store.getQuads(e,null,null,null),t,n),this.container=this,this.template.extendedShapes.length&&this.template.config.attributes.collapse!==null&&(!this.template.maxCount||this.template.maxCount>1)){const a=new k;a.classList.add("collapsible","shacl-group"),a.open=n.attributes.collapse==="open",a.label=this.template.label,this.container=a}if(this.template.order!==void 0&&(this.style.order=`${this.template.order}`),this.template.cssClass&&this.classList.add(this.template.cssClass),n.editMode&&!t.linked&&(this.addButton=this.createAddButton(),this.container.appendChild(this.addButton)),this.template.path){let a=[];i&&(t.linked?a=n.store.getQuads(i,this.template.path,null,null):a=n.store.getQuads(i,this.template.path,null,w));let o=!1;for(const l of a)this.isValueValid(l.object)&&(this.addPropertyInstance(l.object),this.template.hasValue&&l.object.equals(this.template.hasValue)&&(o=!0));n.editMode&&this.template.hasValue&&!o&&!t.linked&&this.addPropertyInstance(this.template.hasValue)}n.editMode&&!t.linked&&(this.addEventListener("change",()=>{this.updateControls()}),this.updateControls()),this.container instanceof k&&(n.editMode&&!t.linked||this.container.childElementCount>0)&&this.appendChild(this.container)}addPropertyInstance(e){let t;if(this.template.shaclOr?.length||this.template.shaclXone?.length){const n=this.template.shaclOr?.length?this.template.shaclOr:this.template.shaclXone;let i=!1;if(e){const a=$e(n,e,this.template.config);a.length&&(t=P(this.template.clone().merge(a),e,!0),i=!0)}i||(t=ce(n,this,this.template.config),de(t,""))}else{let n=!1;if(e&&!(e instanceof C)){const i=this.getRdfClassToLinkOrCreate();i&&this.template.config.store.countQuads(e,m,i,w)===0&&(n=!0)}t=P(this.template,e,void 0,n||this.template.parent.linked)}return this.addButton?this.container.insertBefore(t,this.addButton):this.container.appendChild(t),t}updateControls(){let e=this.querySelectorAll(":scope > .property-instance, :scope > .shacl-or-constraint, :scope > shacl-node").length;e===0&&(!this.template.extendedShapes.length||this.template.minCount!==void 0&&this.template.minCount>0)&&(this.addPropertyInstance(),e=this.querySelectorAll(":scope > .property-instance, :scope > .shacl-or-constraint, :scope > shacl-node").length);let t;this.template.minCount!==void 0?t=e>this.template.minCount:t=this.template.extendedShapes.length>0||e>1;const n=this.template.maxCount===void 0||e<this.template.maxCount;this.classList.toggle("may-remove",t),this.classList.toggle("may-add",n)}toRDF(e,t){for(const n of this.querySelectorAll(":scope > .property-instance, :scope > .collapsible > .property-instance")){const i=f.namedNode(n.dataset.path);if(n.firstChild instanceof S){const a=n.firstChild.toRDF(e);e.addQuad(t,i,a,this.template.config.valuesGraphId)}else for(const a of n.querySelectorAll(":scope > .editor")){const o=qe(a);o&&e.addQuad(t,i,o,this.template.config.valuesGraphId)}}}getRdfClassToLinkOrCreate(){if(this.template.class&&this.template.node)return this.template.class;for(const e of this.template.extendedShapes){const t=this.template.config.store.getObjects(e,I,null);if(t.length>0)return t[0]}}isValueValid(e){if(!this.template.extendedShapes.length)return!0;for(const t of this.template.extendedShapes){const n=this.template.config.store.getObjects(t,I,null);for(const i of n)if(this.template.config.store.countQuads(e,m,i,null)>0)return!0}return!1}createAddButton(){const e=new oe;e.dense=!0,e.label="+ "+this.template.label,e.title="Add "+this.template.label,e.autoGrowLabelWidth=!0,e.classList.add("add-button");let t=[],n=this.getRdfClassToLinkOrCreate();if(n&&(t=J(n,this.template)),t.length===0)e.emptyMessage="",e.inputMinWidth=0,e.addEventListener("click",i=>{e.blur();const a=this.addPropertyInstance();a.classList.add("fadeIn"),this.updateControls(),setTimeout(()=>{Re(a),a.classList.remove("fadeIn")},200)});else{const i=document.createElement("ul"),a=document.createElement("li");a.innerHTML="+ Create new "+this.template.label+"...",a.dataset.value="new",a.classList.add("large"),i.appendChild(a);const o=document.createElement("li");o.classList.add("divider"),i.appendChild(o);const l=document.createElement("li");l.classList.add("header"),l.innerText="Or link existing:",i.appendChild(l);for(const c of t){const d=document.createElement("li"),r=typeof c.value=="string"?c.value:c.value.value;d.innerText=c.label?c.label:r,d.dataset.value=JSON.stringify(c.value),i.appendChild(d)}e.appendChild(i),e.collapsibleWidth="250px",e.collapsibleOrientationLeft="",e.addEventListener("change",()=>{if(e.value==="new")this.addPropertyInstance();else{const c=JSON.parse(e.value);this.container.insertBefore(P(this.template,c,!0,!0),e)}e.value=""})}return e}}function P(s,e,t=!1,n=!1){let i;if(s.extendedShapes.length){i=document.createElement("div"),i.classList.add("property-instance");for(const a of s.extendedShapes)i.appendChild(new S(a,s.config,e,s.parent,s.nodeKind,s.label,n))}else{const a=Me(s.path,s.datatype?.value);a?s.config.editMode&&!n?i=a.createEditor(s,e):i=a.createViewer(s,e):i=ke(s,e||null,s.config.editMode&&!n),i.classList.add("property-instance"),n&&i.classList.add("linked")}return s.config.editMode&&de(i,s.label,t),i.dataset.path=s.path,i}function de(s,e,t=!1){const n=new fe;n.classList.add("remove-button","clear"),n.title="Remove "+e,n.dense=!0,n.icon=!0,n.addEventListener("click",i=>{s.classList.remove("fadeIn"),s.classList.add("fadeOut"),setTimeout(()=>{const a=s.parentElement;s.remove(),a?.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0}))},200)}),t&&n.classList.add("persistent"),s.appendChild(n)}window.customElements.define("shacl-property",_);function Be(s,e){let t=s;const n=e.store.getQuads(s,null,null,null),i=j(n,"label",X,e.languages);i&&(t=i);let a;if(e.attributes.collapse!==null)a=new k,a.classList.add("collapsible"),a.open=e.attributes.collapse==="open",a.label=t;else{a=document.createElement("div");const l=document.createElement("h1");l.innerText=t,a.appendChild(l)}a.dataset.subject=s,a.classList.add("shacl-group");const o=j(n,"order");return o&&(a.style.order=o),a}class S extends HTMLElement{constructor(e,t,n,i,a,o,l){super(),this.owlImports=[],this.parent=i,this.config=t,this.shaclSubject=e,this.linked=l||!1;let c=n;if(!c){if(!a){const r=t.store.getObjects(e,`${h}nodeKind`,null);r.length&&(a=r[0])}a===void 0&&t.attributes.valuesNamespace||a?.value===`${h}IRI`?c=f.namedNode(t.attributes.valuesNamespace+Z()):c=f.blankNode(Z())}this.nodeId=c;const d=JSON.stringify([e,n]);if(n&&t.renderedNodes.has(d)){o=o||"Link";const r=document.createElement("label");r.innerText=o,r.classList.add("linked"),this.appendChild(r);const u=document.createElement("a");let g=n.termType==="BlankNode"?"_:"+n.value:n.value;u.innerText=g,u.classList.add("ref-link"),u.onclick=()=>{this.config.form.querySelector(`shacl-node[data-node-id='${g}']`)?.scrollIntoView()},this.appendChild(u),this.style.flexDirection="row"}else{if(n&&t.renderedNodes.add(d),this.dataset.nodeId=this.nodeId.id,this.config.attributes.showNodeIds!==null){const r=document.createElement("div");r.innerText=`id: ${this.nodeId.id}`,r.classList.add("node-id-display"),this.appendChild(r)}for(const r of t.store.getQuads(e,z,null,null))this.owlImports.push(r.object);for(const r of t.store.getQuads(e,null,null,null))switch(r.predicate.id){case F.id:this.addPropertyInstance(r.object,t,n);break;case`${h}and`:const u=t.lists[r.object.value];if(u?.length)for(const g of u)this.prepend(new S(g,t,n,this));else console.error("list not found:",r.object.value,"existing lists:",t.lists);break;case Ie.id:this.prepend(new S(r.object,t,n,this));break;case`${h}targetClass`:this.targetClass=r.object;break;case`${h}or`:this.tryResolve(r.object,n,t);break;case`${h}xone`:this.tryResolve(r.object,n,t);break}if(o){const r=document.createElement("h1");r.innerText=o,this.prepend(r)}}}toRDF(e,t){if(t||(t=this.nodeId),!this.linked){for(const n of this.querySelectorAll(":scope > shacl-node, :scope > .shacl-group > shacl-node, :scope > shacl-property, :scope > .shacl-group > shacl-property"))n.toRDF(e,t);this.targetClass&&e.addQuad(t,m,this.targetClass,this.config.valuesGraphId),this.config.attributes.generateNodeShapeReference&&!this.parent&&e.addQuad(t,f.namedNode(this.config.attributes.generateNodeShapeReference),this.shaclSubject,this.config.valuesGraphId)}return t}addPropertyInstance(e,t,n){let i=this;const a=t.store.getQuads(e,`${h}group`,null,null);if(a.length>0){const l=a[0].object.value;if(t.groups.indexOf(l)>-1){let c=this.querySelector(`:scope > .shacl-group[data-subject='${l}']`);c||(c=Be(l,t),this.appendChild(c)),i=c}else console.warn("ignoring unknown group reference",a[0],"existing groups:",t.groups)}const o=new _(e,this,t,n);o.childElementCount>0&&i.appendChild(o)}tryResolve(e,t,n){const i=n.lists[e.value];if(i?.length){let a=!1;if(t){const o=Oe(i,t,n);if(o.length){for(const l of o)this.addPropertyInstance(l,n,t);a=!0}}a||this.appendChild(ce(i,this,n))}else console.error("list for sh:or/sh:xone not found:",e,"existing lists:",n.lists)}}window.customElements.define("shacl-node",S);const Q={},V={};class Ue{constructor(e){this.loadedExternalUrls=[],this.loadedClasses=[],this.config=e}async loadGraphs(){this.loadedExternalUrls=[],this.loadedClasses=[],this.config.prefixes={};const e=[],t=new H;if(e.push(this.importRDF(this.config.attributes.shapes?this.config.attributes.shapes:this.config.attributes.shapesUrl?this.fetchRDF(this.config.attributes.shapesUrl):"",t,L)),e.push(this.importRDF(this.config.attributes.values?this.config.attributes.values:this.config.attributes.valuesUrl?this.fetchRDF(this.config.attributes.valuesUrl):"",t,w)),await Promise.all(e),t.countQuads(null,null,null,L)===0&&this.config.attributes.valuesSubject){const n=[...t.getObjects(this.config.attributes.valuesSubject,B,w)],i=[];for(const a of n){const o=this.toURL(a.value);o&&this.loadedExternalUrls.indexOf(o)<0&&(this.loadedExternalUrls.push(o),i.push(this.importRDF(this.fetchRDF(o),t,L)))}try{await Promise.allSettled(i)}catch(a){console.warn(a)}}this.config.store=t}async importRDF(e,t,n){const i=async a=>{const o=[];await new Promise((l,c)=>{const d=ne(a)==="xml"?new ge:new he;d.on("data",r=>{if(t.add(new ae(r.subject,r.predicate,r.object,n)),this.config.attributes.ignoreOwlImports===null&&z.equals(r.predicate)){const u=this.toURL(r.object.value);u&&this.loadedExternalUrls.indexOf(u)<0&&(this.loadedExternalUrls.push(u),o.push(this.importRDF(this.fetchRDF(u),t,f.namedNode(u))))}if(this.config.classInstanceProvider&&(K.equals(r.predicate)||I.equals(r.predicate))){const u=r.object.value;if(this.loadedClasses.indexOf(u)<0){let g;u in V?g=V[u]:(g=this.config.classInstanceProvider(u),V[u]=g),this.loadedClasses.push(u),o.push(this.importRDF(g,t,n))}}}).on("error",r=>{console.warn("failed parsing graph",n,r.message),c(r)}).on("prefix",(r,u)=>{r&&(this.config.prefixes[r]=u)}).on("end",()=>{l(null)}),d.write(a),d.end()});try{await Promise.allSettled(o)}catch(l){console.warn(l)}};if(e instanceof Promise&&(e=await e),e){if(ne(e)==="json")try{e=await me(JSON.parse(e),{format:"application/n-quads"})}catch(a){console.error(a)}await i(e)}}toURL(e){if(G(e))return e;if(this.config.prefixes){const t=e.split(":");if(t.length===2){const n=this.config.prefixes[t[0]];if(n&&(e=e.replace(`${t[0]}:`,n),G(e)))return e}}return null}async fetchRDF(e){if(e in Q)return Q[e];let t=e;this.config.attributes.proxy&&(t=this.config.attributes.proxy+encodeURIComponent(e));const n=fetch(t,{headers:{Accept:"text/turtle, application/trig, application/n-triples, application/n-quads, text/n3, application/ld+json"}}).then(i=>i.text());return Q[e]=n,n}}function ne(s){return/^\s*\{/.test(s)?"json":/^\s*<\?xml/.test(s)?"xml":"ttl"}class M{constructor(){this.shapes=null,this.shapesUrl=null,this.shapeSubject=null,this.values=null,this.valuesUrl=null,this.valueSubject=null,this.valuesSubject=null,this.valuesNamespace="",this.valuesGraph=null,this.view=null,this.language=null,this.loading="Loading…",this.proxy=null,this.ignoreOwlImports=null,this.collapse=null,this.submitButton=null,this.generateNodeShapeReference=null,this.showNodeIds=null}}class ie{constructor(e,t){this.attributes=new M,this.loader=new Ue(this),this.prefixes={},this.editMode=!0,this.lists={},this.groups=[],this.renderedNodes=new Set,this._store=new H,this.theme=e,this.form=t,this.languages=[...new Set(navigator.languages.flatMap(n=>n.length>2?[n.toLocaleLowerCase(),n.substring(0,2)]:n)),""]}updateAttributes(e){const t=new M;if(Object.keys(t).forEach(n=>{const i=e.dataset[n];i!==void 0&&(t[n]=i)}),this.editMode=t.view===null,this.attributes=t,this.attributes.valueSubject&&!this.attributes.valuesSubject&&(this.attributes.valuesSubject=this.attributes.valueSubject),t.language){const n=this.languages.indexOf(t.language);n>-1&&this.languages.splice(n,1),this.languages.unshift(t.language)}t.valuesGraph&&(this.valuesGraphId=f.namedNode(t.valuesGraph))}static dataAttributes(){const e=new M;return Object.keys(e).map(t=>(t=t.replace(/[A-Z]/g,n=>"-"+n.toLowerCase()),"data-"+t))}get store(){return this._store}set store(e){this._store=e,this.lists=De(e,{ignoreErrors:!0}),this.groups=[],e.forSubjects(t=>{this.groups.push(t.id)},m,`${h}PropertyGroup`,null)}}const Ge=`
|
|
50
|
+
`+e),this.stylesheet=new CSSStyleSheet,this.stylesheet.replaceSync(t)}apply(e){}createViewer(e,t,n){const i=document.createElement("div"),a=document.createElement("label");a.innerHTML=e+":",n.description&&a.setAttribute("title",n.description.value),i.appendChild(a);let o=t.value,l=null;if(t instanceof N){const d=n.config.store.getQuads(o,null,null,null);if(d.length){const r=D(d,n.config.languages);r&&(o=r)}}else t instanceof C&&(t.language?(l=document.createElement("span"),l.classList.add("lang"),l.innerText=`@${t.language}`):t.datatype.value===`${x}date`?o=new Date(Date.parse(t.value)).toDateString():t.datatype.value===`${x}dateTime`&&(o=new Date(Date.parse(t.value)).toLocaleString()));let c;return G(t.value)?(c=document.createElement("a"),c.setAttribute("href",t.value)):c=document.createElement("div"),c.classList.add("d-flex"),c.innerText=o,l&&c.appendChild(l),i.appendChild(c),i}}function ke(s,e,t){if(t){const n=s.minCount!==void 0&&s.minCount>0;if(s.class)return s.config.theme.createListEditor(s.label,e,n,J(s.class,s),s);if(s.shaclIn){const i=s.config.lists[s.shaclIn];if(i?.length){const a=le(i,s.config.store,s.config.languages);return s.config.theme.createListEditor(s.label,e,n,a,s)}else console.error("list not found:",s.shaclIn,"existing lists:",s.config.lists)}if(s.datatype?.value===`${E}langString`||s.languageIn?.length)return s.config.theme.createLangStringEditor(s.label,e,n,s);switch(s.datatype?.value.replace(x,"")){case"integer":case"float":case"double":case"decimal":return s.config.theme.createNumberEditor(s.label,e,n,s);case"date":case"dateTime":return s.config.theme.createDateEditor(s.label,e,n,s);case"boolean":return s.config.theme.createBooleanEditor(s.label,e,n,s);case"base64Binary":return s.config.theme.createFileEditor(s.label,e,n,s)}return s.config.theme.createTextEditor(s.label,e,n,s)}else{if(e)return s.config.theme.createViewer(s.label,e,s);const n=document.createElement("div");return n.innerHTML="No value",n}}function Fe(s,e,t){if(e==="application/ld+json")return _e(s);{const n=new ue({format:e,prefixes:t});n.addQuads(s);let i="";return n.end((a,o)=>{a&&console.error(a),i=o}),i}}function _e(s){const e=[];for(const t of s){const n={"@id":t.subject.id};if(t.predicate===m)n["@type"]=t.object.id;else{let i=t.object.value;t.object instanceof C?t.object.language?i={"@language":t.object.language,"@value":t.object.value}:t.object.datatype&&t.object.datatype.value!==`${x}#string`&&(i={"@type":t.object.datatype.value,"@value":t.object.value}):i={"@id":t.object.id},n[t.predicate.value]=i}e.push(n)}return JSON.stringify(e)}function qe(s){let e=s.shaclDatatype,t=s.value;if(t){if(t.startsWith("<")&&t.endsWith(">")&&t.indexOf(":")>-1)return f.namedNode(t.substring(1,t.length-1));if(s.dataset.class||s.dataset.nodeKind===h+"IRI")return f.namedNode(t);if(s.dataset.link)return JSON.parse(s.dataset.link);if(s.dataset.lang?e=s.dataset.lang:s.type==="number"?t=parseFloat(t):s.type==="file"&&s.binaryData?t=s.binaryData:s.type==="datetime-local"&&(t=new Date(t).toISOString().slice(0,19)),!e&&typeof t=="string"){let n=t.split("^^");n.length===2&&n[0].startsWith('"')&&n[0].endsWith('"')&&n[1].split(":").length===2?(t=n[0].substring(1,n[0].length-1),e=f.namedNode(n[1])):(n=t.split("@"),n.length===2&&n[0].startsWith('"')&&n[0].endsWith('"')?(t=n[0].substring(1,n[0].length-1),e=n[1]):t.startsWith('"')&&t.endsWith('"')&&(t=t.substring(1,t.length-1)))}return f.literal(t,e)}else if((s.type==="checkbox"||s.getAttribute("type")==="checkbox")&&(s.checked||parseInt(s.dataset.minCount||"0")>0))return f.literal(s.checked?"true":"false",e)}const R={};function Qe(s){s.predicate===void 0&&s.datatype===void 0?console.warn('not registering plugin because it does neither define "predicate" nor "datatype"',s):R[`${s.predicate}^${s.datatype}`]=s}function Ve(){return Object.entries(R).map(s=>s[1])}function Me(s,e){let t=R[`${s}^${e}`];return t||(t=R[`${s}^undefined`],t)?t:R[`undefined^${e}`]}class et{constructor(e,t){this.predicate=e.predicate,this.datatype=e.datatype,t&&(this.stylesheet=new CSSStyleSheet,this.stylesheet.replaceSync(t))}createViewer(e,t){return e.config.theme.createViewer(e.label,t,e)}}class _ extends HTMLElement{constructor(e,t,n,i){if(super(),this.template=new Ae(n.store.getQuads(e,null,null,null),t,n),this.container=this,this.template.extendedShapes.length&&this.template.config.attributes.collapse!==null&&(!this.template.maxCount||this.template.maxCount>1)){const a=new k;a.classList.add("collapsible","shacl-group"),a.open=n.attributes.collapse==="open",a.label=this.template.label,this.container=a}if(this.template.order!==void 0&&(this.style.order=`${this.template.order}`),this.template.cssClass&&this.classList.add(this.template.cssClass),n.editMode&&!t.linked&&(this.addButton=this.createAddButton(),this.container.appendChild(this.addButton)),this.template.path){let a=[];i&&(t.linked?a=n.store.getQuads(i,this.template.path,null,null):a=n.store.getQuads(i,this.template.path,null,w));let o=!1;for(const l of a)this.isValueValid(l.object)&&(this.addPropertyInstance(l.object),this.template.hasValue&&l.object.equals(this.template.hasValue)&&(o=!0));n.editMode&&this.template.hasValue&&!o&&!t.linked&&this.addPropertyInstance(this.template.hasValue)}n.editMode&&!t.linked&&(this.addEventListener("change",()=>{this.updateControls()}),this.updateControls()),this.container instanceof k&&(n.editMode&&!t.linked||this.container.childElementCount>0)&&this.appendChild(this.container)}addPropertyInstance(e){let t;if(this.template.shaclOr?.length||this.template.shaclXone?.length){const n=this.template.shaclOr?.length?this.template.shaclOr:this.template.shaclXone;let i=!1;if(e){const a=$e(n,e,this.template.config);a.length&&(t=P(this.template.clone().merge(a),e,!0),i=!0)}i||(t=ce(n,this,this.template.config),de(t,""))}else{let n=!1;if(e&&!(e instanceof C)){const i=this.getRdfClassToLinkOrCreate();i&&this.template.config.store.countQuads(e,m,i,w)===0&&(n=!0)}t=P(this.template,e,void 0,n||this.template.parent.linked)}return this.addButton?this.container.insertBefore(t,this.addButton):this.container.appendChild(t),t}updateControls(){let e=this.querySelectorAll(":scope > .property-instance, :scope > .shacl-or-constraint, :scope > shacl-node").length;e===0&&(!this.template.extendedShapes.length||this.template.minCount!==void 0&&this.template.minCount>0)&&(this.addPropertyInstance(),e=this.querySelectorAll(":scope > .property-instance, :scope > .shacl-or-constraint, :scope > shacl-node").length);let t;this.template.minCount!==void 0?t=e>this.template.minCount:t=this.template.extendedShapes.length>0||e>1;const n=this.template.maxCount===void 0||e<this.template.maxCount;this.classList.toggle("may-remove",t),this.classList.toggle("may-add",n)}toRDF(e,t){for(const n of this.querySelectorAll(":scope > .property-instance, :scope > .collapsible > .property-instance")){const i=f.namedNode(n.dataset.path);if(n.firstChild instanceof S){const a=n.firstChild.toRDF(e);e.addQuad(t,i,a,this.template.config.valuesGraphId)}else for(const a of n.querySelectorAll(":scope > .editor")){const o=qe(a);o&&e.addQuad(t,i,o,this.template.config.valuesGraphId)}}}getRdfClassToLinkOrCreate(){if(this.template.class&&this.template.node)return this.template.class;for(const e of this.template.extendedShapes){const t=this.template.config.store.getObjects(e,I,null);if(t.length>0)return t[0]}}isValueValid(e){if(!this.template.extendedShapes.length)return!0;for(const t of this.template.extendedShapes){const n=this.template.config.store.getObjects(t,I,null);for(const i of n)if(this.template.config.store.countQuads(e,m,i,null)>0)return!0}return!1}createAddButton(){const e=new oe;e.dense=!0,e.label="+ "+this.template.label,e.title="Add "+this.template.label,e.autoGrowLabelWidth=!0,e.classList.add("add-button");let t=[],n=this.getRdfClassToLinkOrCreate();if(n&&(t=J(n,this.template)),t.length===0)e.emptyMessage="",e.inputMinWidth=0,e.addEventListener("click",i=>{e.blur();const a=this.addPropertyInstance();a.classList.add("fadeIn"),this.updateControls(),setTimeout(()=>{Re(a),a.classList.remove("fadeIn")},200)});else{const i=document.createElement("ul"),a=document.createElement("li");a.innerHTML="+ Create new "+this.template.label+"...",a.dataset.value="new",a.classList.add("large"),i.appendChild(a);const o=document.createElement("li");o.classList.add("divider"),i.appendChild(o);const l=document.createElement("li");l.classList.add("header"),l.innerText="Or link existing:",i.appendChild(l);for(const c of t){const d=document.createElement("li"),r=typeof c.value=="string"?c.value:c.value.value;d.innerText=c.label?c.label:r,d.dataset.value=JSON.stringify(c.value),i.appendChild(d)}e.appendChild(i),e.collapsibleWidth="250px",e.collapsibleOrientationLeft="",e.addEventListener("change",()=>{if(e.value==="new")this.addPropertyInstance();else{const c=JSON.parse(e.value);this.container.insertBefore(P(this.template,c,!0,!0),e)}e.value=""})}return e}}function P(s,e,t=!1,n=!1){let i;if(s.extendedShapes.length){i=document.createElement("div"),i.classList.add("property-instance");for(const a of s.extendedShapes)i.appendChild(new S(a,s.config,e,s.parent,s.nodeKind,s.label,n))}else{const a=Me(s.path,s.datatype?.value);a?s.config.editMode&&!n?i=a.createEditor(s,e):i=a.createViewer(s,e):i=ke(s,e||null,s.config.editMode&&!n),i.classList.add("property-instance"),n&&i.classList.add("linked")}return s.config.editMode&&de(i,s.label,t),i.dataset.path=s.path,i}function de(s,e,t=!1){const n=new fe;n.classList.add("remove-button","clear"),n.title="Remove "+e,n.dense=!0,n.icon=!0,n.addEventListener("click",i=>{s.classList.remove("fadeIn"),s.classList.add("fadeOut"),setTimeout(()=>{const a=s.parentElement;s.remove(),a?.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0}))},200)}),t&&n.classList.add("persistent"),s.appendChild(n)}window.customElements.define("shacl-property",_);function Be(s,e){let t=s;const n=e.store.getQuads(s,null,null,null),i=j(n,"label",X,e.languages);i&&(t=i);let a;if(e.attributes.collapse!==null)a=new k,a.classList.add("collapsible"),a.open=e.attributes.collapse==="open",a.label=t;else{a=document.createElement("div");const l=document.createElement("h1");l.innerText=t,a.appendChild(l)}a.dataset.subject=s,a.classList.add("shacl-group");const o=j(n,"order");return o&&(a.style.order=o),a}class S extends HTMLElement{constructor(e,t,n,i,a,o,l){super(),this.owlImports=[],this.parent=i,this.config=t,this.shaclSubject=e,this.linked=l||!1;let c=n;if(!c){if(!a){const r=t.store.getObjects(e,`${h}nodeKind`,null);r.length&&(a=r[0])}a===void 0&&t.attributes.valuesNamespace||a?.value===`${h}IRI`?c=f.namedNode(t.attributes.valuesNamespace+Z()):c=f.blankNode(Z())}this.nodeId=c;const d=JSON.stringify([e,n]);if(n&&t.renderedNodes.has(d)){o=o||"Link";const r=document.createElement("label");r.innerText=o,r.classList.add("linked"),this.appendChild(r);const u=document.createElement("a");let g=n.termType==="BlankNode"?"_:"+n.value:n.value;u.innerText=g,u.classList.add("ref-link"),u.onclick=()=>{this.config.form.querySelector(`shacl-node[data-node-id='${g}']`)?.scrollIntoView()},this.appendChild(u),this.style.flexDirection="row"}else{if(n&&t.renderedNodes.add(d),this.dataset.nodeId=this.nodeId.id,this.config.attributes.showNodeIds!==null){const r=document.createElement("div");r.innerText=`id: ${this.nodeId.id}`,r.classList.add("node-id-display"),this.appendChild(r)}for(const r of t.store.getQuads(e,z,null,null))this.owlImports.push(r.object);for(const r of t.store.getQuads(e,null,null,null))switch(r.predicate.id){case F.id:this.addPropertyInstance(r.object,t,n);break;case`${h}and`:const u=t.lists[r.object.value];if(u?.length)for(const g of u)this.prepend(new S(g,t,n,this));else console.error("list not found:",r.object.value,"existing lists:",t.lists);break;case Ie.id:this.prepend(new S(r.object,t,n,this));break;case`${h}targetClass`:this.targetClass=r.object;break;case`${h}or`:this.tryResolve(r.object,n,t);break;case`${h}xone`:this.tryResolve(r.object,n,t);break}if(o){const r=document.createElement("h1");r.innerText=o,this.prepend(r)}}}toRDF(e,t){if(t||(t=this.nodeId),!this.linked){for(const n of this.querySelectorAll(":scope > shacl-node, :scope > .shacl-group > shacl-node, :scope > shacl-property, :scope > .shacl-group > shacl-property"))n.toRDF(e,t);this.targetClass&&e.addQuad(t,m,this.targetClass,this.config.valuesGraphId),this.config.attributes.generateNodeShapeReference&&!this.parent&&e.addQuad(t,f.namedNode(this.config.attributes.generateNodeShapeReference),this.shaclSubject,this.config.valuesGraphId)}return t}addPropertyInstance(e,t,n){let i=this;const a=t.store.getQuads(e,`${h}group`,null,null);if(a.length>0){const l=a[0].object.value;if(t.groups.indexOf(l)>-1){let c=this.querySelector(`:scope > .shacl-group[data-subject='${l}']`);c||(c=Be(l,t),this.appendChild(c)),i=c}else console.warn("ignoring unknown group reference",a[0],"existing groups:",t.groups)}const o=new _(e,this,t,n);o.childElementCount>0&&i.appendChild(o)}tryResolve(e,t,n){const i=n.lists[e.value];if(i?.length){let a=!1;if(t){const o=Oe(i,t,n);if(o.length){for(const l of o)this.addPropertyInstance(l,n,t);a=!0}}a||this.appendChild(ce(i,this,n))}else console.error("list for sh:or/sh:xone not found:",e,"existing lists:",n.lists)}}window.customElements.define("shacl-node",S);const Q={},V={};class Ue{constructor(e){this.loadedExternalUrls=[],this.loadedClasses=[],this.config=e}async loadGraphs(){this.loadedExternalUrls=[],this.loadedClasses=[],this.config.prefixes={};const e=[],t=new H;if(e.push(this.importRDF(this.config.attributes.shapes?this.config.attributes.shapes:this.config.attributes.shapesUrl?this.fetchRDF(this.config.attributes.shapesUrl):"",t,L)),e.push(this.importRDF(this.config.attributes.values?this.config.attributes.values:this.config.attributes.valuesUrl?this.fetchRDF(this.config.attributes.valuesUrl):"",t,w)),await Promise.all(e),t.countQuads(null,null,null,L)===0&&this.config.attributes.valuesSubject){const n=[...t.getObjects(this.config.attributes.valuesSubject,B,w)],i=[];for(const a of n){const o=this.toURL(a.value);o&&this.loadedExternalUrls.indexOf(o)<0&&(this.loadedExternalUrls.push(o),i.push(this.importRDF(this.fetchRDF(o),t,L)))}try{await Promise.allSettled(i)}catch(a){console.warn(a)}}this.config.store=t}async importRDF(e,t,n){const i=async a=>{const o=[];await new Promise((l,c)=>{const d=ne(a)==="xml"?new ge:new he;d.on("data",r=>{if(t.add(new ae(r.subject,r.predicate,r.object,n)),this.config.attributes.ignoreOwlImports===null&&z.equals(r.predicate)){const u=this.toURL(r.object.value);u&&this.loadedExternalUrls.indexOf(u)<0&&(this.loadedExternalUrls.push(u),o.push(this.importRDF(this.fetchRDF(u),t,f.namedNode(u))))}if(this.config.classInstanceProvider&&(K.equals(r.predicate)||I.equals(r.predicate))){const u=r.object.value;if(this.loadedClasses.indexOf(u)<0){let g;u in V?g=V[u]:(g=this.config.classInstanceProvider(u),V[u]=g),this.loadedClasses.push(u),o.push(this.importRDF(g,t,n))}}}).on("error",r=>{console.warn("failed parsing graph",n,r.message),c(r)}).on("prefix",(r,u)=>{r&&(this.config.prefixes[r]=u)}).on("end",()=>{l(null)}),d.write(a),d.end()});try{await Promise.allSettled(o)}catch(l){console.warn(l)}};if(e instanceof Promise&&(e=await e),e){if(ne(e)==="json")try{e=await me(JSON.parse(e),{format:"application/n-quads"})}catch(a){console.error(a)}await i(e)}}toURL(e){if(G(e))return e;if(this.config.prefixes){const t=e.split(":");if(t.length===2){const n=this.config.prefixes[t[0]];if(n&&(e=e.replace(`${t[0]}:`,n),G(e)))return e}}return null}async fetchRDF(e){if(e in Q)return Q[e];let t=e;this.config.attributes.proxy&&(t=this.config.attributes.proxy+encodeURIComponent(e));const n=fetch(t,{headers:{Accept:"text/turtle, application/trig, application/n-triples, application/n-quads, text/n3, application/ld+json"}}).then(i=>i.text());return Q[e]=n,n}}function ne(s){return/^\s*\{/.test(s)?"json":/^\s*<\?xml/.test(s)?"xml":"ttl"}class M{constructor(){this.shapes=null,this.shapesUrl=null,this.shapeSubject=null,this.values=null,this.valuesUrl=null,this.valueSubject=null,this.valuesSubject=null,this.valuesNamespace="",this.valuesGraph=null,this.view=null,this.language=null,this.loading="Loading…",this.proxy=null,this.ignoreOwlImports=null,this.collapse=null,this.submitButton=null,this.generateNodeShapeReference=null,this.showNodeIds=null}}class ie{constructor(e,t){this.attributes=new M,this.loader=new Ue(this),this.prefixes={},this.editMode=!0,this.lists={},this.groups=[],this.renderedNodes=new Set,this._store=new H,this.theme=e,this.form=t,this.languages=[...new Set(navigator.languages.flatMap(n=>n.length>2?[n.toLocaleLowerCase(),n.substring(0,2)]:n)),""]}updateAttributes(e){const t=new M;if(Object.keys(t).forEach(n=>{const i=e.dataset[n];i!==void 0&&(t[n]=i)}),this.editMode=t.view===null,this.attributes=t,this.attributes.valueSubject&&!this.attributes.valuesSubject&&(this.attributes.valuesSubject=this.attributes.valueSubject),t.language){const n=this.languages.indexOf(t.language);n>-1&&this.languages.splice(n,1),this.languages.unshift(t.language)}t.valuesGraph&&(this.valuesGraphId=f.namedNode(t.valuesGraph))}static dataAttributes(){const e=new M;return Object.keys(e).map(t=>(t=t.replace(/[A-Z]/g,n=>"-"+n.toLowerCase()),"data-"+t))}get store(){return this._store}set store(e){this._store=e,this.lists=De(e,{ignoreErrors:!0}),this.groups=[],e.forSubjects(t=>{this.groups.push(t.id)},m,`${h}PropertyGroup`,null)}}const Ge=`
|
|
51
51
|
.editor:not([type='checkbox']) { border: 1px solid #DDD; }
|
|
52
52
|
.property-instance label { display: inline-flex; word-break: break-word; line-height: 1em; padding-top: 0.15em; padding-right: 1em; flex-shrink: 0; position: relative; }
|
|
53
53
|
.property-instance:not(:first-child) > label:not(.persistent) { visibility: hidden; max-height: 0; }
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ulb-darmstadt/shacl-form",
|
|
3
|
-
"version": "2.0.0-
|
|
3
|
+
"version": "2.0.0-rc7",
|
|
4
4
|
"description": "SHACL form generator",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"vitest": "^3.2.4"
|
|
65
65
|
},
|
|
66
66
|
"peerDependencies": {
|
|
67
|
-
"@ro-kit/ui-widgets": "^1.0.
|
|
67
|
+
"@ro-kit/ui-widgets": "^1.0.4",
|
|
68
68
|
"jsonld": "^8.3.3",
|
|
69
69
|
"leaflet": "^1.9.4",
|
|
70
70
|
"leaflet-editable": "^1.3.2",
|