├── .gitignore ├── .github └── workflows │ └── build.yaml ├── meetings.ics ├── index.bs ├── README.md └── shaclui.ttl /.gitignore: -------------------------------------------------------------------------------- 1 | public/ 2 | -------------------------------------------------------------------------------- /.github/workflows/build.yaml: -------------------------------------------------------------------------------- 1 | name: Build HTML and publish it to GitHub Pages 2 | 3 | on: 4 | push: 5 | branches: 6 | - main 7 | 8 | jobs: 9 | build: 10 | runs-on: ubuntu-latest 11 | steps: 12 | - uses: actions/checkout@v3 13 | - uses: actions/setup-python@v3 14 | with: 15 | python-version: '3.10' 16 | - run: python3 -m pip install --upgrade pip 17 | - run: python3 -m pip install --upgrade bikeshed && bikeshed update 18 | - run: mkdir public 19 | - run: bikeshed spec index.bs public/index.html 20 | - uses: peaceiris/actions-gh-pages@v3 21 | with: 22 | github_token: ${{ secrets.GITHUB_TOKEN }} 23 | publish_dir: ./public 24 | -------------------------------------------------------------------------------- /meetings.ics: -------------------------------------------------------------------------------- 1 | BEGIN:VCALENDAR 2 | PRODID:-//Mozilla.org/NONSGML Mozilla Calendar V1.1//EN 3 | VERSION:2.0 4 | BEGIN:VTIMEZONE 5 | TZID:Europe/Berlin 6 | BEGIN:DAYLIGHT 7 | TZOFFSETFROM:+0100 8 | TZOFFSETTO:+0200 9 | TZNAME:CEST 10 | DTSTART:19700329T020000 11 | RRULE:FREQ=YEARLY;BYMONTH=3;BYDAY=-1SU 12 | END:DAYLIGHT 13 | BEGIN:STANDARD 14 | TZOFFSETFROM:+0200 15 | TZOFFSETTO:+0100 16 | TZNAME:CET 17 | DTSTART:19701025T030000 18 | RRULE:FREQ=YEARLY;BYMONTH=10;BYDAY=-1SU 19 | END:STANDARD 20 | END:VTIMEZONE 21 | BEGIN:VEVENT 22 | CREATED:20230806T194801Z 23 | LAST-MODIFIED:20230806T212116Z 24 | DTSTAMP:20230806T212116Z 25 | UID:9903894d-1ebd-4149-b195-18cfbc86e217 26 | SUMMARY:RDF/JS SHACL-UI call 27 | RRULE:FREQ=WEEKLY;INTERVAL=2 28 | DTSTART;TZID=Europe/Berlin:20230809T110000 29 | DTEND;TZID=Europe/Berlin:20230809T120000 30 | TRANSP:OPAQUE 31 | LOCATION:https://meet.jit.si/rdfjs 32 | SEQUENCE:1 33 | X-MOZ-GENERATION:1 34 | END:VEVENT 35 | END:VCALENDAR 36 | 37 | -------------------------------------------------------------------------------- /index.bs: -------------------------------------------------------------------------------- 1 |
 2 | Title: RDF/JS: SHACL-UI specification
 3 | Shortname: shacl-ui
 4 | Level: 1
 5 | Status: w3c/CG-DRAFT
 6 | Group: RDF JavaScript Libraries Community Group
 7 | Repository: rdfjs/shacl-ui
 8 | URL: https://github.io/rdfjs/shacl-ui/
 9 | Editor: Thomas Bergwinkl, https://www.bergnet.org/
