@ulb-darmstadt/shacl-form 1.10.3 → 2.0.0-rc1

package/dist/themes/bootstrap.d.ts

@@ -1,10 +0,0 @@
-import { DefaultTheme } from './default';
-import { Term } from '@rdfjs/types';
-import { ShaclPropertyTemplate } from '../property-template';
-import { Editor } from '../theme';
-export declare class BootstrapTheme extends DefaultTheme {
-    constructor();
-    apply(root: HTMLFormElement): void;
-    createDefaultTemplate(label: string, value: Term | null, required: boolean, editor: Editor, template?: ShaclPropertyTemplate | undefined): HTMLElement;
-    createButton(label: string, primary: boolean): HTMLElement;
-}

package/dist/themes/material.d.ts

@@ -1,15 +0,0 @@
-import { ShaclPropertyTemplate } from '../property-template';
-import { Term } from '@rdfjs/types';
-import { Theme, InputListEntry, Editor } from '../theme';
-export declare class MaterialTheme extends Theme {
-    constructor();
-    createDefaultTemplate(label: string, value: Term | null, required: boolean, editor: Editor, template?: ShaclPropertyTemplate): HTMLElement;
-    createTextEditor(label: string, value: Term | null, required: boolean, template: ShaclPropertyTemplate): HTMLElement;
-    createNumberEditor(label: string, value: Term | null, required: boolean, template: ShaclPropertyTemplate): HTMLElement;
-    createListEditor(label: string, value: Term | null, required: boolean, listEntries: InputListEntry[], template?: ShaclPropertyTemplate): HTMLElement;
-    createBooleanEditor(label: string, value: Term | null, required: boolean, template: ShaclPropertyTemplate): HTMLElement;
-    createDateEditor(_: string, value: Term | null, required: boolean, template: ShaclPropertyTemplate): HTMLElement;
-    createLangStringEditor(label: string, value: Term | null, required: boolean, template: ShaclPropertyTemplate): HTMLElement;
-    createFileEditor(label: string, value: Term | null, required: boolean, template: ShaclPropertyTemplate): HTMLElement;
-    createButton(label: string, primary: boolean): HTMLElement;
-}

package/src/config.ts

@@ -1,110 +0,0 @@
-import { DataFactory, NamedNode, Prefixes, Store } from 'n3'
-import { Term } from '@rdfjs/types'
-import { PREFIX_SHACL, RDF_PREDICATE_TYPE } from './constants'
-import { ClassInstanceProvider } from './plugin'
-import { Loader } from './loader'
-import { Theme } from './theme'
-import { extractLists } from './util'
-
-export class ElementAttributes {
-    shapes: string | null = null
-    shapesUrl: string | null = null
-    shapeSubject: string | null = null
-    values: string | null = null
-    valuesUrl: string | null = null
-    /**
-     * @deprecated Use valuesSubject instead
-     */
-    valueSubject: string | null = null // for backward compatibility
-    valuesSubject: string | null = null
-    valuesNamespace = ''
-    valuesGraph: string | null = null
-    view: string | null = null
-    language: string | null = null
-    loading: string = 'Loading\u2026'
-    proxy: string | null = null
-    ignoreOwlImports: string | null = null
-    collapse: string | null = null
-    submitButton: string | null = null
-    generateNodeShapeReference: string | null = null
-    showNodeIds: string | null = null
-}
-
-export class Config {
-    attributes = new ElementAttributes()
-    loader = new Loader(this)
-    classInstanceProvider: ClassInstanceProvider | undefined
-    prefixes: Prefixes = {}
-    editMode = true
-    languages: string[]
-
-    lists: Record<string, Term[]> = {}
-    groups: Array<string> = []
-    theme: Theme
-    form: HTMLElement
-    renderedNodes = new Set<string>()
-    valuesGraphId: NamedNode | undefined
-    private _store = new Store()
-
-    constructor(theme: Theme, form: HTMLElement) {
-        this.theme = theme
-        this.form = form
-        this.languages = [...new Set(navigator.languages.flatMap(lang => {
-            if (lang.length > 2) {
-                // for each 5 letter lang code (e.g. de-DE) append its corresponding 2 letter code (e.g. de) directly afterwards
-                return [lang.toLocaleLowerCase(), lang.substring(0, 2)]
-            } 
-            return lang
-        })), ''] // <-- append empty string to accept RDF literals with no language
-    }
- 
-    updateAttributes(elem: HTMLElement) {
-        const atts = new ElementAttributes();
-        (Object.keys(atts) as Array<keyof ElementAttributes>).forEach(key => {
-            const value = elem.dataset[key]
-            if (value !== undefined) {
-                atts[key] = value
-            }
-        })
-        this.editMode = atts.view === null
-        this.attributes = atts
-        // for backward compatibility
-        if (this.attributes.valueSubject && !this.attributes.valuesSubject) {
-            this.attributes.valuesSubject = this.attributes.valueSubject
-        }
-        if (atts.language) {
-            const index = this.languages.indexOf(atts.language)
-            if (index > -1) {
-                // remove preferred language from the list of languages
-                this.languages.splice(index, 1)
-            }
-            // now prepend preferred language at start of the list of languages
-            this.languages.unshift(atts.language)
-        }
-        if (atts.valuesGraph) {
-            this.valuesGraphId = DataFactory.namedNode(atts.valuesGraph)
-        }
-    }
-
-    static dataAttributes(): Array<string> {
-        const atts = new ElementAttributes()
-        return Object.keys(atts).map(key => {
-            // convert camelcase key to kebap case
-            key = key.replace(/[A-Z]/g, m => "-" + m.toLowerCase());
-            return 'data-' + key
-        })
-    }
-
-    get store() {
-        return this._store
-    }
-
-    set store(store: Store) {
-        this._store = store
-        this.lists = extractLists(store, { ignoreErrors: true })
-        this.groups = []
-        store.forSubjects(subject => {
-            this.groups.push(subject.id)
-        }, RDF_PREDICATE_TYPE, `${PREFIX_SHACL}PropertyGroup`, null)
-    }
-}

