@ulb-darmstadt/shacl-form 1.6.3 → 1.6.4

package/dist/util.d.ts

@@ -1,4 +1,4 @@
-import { NamedNode, Prefixes, Quad, Store } from 'n3';
+import { Literal, NamedNode, Prefixes, Quad, Store } from 'n3';
 import { Term } from '@rdfjs/types';
 import { InputListEntry } from './theme';
 import { ShaclPropertyTemplate } from './property-template';
@@ -10,3 +10,4 @@ export declare function createInputListEntries(subjects: Term[], shapesGraph: St
 export declare function removePrefixes(id: string, prefixes: Prefixes): string;
 export declare function findInstancesOf(clazz: NamedNode, template: ShaclPropertyTemplate, indent?: number): InputListEntry[];
 export declare function isURL(input: string): boolean;
+export declare function prioritizeByLanguage(languages: string[], text1?: Literal, text2?: Literal): Literal | undefined;

package/package.json

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

package/src/config.ts

@@ -49,10 +49,10 @@ export class Config {
         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, lang.substring(0, 2)]
+                return [lang.toLocaleLowerCase(), lang.substring(0, 2)]
             } 
             return lang
-        }))]
+        })), ''] // <-- append empty string to accept RDF literals with no language
     }
  
     updateAttributes(elem: HTMLElement) {

package/src/property-template.ts

@@ -2,12 +2,12 @@ import { Literal, NamedNode, Quad, DataFactory } from 'n3'
 import { Term } from '@rdfjs/types'
 import { OWL_PREDICATE_IMPORTS, PREFIX_DASH, PREFIX_OA, PREFIX_RDF, PREFIX_SHACL, SHACL_PREDICATE_CLASS, SHACL_PREDICATE_TARGET_CLASS } from './constants'
 import { Config } from './config'
-import { findLabel, removePrefixes } from './util'
+import { findLabel, prioritizeByLanguage, removePrefixes } from './util'
 import { ShaclNode } from './node'
 
 const mappers: Record<string, (template: ShaclPropertyTemplate, term: Term) => void> = {
-    [`${PREFIX_SHACL}name`]:         (template, term) => { const literal = term as Literal; if (!template.name || literal.language === template.config.attributes.language) { template.name = literal } },
-    [`${PREFIX_SHACL}description`]:  (template, term) => { const literal = term as Literal; if (!template.description || literal.language === template.config.attributes.language) { template.description = literal } },
+    [`${PREFIX_SHACL}name`]:         (template, term) => { const literal = term as Literal; template.name = prioritizeByLanguage(template.config.languages, template.name, literal) },
+    [`${PREFIX_SHACL}description`]:  (template, term) => { const literal = term as Literal; template.description = prioritizeByLanguage(template.config.languages, template.description, literal) },
     [`${PREFIX_SHACL}path`]:         (template, term) => { template.path = term.value },
     [`${PREFIX_SHACL}node`]:         (template, term) => { template.node = term as NamedNode },
     [`${PREFIX_SHACL}datatype`]:     (template, term) => { template.datatype = term as NamedNode },

package/src/themes/material.css

@@ -3,5 +3,12 @@
     --mdui-color-primary-dark: var(--mdui-color-primary-dark);
     --mdui-color-background-light: var(--mdui-color-background-light);
 }
+/* this prevents hiding the date picker icon and number controls */
+mdui-text-field::part(input) {
+    clip-path: none;
+    appearance: inherit;
+}
 form.mode-edit { --label-width: 0em; }
 .property-instance { margin-bottom:14px; }
+.mode-edit .property-instance *[required]::part(icon) { align-self: flex-start; padding-top: 0.7em; }
+.mode-edit .property-instance *[required]::part(icon)::before { color: red; content: '\2736'; font-size: 0.6em; }

package/src/themes/material.ts

@@ -93,6 +93,7 @@ export class MaterialTheme extends Theme {
         editor.variant = 'outlined'
         editor.label = label
         editor.helper = template?.description?.value
+        editor.clearable = true
         // @ts-ignore
         const result = this.createDefaultTemplate('', null, required, editor, template)
         let addEmptyOption = true

package/src/util.ts

@@ -1,4 +1,4 @@
-import { NamedNode, Prefixes, Quad, Store } from 'n3'
+import { Literal, NamedNode, Prefixes, Quad, Store } from 'n3'
 import { OWL_OBJECT_NAMED_INDIVIDUAL, PREFIX_RDFS, PREFIX_SHACL, PREFIX_SKOS, RDFS_PREDICATE_SUBCLASS_OF, RDF_PREDICATE_TYPE, SHAPES_GRAPH, SKOS_PREDICATE_BROADER } from './constants'
 import { Term } from '@rdfjs/types'
 import { InputListEntry } from './theme'
@@ -114,3 +114,21 @@ export function isURL(input: string): boolean {
     }
     return url.protocol === 'http:' || url.protocol === 'https:'
 }
+
+export function prioritizeByLanguage(languages: string[], text1?: Literal, text2?: Literal): Literal | undefined {
+    if (text1 === undefined) {
+        return text2
+    }
+    if (text2 === undefined) {
+        return text1
+    }
+    const index1 = languages.indexOf(text1.language)
+    if (index1 < 0) {
+        return text2
+    }
+    const index2 = languages.indexOf(text2.language)
+    if (index2 < 0) {
+        return text1
+    }
+    return index2 > index1 ? text1 : text2
+}