10 | Abstract:
11 |   This specification introduces an ontology that extends SHACL to define shape-driven UI components and layouts.
12 | Complain About: accidental-2119 yes, missing-example-ids yes
13 | Markup Shorthands: markdown yes, css no
14 | 
15 | 16 | # Introduction # {#intro} 17 | 18 | *This section is non-normative* 19 | 20 | The objective is to enhance the SHACL ontology to cater specifically to the UI use cases for application development and data exploration. 21 | It covers viewing, editing and filtering RDF data. 22 | Interfaces for reusable UI components should be established. 23 | To achieve this, we aim for implementations to rely on the SHACL ontology and the UI extension, enabling them to select UI components and generate layouts. 24 | The foundation for this will be the existing DASH ontology. 25 | The defined interfaces will enable seamless communication between implementations and UI components, enabling efficient viewing, editing or filtering of RDF data. 26 | Whenever feasible, we will utilize other RDF/JS specifications. 27 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Scope 2 | 3 | The RDF/JS SHACL-UI Task Force is a focus group of the RDF/JS Community Group. 4 | 5 | The objective is to enhance the SHACL ontology to cater specifically to the UI use cases for application development and data exploration. 6 | It covers viewing, editing and filtering RDF data. 7 | Interfaces for reusable UI components should be established. 8 | To achieve this, we aim for implementations to rely on the SHACL ontology and the UI extension, enabling them to select UI components and generate layouts. 9 | The foundation for this will be the existing [DASH](https://datashapes.org/) ontology. 10 | The defined interfaces will enable seamless communication between implementations and UI components, enabling efficient viewing, editing or filtering of RDF data. 11 | Whenever feasible, we will utilize other RDF/JS specifications. 12 | 13 | Currently, the SHACL-UI Task Force does not address matters regarding loading shapes or the integration of APIs such as GraphQL, LDP, or Hydra. 14 | Interaction with other data is specified only in SPARQL since it's possible to rely on existing SHACL features. 15 | If there is sufficient interest within the group, the topic may be covered at a later stage after the ontology extension and component interfaces have reached a certain stability. 16 | 17 | # Meetings 18 | 19 | We have biweekly meetings every even calendar week on Wednesday at 9:00 UTC, 11:00 CET. 20 | 21 | See the [iCalendar file](meetings.ics) for more details. 22 | 23 | # Processes 24 | 25 | - Pull requests will be merged one week after the last discussion is finished. 26 | - Pull requests will be merged after two approvals from editors. 27 | - Issues with votes must have a deadline. 28 | -------------------------------------------------------------------------------- /shaclui.ttl: -------------------------------------------------------------------------------- 1 | # baseURI: https://rdf.js.org/shacl-ui 2 | 3 | @prefix owl: . 4 | @prefix rdf: . 5 | @prefix rdfs: . 6 | @prefix sh: . 7 | @prefix shui: . 8 | @prefix xsd: . 9 | 10 | 11 | a owl:Ontology ; 12 | rdfs:label "SHACL-UI Vocabulary" ; 13 | owl:imports sh: ; 14 | sh:declare [ 15 | sh:namespace "http://www.w3.org/1999/02/22-rdf-syntax-ns#"^^xsd:anyURI ; 16 | sh:prefix "rdf" ; 17 | ] ; 18 | sh:declare [ 19 | sh:namespace "http://www.w3.org/2000/01/rdf-schema#"^^xsd:anyURI ; 20 | sh:prefix "rdfs" ; 21 | ] ; 22 | sh:declare [ 23 | sh:namespace "http://www.w3.org/2001/XMLSchema#"^^xsd:anyURI ; 24 | sh:prefix "xsd" ; 25 | ] ; 26 | sh:declare [ 27 | sh:namespace "http://www.w3.org/2002/07/owl#"^^xsd:anyURI ; 28 | sh:prefix "owl" ; 29 | ] ; 30 | sh:declare [ 31 | sh:namespace "http://www.w3.org/ns/shacl#"^^xsd:anyURI ; 32 | sh:prefix "sh" ; 33 | ] ; 34 | sh:declare [ 35 | sh:namespace "https://rdf.js.org/shacl-ui#"^^xsd:anyURI ; 36 | sh:prefix "shui" ; 37 | ] ; 38 | . 39 | shui:AutoCompleteEditor 40 | a shui:SingleEditor ; 41 | rdfs:comment "An auto-complete field to enter the label of instances of a class. This is the fallback editor for any URI resource if no other editors are more suitable." ; 42 | rdfs:label "Auto-complete editor" ; 43 | . 44 | shui:BlankNodeViewer 45 | a shui:SingleViewer ; 46 | rdfs:comment "A Viewer for blank nodes, rendering as the label of the blank node." ; 47 | rdfs:label "Blank node viewer" ; 48 | . 49 | shui:BooleanSelectEditor 50 | a shui:SingleEditor ; 51 | rdfs:comment """An editor for boolean literals, rendering as a select box with values true and false. 52 | 53 | Also displays the current value (such as "1"^^xsd:boolean), but only allows to switch to true or false.""" ; 54 | rdfs:label "Boolean select editor" ; 55 | . 56 | shui:DatePickerEditor 57 | a shui:SingleEditor ; 58 | rdfs:comment "An editor for xsd:date literals, offering a calendar-like date picker." ; 59 | rdfs:label "Date picker editor" ; 60 | . 61 | shui:DateTimePickerEditor 62 | a shui:SingleEditor ; 63 | rdfs:comment "An editor for xsd:dateTime literals, offering a calendar-like date picker and a time selector." ; 64 | rdfs:label "Date time picker editor" ; 65 | . 66 | shui:DetailsEditor 67 | a shui:SingleEditor ; 68 | rdfs:comment "An editor for blank nodes, displaying a nested form where the values of the linked resource can be edited directly on the \"parent\" form. Can be used if the property declares sh:nodeKind sh:BlankNode and also a sh:node constraint." ; 69 | rdfs:label "Details editor" ; 70 | . 71 | shui:DetailsViewer 72 | a shui:SingleViewer ; 73 | rdfs:comment "A Viewer for resources that shows the details of the value using its default view shape as a nested form-like display." ; 74 | rdfs:label "Details viewer" ; 75 | . 76 | shui:Editor 77 | a rdfs:Class ; 78 | rdfs:comment "The class of widgets for editing value nodes." ; 79 | rdfs:label "Editor" ; 80 | rdfs:subClassOf shui:Widget ; 81 | . 82 | shui:EnumSelectEditor 83 | a shui:SingleEditor ; 84 | rdfs:comment "A drop-down editor for enumerated values (typically based on sh:in lists)." ; 85 | rdfs:label "Enum select editor" ; 86 | . 87 | shui:HTMLViewer 88 | a shui:SingleViewer ; 89 | rdfs:comment "A Viewer for HTML encoded text from rdf:HTML literals, rendering as parsed HTML DOM elements. Also displays the language if the HTML has a lang attribute on its root DOM element." ; 90 | rdfs:label "HTML viewer" ; 91 | . 92 | shui:HyperlinkViewer 93 | a shui:SingleViewer ; 94 | rdfs:comment """A Viewer for literals, rendering as a hyperlink to a URL. 95 | 96 | For literals it assumes the lexical form is the URL. 97 | 98 | This is often used as default viewer for xsd:anyURI literals. Unsupported for blank nodes.""" ; 99 | rdfs:label "Hyperlink viewer" ; 100 | . 101 | shui:ImageViewer 102 | a shui:SingleViewer ; 103 | rdfs:comment "A Viewer for URI values that are recognized as images by a browser, rendering as an image." ; 104 | rdfs:label "Image viewer" ; 105 | . 106 | shui:InlineViewer 107 | a shui:MultiViewer ; 108 | rdfs:comment "A multi-viewer that renders all values horizontally, in a more compact form that just a single value per row." ; 109 | rdfs:label "Inline viewer" ; 110 | . 111 | shui:InstancesSelectEditor 112 | a shui:SingleEditor ; 113 | rdfs:comment "A drop-down editor for all instances of the target class (based on sh:class of the property)." ; 114 | rdfs:label "Instances select editor" ; 115 | . 116 | shui:LabelViewer 117 | a shui:SingleViewer ; 118 | rdfs:comment "A Viewer for URI resources, rendering as a hyperlink to that URI based on the display label of the resource. Also includes other ways of interacting with the URI such as opening a nested summary display." ; 119 | rdfs:label "Label viewer" ; 120 | . 121 | shui:LangStringViewer 122 | a shui:SingleViewer ; 123 | rdfs:comment "A Viewer for literals with a language tag, rendering as the text plus a language indicator." ; 124 | rdfs:label "LangString viewer" ; 125 | . 126 | shui:LiteralViewer 127 | a shui:SingleViewer ; 128 | rdfs:comment "A simple viewer for literals, rendering the lexical form of the value." ; 129 | rdfs:label "Literal viewer" ; 130 | . 131 | shui:MultiEditor 132 | a rdfs:Class ; 133 | rdfs:comment "An editor for multiple/all value nodes at once." ; 134 | rdfs:label "Multi editor" ; 135 | rdfs:subClassOf shui:Editor ; 136 | . 137 | shui:MultiViewer 138 | a rdfs:Class ; 139 | rdfs:comment "A viewer for multiple/all values at once." ; 140 | rdfs:label "Multi viewer" ; 141 | rdfs:subClassOf shui:Viewer ; 142 | . 143 | shui:NoSuitableEditor 144 | a shui:SingleEditor ; 145 | rdfs:comment "An \"editor\" that simply informs the user that the values cannot be edited here, but for example through source code editing." ; 146 | rdfs:label "No suitable editor" ; 147 | . 148 | shui:NodeExpressionViewer 149 | a shui:SingleViewer ; 150 | rdfs:comment "A viewer for SHACL Node Expressions."^^rdf:HTML ; 151 | rdfs:label "Node expression viewer" ; 152 | . 153 | shui:PropertyAutoCompleteEditor 154 | a shui:SingleEditor ; 155 | rdfs:comment "An editor for properties that are either defined as instances of rdf:Property or used as IRI values of sh:path. The component uses auto-complete to find these properties by their rdfs:labels or sh:names." ; 156 | rdfs:label "Property auto-complete editor" ; 157 | . 158 | shui:PropertyLabelViewer 159 | a shui:SingleViewer ; 160 | rdfs:comment "A viewer for properties that renders a hyperlink using the display label or sh:name, allowing users to either navigate to the rdf:Property resource or the property shape definition. Should be used in conjunction with PropertyAutoCompleteEditor." ; 161 | rdfs:label "Property label viewer" ; 162 | . 163 | shui:RichTextEditor 164 | a shui:SingleEditor ; 165 | rdfs:comment "A rich text editor to enter the lexical value of a literal and a drop down to select language. The selected language is stored in the HTML lang attribute of the root node in the HTML DOM tree." ; 166 | rdfs:label "Rich text editor" ; 167 | . 168 | shui:SingleEditor 169 | a rdfs:Class ; 170 | rdfs:comment "An editor for individual value nodes." ; 171 | rdfs:label "Single editor" ; 172 | rdfs:subClassOf shui:Editor ; 173 | . 174 | shui:SingleViewer 175 | a rdfs:Class ; 176 | rdfs:comment "A viewer for a single value." ; 177 | rdfs:label "Single viewer" ; 178 | rdfs:subClassOf shui:Viewer ; 179 | . 180 | shui:SubClassEditor 181 | a shui:SingleEditor ; 182 | rdfs:comment "An editor for properties that declare a shui:rootClass. The editor allows selecting either the class itself or one of its subclasses." ; 183 | rdfs:label "Sub-Class editor" ; 184 | . 185 | shui:TextAreaEditor 186 | a shui:SingleEditor ; 187 | rdfs:comment "A multi-line text area to enter the value of a literal." ; 188 | rdfs:label "Text area editor" ; 189 | . 190 | shui:TextAreaWithLangEditor 191 | a shui:SingleEditor ; 192 | rdfs:comment "A multi-line text area to enter the value of a literal and a drop down to select a language." ; 193 | rdfs:label "Text area with lang editor" ; 194 | . 195 | shui:TextFieldEditor 196 | a shui:SingleEditor ; 197 | rdfs:comment """A simple input field to enter the value of a literal, without the ability to change language or datatype. 198 | 199 | This is the fallback editor for any literal if no other editors are more suitable.""" ; 200 | rdfs:label "Text field editor" ; 201 | . 202 | shui:TextFieldWithLangEditor 203 | a shui:SingleEditor ; 204 | rdfs:comment "A single-line input field to enter the value of a literal and a drop down to select language, which is mandatory unless xsd:string is among the permissible datatypes." ; 205 | rdfs:label "Text field with lang editor" ; 206 | . 207 | shui:URIEditor 208 | a shui:SingleEditor ; 209 | rdfs:comment "An input field to enter the URI of a resource, e.g. rdfs:seeAlso links or images." ; 210 | rdfs:label "URI editor" ; 211 | . 212 | shui:URIViewer 213 | a shui:SingleViewer ; 214 | rdfs:comment "A Viewer for URI resources, rendering as a hyperlink to that URI. Also includes other ways of interacting with the URI such as opening a nested summary display." ; 215 | rdfs:label "URI viewer" ; 216 | . 217 | shui:ValueTableViewer 218 | a shui:MultiViewer ; 219 | rdfs:comment "A viewer that renders all values of a given property as a table, with one value per row, and the columns defined by the shape that is the sh:node or sh:class of the property." ; 220 | rdfs:label "Value table viewer" ; 221 | . 222 | shui:Viewer 223 | a rdfs:Class ; 224 | rdfs:comment "The class of widgets for viewing value nodes." ; 225 | rdfs:label "Viewer" ; 226 | rdfs:subClassOf shui:Widget ; 227 | . 228 | shui:Widget 229 | a rdfs:Class ; 230 | rdfs:comment "Base class of user interface components that can be used to display or edit value nodes." ; 231 | rdfs:label "Widget" ; 232 | rdfs:subClassOf rdfs:Resource ; 233 | . 234 | shui:editor 235 | a rdf:Property ; 236 | rdfs:comment "Can be used to link a property shape with an editor, to state a preferred editing widget in user interfaces." ; 237 | rdfs:domain sh:PropertyShape ; 238 | rdfs:label "editor" ; 239 | rdfs:range shui:Editor ; 240 | . 241 | shui:viewer 242 | a rdf:Property ; 243 | rdfs:comment "Can be used to link a property shape with a viewer, to state a preferred viewing widget in user interfaces." ; 244 | rdfs:domain sh:PropertyShape ; 245 | rdfs:label "viewer" ; 246 | rdfs:range shui:Viewer ; 247 | . 248 | --------------------------------------------------------------------------------