package/src/constants.ts

@@ -1,30 +0,0 @@
-import { DataFactory } from "n3"
-
-export const PREFIX_SHACL = 'http://www.w3.org/ns/shacl#'
-export const PREFIX_DASH = 'http://datashapes.org/dash#'
-export const PREFIX_XSD = 'http://www.w3.org/2001/XMLSchema#'
-export const PREFIX_RDF = 'http://www.w3.org/1999/02/22-rdf-syntax-ns#'
-export const PREFIX_RDFS = 'http://www.w3.org/2000/01/rdf-schema#'
-export const PREFIX_SKOS = 'http://www.w3.org/2004/02/skos/core#'
-export const PREFIX_OWL = 'http://www.w3.org/2002/07/owl#'
-export const PREFIX_OA = 'http://www.w3.org/ns/oa#'
-export const PREFIX_DCTERMS = 'http://purl.org/dc/terms/'
-export const PREFIX_FOAF = 'http://xmlns.com/foaf/0.1/'
-
-export const SHAPES_GRAPH = DataFactory.namedNode('loaded-shapes')
-export const DATA_GRAPH = DataFactory.namedNode('loaded-data')
-
-export const RDF_PREDICATE_TYPE = DataFactory.namedNode(PREFIX_RDF + 'type')
-export const DCTERMS_PREDICATE_CONFORMS_TO = DataFactory.namedNode(PREFIX_DCTERMS + 'conformsTo')
-export const RDFS_PREDICATE_SUBCLASS_OF = DataFactory.namedNode(PREFIX_RDFS + 'subClassOf')
-export const OWL_PREDICATE_IMPORTS = DataFactory.namedNode(PREFIX_OWL + 'imports')
-export const SKOS_PREDICATE_BROADER = DataFactory.namedNode(PREFIX_SKOS + 'broader')
-export const SKOS_PREDICATE_NARROWER = DataFactory.namedNode(PREFIX_SKOS + 'narrower')
-export const SHACL_OBJECT_NODE_SHAPE = DataFactory.namedNode(PREFIX_SHACL + 'NodeShape')
-export const SHACL_OBJECT_IRI = DataFactory.namedNode(PREFIX_SHACL + 'IRI')
-export const SHACL_PREDICATE_PROPERTY = DataFactory.namedNode(PREFIX_SHACL + 'property')
-export const SHACL_PREDICATE_CLASS = DataFactory.namedNode(PREFIX_SHACL + 'class')
-export const SHACL_PREDICATE_NODE = DataFactory.namedNode(PREFIX_SHACL + 'node')
-export const SHACL_PREDICATE_TARGET_CLASS = DataFactory.namedNode(PREFIX_SHACL + 'targetClass')
-export const SHACL_PREDICATE_NODE_KIND = DataFactory.namedNode(PREFIX_SHACL + 'nodeKind')
-export const XSD_DATATYPE_STRING =  DataFactory.namedNode(PREFIX_XSD + 'string')

