@ulb-darmstadt/shacl-form 1.1.6 → 1.1.7

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.
Files changed (9) hide show
  1. package/README.md +24 -12
  2. package/dist/constants.d.ts +2 -0
  3. package/dist/index-with-plugins.js +1 -1
  4. package/dist/index-with-plugins.js.LICENSE.txt +59 -0
  5. package/dist/index-with-plugins.js.map +1 -1
  6. package/dist/index.js +1 -1
  7. package/dist/index.js.LICENSE.txt +59 -0
  8. package/dist/util.d.ts +2 -2
  9. package/package.json +2 -1
package/README.md CHANGED
@@ -16,16 +16,28 @@ This library provides an HTML5 web component that renders [SHACL shapes](https:/
16
16
  <script src="https://cdn.jsdelivr.net/npm/@ulb-darmstadt/shacl-form/dist/index.js" type="module"></script>
17
17
  </head>
18
18
  <body>
19
- <shacl-form id="my-form" data-shapes="..."></shacl-form>
19
+ <!-- SHACL shapes can be defined on the attribute 'data-shapes' or can be loaded by setting attribute 'data-shapes-url' -->
20
+ <shacl-form data-shapes="
21
+ @prefix sh: <http://www.w3.org/ns/shacl#> .
22
+ @prefix ex: <http://example.org#> .
23
+
24
+ ex:ExampleShape
25
+ a sh:NodeShape ;
26
+ sh:property [
27
+ sh:name 'my value' ;
28
+ sh:path ex:exampleValue ;
29
+ sh:maxCount 3 ;
30
+ ] .
31
+ "></shacl-form>
20
32
 
21
33
  <script>
22
- const form = document.getElementById("my-form")
34
+ const form = document.querySelector("shacl-form")
23
35
  form.addEventListener('change', event => {
24
36
  // check if form validates according to the SHACL shapes
25
37
  if (event.detail?.valid) {
26
- // get data graph as RDF triples and log them to the browser console
27
- const data = form.serialize('application/ld+json')
28
- console.log('entered form data', data)
38
+ // get data graph as RDF triples (default format is 'text/turtle') and log them to the browser console
39
+ const triples = form.serialize()
40
+ console.log('entered form data', triples)
29
41
  // store the data somewhere, e.g. in a triple store
30
42
  }
31
43
  })
@@ -34,14 +46,14 @@ This library provides an HTML5 web component that renders [SHACL shapes](https:/
34
46
  </html>
35
47
  ```
36
48
 
37
- ### Element data attributes
49
+ ### Element attributes
38
50
  Attribute | Description
39
51
  ---|---
40
52
  data-shapes | SHACL shape definitions (e.g. a turtle string) to generate the form from
41
- data-shapes-url | When `data-shapes` is not set, the shapes graph is loaded from this URL
42
- data-shape-subject | Optional subject (id) of the shacl node shape to use as root for the form. If not set, the first found shacl node shape will be used
53
+ data-shapes-url | When `data-shapes` is not set, the SHACL shapes are loaded from this URL
54
+ data-shape-subject | Optional subject (id) of the SHACL node shape to use as root for the form. If not set, the first found node shape will be used
43
55
  data-values | RDF triples (e.g. a turtle string) to use as existing data values in the generated form
44
- data-values-url | When `data-values` is not set, the data graph is loaded from this URL
56
+ data-values-url | When `data-values` is not set, the data triples are loaded from this URL
45
57
  data-value-subject | The subject (id) of the generated data. If this is not set, a blank node with a new UUID will be used. If `data-values` or `data-values-url` is set, this id is also used to find existing data in the data graph to fill the form
46
58
  data-language | Language to use if shapes contain langStrings, e.g. in `sh:name` or `rdfs:label`
47
59
  data&#x2011;ignore&#x2011;owl&#x2011;imports | By default, `owl:imports` IRIs are fetched and the resulting triples added to the shapes graph. Set this attribute in order to disable this feature
@@ -52,7 +64,7 @@ data-submit-button | Whether to append a submit button to the form. The string v
52
64
  serialize(format?: string): string | []
53
65
  ```
54
66
 
55
- Serializes the form data as RDF triples. Supported formats: `text/turtle` (default), `application/ld+json`, `application/n-triples`, `application/n-quads`, `application/trig`. Format `application/ld+json` returns a JSON array, all other formats return a string.
67
+ Serializes the form data to RDF triples. Supported formats: `text/turtle` (default), `application/ld+json`, `application/n-triples`, `application/n-quads`, `application/trig`. Format `application/ld+json` returns a JSON array, all other formats return a string.
56
68
 
57
69
  ```typescript
58
70
  validate(ignoreEmptyValues: boolean): Promise<boolean>
@@ -62,10 +74,10 @@ Validates the form data against the SHACL shapes graph and displays validation r
62
74
  ```typescript
63
75
  registerPlugin(plugin: Plugin)
64
76
  ```
65
- WIP / TBD
77
+ Register a plugin to customize editing certain property values. Examples: [Mapbox](./src/plugins/mapbox.ts), [FixedList](./src/plugins/fixed-list.ts)
66
78
 
67
79
  ```typescript
68
80
  setClassInstanceProvider((className: string) => Promise<string>)
69
81
  ```
70
- Sets a callback function that is called when a SHACL property has a `sh:class` definition. The expected return value is a string (e.g. in format `text/turtle`) that contains RDF instance definitions of the given class name.
82
+ Sets a callback function that is called when a SHACL property has a `sh:class` definition. The expected return value is a string (e.g. in format `text/turtle`) that contains RDF instance definitions of the given class. Instances can be defined either with `rdf:type` predicates or with `owl:NamedIndividual` and `skos:broader`. Instances are parsed recursively so that class hierarchies are supported.
71
83
 
package/dist/constants.d.ts CHANGED
@@ -9,5 +9,7 @@ export declare const SHAPES_GRAPH: import("n3").NamedNode<"shapes">;
9
9
  export declare const OWL_IMPORTS: import("n3").NamedNode<string>;
10
10
  export declare const RDF_PREDICATE_TYPE: import("n3").NamedNode<string>;
11
11
  export declare const RDFS_PREDICATE_SUBCLASS_OF: import("n3").NamedNode<string>;
12
+ export declare const SKOS_PREDICATE_BROADER: import("n3").NamedNode<string>;
13
+ export declare const OWL_OBJECT_NAMED_INDIVIDUAL: import("n3").NamedNode<string>;
12
14
  export declare const SHACL_OBJECT_NODE_SHAPE: import("n3").NamedNode<string>;
13
15
  export declare const SHACL_PREDICATE_CLASS: import("n3").NamedNode<string>;