package/src/constraints.ts

@@ -1,149 +0,0 @@
-import { BlankNode, Literal, NamedNode, Quad } from 'n3'
-import { Term } from '@rdfjs/types'
-import { ShaclNode } from "./node"
-import { ShaclProperty, createPropertyInstance } from "./property"
-import { Config } from './config'
-import { PREFIX_SHACL, RDF_PREDICATE_TYPE, SHACL_PREDICATE_CLASS, SHACL_PREDICATE_TARGET_CLASS, SHACL_PREDICATE_NODE_KIND, SHACL_OBJECT_IRI, SHACL_PREDICATE_PROPERTY } from './constants'
-import { findLabel, removePrefixes } from './util'
-import { Editor, InputListEntry } from './theme'
-
-
-export function createShaclOrConstraint(options: Term[], context: ShaclNode | ShaclProperty, config: Config): HTMLElement {
-    const constraintElement = document.createElement('div')
-    constraintElement.classList.add('shacl-or-constraint')
-
-    const optionElements: InputListEntry[] =  []
-
-    if (context instanceof ShaclNode) {
-        const properties: ShaclProperty[][] = []
-        // options can be shacl properties or blank nodes referring to (list of) properties
-        let optionsAreReferencedProperties = false
-        if (options.length) {
-            optionsAreReferencedProperties = config.store.countQuads(options[0], SHACL_PREDICATE_PROPERTY, null, null) > 0
-        }
-        for (let i = 0; i < options.length; i++) {
-            if (optionsAreReferencedProperties) {
-                const quads = config.store.getObjects(options[i] , SHACL_PREDICATE_PROPERTY, null)
-                // option can be single property or list of properties
-                const list: ShaclProperty[] = []
-                let combinedText = ''
-                for (const subject of quads) {
-                    const property = new ShaclProperty(subject as NamedNode | BlankNode, context, config)
-                    list.push(property)
-                    combinedText += (combinedText.length > 1 ? ' / ' : '') + property.template.label
-                }
-                properties.push(list)
-                optionElements.push({ label: combinedText, value: i.toString() })
-            } else {
-                const property = new ShaclProperty(options[i] as NamedNode | BlankNode, context, config)
-                properties.push([property])
-                optionElements.push({ label: property.template.label, value: i.toString() })
-            }
-        }
-        const editor = config.theme.createListEditor('Please choose', null, false, optionElements)
-        const select = editor.querySelector('.editor') as Editor
-        select.onchange = () => {
-            if (select.value) {
-                const selectedOptions = properties[parseInt(select.value)]
-                let lastAddedProperty: ShaclProperty
-                if (selectedOptions.length) {
-                    lastAddedProperty = selectedOptions[0]
-                    constraintElement.replaceWith(selectedOptions[0])
-                }
-                for (let i = 1; i < selectedOptions.length; i++) {
-                    lastAddedProperty!.after(selectedOptions[i])
-                    lastAddedProperty = selectedOptions[i]
-                }
-            }
-        }
-        constraintElement.appendChild(editor)
-    } else {
-        const values: Quad[][] = []
-        for (let i = 0; i < options.length; i++) {
-            const quads = config.store.getQuads(options[i], null, null, null)
-            if (quads.length) {
-                values.push(quads)
-                optionElements.push({ label: findLabel(quads, config.languages) || (removePrefixes(quads[0].predicate.value, config.prefixes) + ' = ' + removePrefixes(quads[0].object.value, config.prefixes)), value: i.toString() })
-            }
-        }
-        const editor = config.theme.createListEditor(context.template.label + '?', null, false, optionElements, context.template)
-        const select = editor.querySelector('.editor') as Editor
-        select.onchange = () => {
-            if (select.value) {
-                constraintElement.replaceWith(createPropertyInstance(context.template.clone().merge(values[parseInt(select.value)]), undefined, true))
-            }
-        }
-        constraintElement.appendChild(editor)
-    }
-
-    return constraintElement
-}
-
-export function resolveShaclOrConstraintOnProperty(subjects: Term[], value: Term, config: Config): Quad[] {
-    if (value instanceof Literal) {
-        // value is a literal, try to resolve sh:or/sh:xone by matching on given value datatype
-        const valueType = value.datatype
-        for (const subject of subjects) {
-            const options = config.store.getQuads(subject, null, null, null)
-            for (const quad of options) {
-                if (quad.predicate.value === `${PREFIX_SHACL}datatype` && quad.object.equals(valueType)) {
-                    return options
-                }
-            }
-        }
-    } else {
-        // value is a NamedNode or BlankNode, try to resolve sh:or/sh:xone by matching rdf:type of given value with sh:node or sh:class in data graph or shapes graph
-        const types = config.store.getObjects(value, RDF_PREDICATE_TYPE, null)
-        for (const subject of subjects) {
-            const options = config.store.getQuads(subject, null, null, null)
-            for (const quad of options) {
-                if (types.length > 0) {
-                    // try to find matching sh:node in sh:or/sh:xone values
-                    if (quad.predicate.value === `${PREFIX_SHACL}node`) {
-                        for (const type of types) {
-                            if (config.store.getQuads(quad.object, SHACL_PREDICATE_TARGET_CLASS, type, null).length > 0) {
-                                return options
-                            }
-                        }
-                    }
-                    // try to find matching sh:class in sh:or/sh:xone values
-                    if (quad.predicate.equals(SHACL_PREDICATE_CLASS)) {
-                        for (const type of types) {
-                            if (quad.object.equals(type)) {
-                                return options
-                            }
-                        }
-                    }
-                } else if (quad.predicate.equals(SHACL_PREDICATE_NODE_KIND) && quad.object.equals(SHACL_OBJECT_IRI)) {
-                    // if sh:nodeKind is sh:IRI, just use that
-                    return options
-                }
-            }
-        }
-    }
-    console.error('couldn\'t resolve sh:or/sh:xone on property for value', value)
-    return []
-}
-
-export function resolveShaclOrConstraintOnNode(subjects: Term[], value: Term, config: Config): Term[] {
-    for (const subject of subjects) {
-        let subjectMatches = false
-        const propertySubjects = config.store.getObjects(subject, SHACL_PREDICATE_PROPERTY, null)
-        for (const propertySubject of propertySubjects) {
-            const paths = config.store.getObjects(propertySubject, `${PREFIX_SHACL}path`, null)
-            for (const path of paths) {
-                // this allows partial matches in data or shapes graph on properties
-                subjectMatches = config.store.countQuads(value, path, null, null) > 0
-                if (subjectMatches) {
-                    break
-                }
-            }
-        }
-        if (subjectMatches) {
-            return propertySubjects
-        }
-    }
-
-    console.error('couldn\'t resolve sh:or/sh:xone on node for value', value)
-    return []
-}

package/src/exports.ts

@@ -1,7 +0,0 @@
-export type { InputListEntry, Editor } from './theme'
-export { Theme } from './theme'
-export { Loader } from './loader'
-export { Config } from './config'
-export { Plugin, registerPlugin } from './plugin'
-export { ShaclPropertyTemplate } from './property-template'
-export { findLabel } from './util'

package/src/form-bootstrap.ts

@@ -1,12 +0,0 @@
-import { ShaclForm as FormBase } from "./form"
-import { BootstrapTheme } from "./themes/bootstrap"
-
-export * from './exports'
-
-export class ShaclForm extends FormBase {
-    constructor() {
-        super(new BootstrapTheme())
-    }
-}
-
-window.customElements.define('shacl-form', ShaclForm)

package/src/form-default.ts

@@ -1,12 +0,0 @@
-import { ShaclForm as FormBase } from "./form"
-import { DefaultTheme } from "./themes/default"
-
-export * from './exports'
-
-export class ShaclForm extends FormBase {
-    constructor() {
-        super(new DefaultTheme())
-    }
-}
-
-window.customElements.define('shacl-form', ShaclForm)

package/src/form-material.ts

@@ -1,12 +0,0 @@
-import { ShaclForm as FormBase } from "./form"
-import { MaterialTheme } from "./themes/material"
-
-export * from './exports'
-
-export class ShaclForm extends FormBase {
-    constructor() {
-        super(new MaterialTheme())
-    }
-}
-
-window.customElements.define('shacl-form', ShaclForm)