@ulb-darmstadt/shacl-form 2.0.0-rc3 → 2.0.0-rc5
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/README.md +4 -12
- package/dist/bundle.js +34 -6
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -13,8 +13,8 @@ HTML5 web component for editing/viewing [RDF](https://www.w3.org/RDF/) data that
|
|
|
13
13
|
```html
|
|
14
14
|
<html>
|
|
15
15
|
<head>
|
|
16
|
-
<!-- load web component -->
|
|
17
|
-
<script src="https://cdn.jsdelivr.net/npm/@ulb-darmstadt/shacl-form/dist/
|
|
16
|
+
<!-- load bundled web component (or when developing your own app, just do "npm i @ulb-darmstadt/shacl-form") -->
|
|
17
|
+
<script src="https://cdn.jsdelivr.net/npm/@ulb-darmstadt/shacl-form/dist/bundle.js" type="module"></script>
|
|
18
18
|
</head>
|
|
19
19
|
<body>
|
|
20
20
|
<!--
|
|
@@ -95,7 +95,7 @@ Validates the form data against the SHACL shapes graph and displays validation r
|
|
|
95
95
|
```typescript
|
|
96
96
|
registerPlugin(plugin: Plugin)
|
|
97
97
|
```
|
|
98
|
-
Register a [plugin](./src/plugin.ts) to customize editing/viewing certain property values. Plugins handle specific RDF predicates or `xsd:datatype`s or both.
|
|
98
|
+
Register a [plugin](./src/plugin.ts) to customize editing/viewing certain property values. Plugins handle specific RDF predicates or `xsd:datatype`s or both. Example: [Leaflet](./src/plugins/leaflet.ts)
|
|
99
99
|
|
|
100
100
|
```typescript
|
|
101
101
|
setTheme(theme: Theme)
|
|
@@ -281,12 +281,4 @@ Apart from grouped properties, all properties having an `sh:node` predicate and
|
|
|
281
281
|
|
|
282
282
|
### Theming
|
|
283
283
|
|
|
284
|
-
`<shacl-form>`
|
|
285
|
-
|
|
286
|
-
Theme | Import statement
|
|
287
|
-
--- | ---
|
|
288
|
-
[Default](./src/themes/default.ts) (slightly customized default browser styles) | `import '@ulb-darmstadt/shacl-form/form-default.js'`
|
|
289
|
-
[Bootstrap](./src/themes/bootstrap.ts) [alpha status] | `import '@ulb-darmstadt/shacl-form/form-bootstrap.js'`
|
|
290
|
-
[Material Design](./src/themes/material.ts) [alpha status] | `import '@ulb-darmstadt/shacl-form/form-material.js'`
|
|
291
|
-
|
|
292
|
-
Custom themes can be employed by extending class [Theme](./src/theme.ts), then calling function `setTheme()` on the `<shacl-form>` element.
|
|
284
|
+
`<shacl-form>` has a built-in abstraction layer for theming, i.e. the look and feel of the form elements. If you would like to employ a different theme like e.g. `bootstrap` or `material design`, then extend class [Theme](./src/theme.ts) and call function `setTheme()` on the `<shacl-form>` element.
|
package/dist/bundle.js
CHANGED
|
@@ -91,7 +91,35 @@ a, a:visited { color: inherit; }
|
|
|
91
91
|
* @license
|
|
92
92
|
* Copyright 2017 Google LLC
|
|
93
93
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
94
|
-
*/const zl=globalThis;class fi extends Ri{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const n=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=Im(n,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return Fi}}fi._$litElement$=!0,fi.finalized=!0,zl.litElementHydrateSupport?.({LitElement:fi});const Nm=zl.litElementPolyfillSupport;Nm?.({LitElement:fi});(zl.litElementVersions??=[]).push("4.2.1");var Cf=i=>{throw TypeError(i)},Pf=(i,e,n)=>e.has(i)||Cf("Cannot "+n),jn=(i,e,n)=>(Pf(i,e,"read from private field"),n?n.call(i):e.get(i)),Am=(i,e,n)=>e.has(i)?Cf("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(i):e.set(i,n),Rm=(i,e,n,r)=>(Pf(i,e,"write to private field"),e.set(i,n),n)
|
|
94
|
+
*/const zl=globalThis;class fi extends Ri{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const n=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=Im(n,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return Fi}}fi._$litElement$=!0,fi.finalized=!0,zl.litElementHydrateSupport?.({LitElement:fi});const Nm=zl.litElementPolyfillSupport;Nm?.({LitElement:fi});(zl.litElementVersions??=[]).push("4.2.1");var Cf=i=>{throw TypeError(i)},Pf=(i,e,n)=>e.has(i)||Cf("Cannot "+n),jn=(i,e,n)=>(Pf(i,e,"read from private field"),n?n.call(i):e.get(i)),Am=(i,e,n)=>e.has(i)?Cf("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(i):e.set(i,n),Rm=(i,e,n,r)=>(Pf(i,e,"write to private field"),e.set(i,n),n);/**
|
|
95
|
+
* @license
|
|
96
|
+
* Copyright 2017 Google LLC
|
|
97
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
98
|
+
*/const An=i=>(e,n)=>{n!==void 0?n.addInitializer(()=>{customElements.define(i,e)}):customElements.define(i,e)};/**
|
|
99
|
+
* @license
|
|
100
|
+
* Copyright 2019 Google LLC
|
|
101
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
102
|
+
*/const Ls=globalThis,Ul=Ls.ShadowRoot&&(Ls.ShadyCSS===void 0||Ls.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,kf=Symbol(),Zc=new WeakMap;let Cm=class{constructor(i,e,n){if(this._$cssResult$=!0,n!==kf)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=i,this.t=e}get styleSheet(){let i=this.o;const e=this.t;if(Ul&&i===void 0){const n=e!==void 0&&e.length===1;n&&(i=Zc.get(e)),i===void 0&&((this.o=i=new CSSStyleSheet).replaceSync(this.cssText),n&&Zc.set(e,i))}return i}toString(){return this.cssText}};const Pm=i=>new Cm(typeof i=="string"?i:i+"",void 0,kf),km=(i,e)=>{if(Ul)i.adoptedStyleSheets=e.map(n=>n instanceof CSSStyleSheet?n:n.styleSheet);else for(const n of e){const r=document.createElement("style"),o=Ls.litNonce;o!==void 0&&r.setAttribute("nonce",o),r.textContent=n.cssText,i.appendChild(r)}},Xc=Ul?i=>i:i=>i instanceof CSSStyleSheet?(e=>{let n="";for(const r of e.cssRules)n+=r.cssText;return Pm(n)})(i):i;/**
|
|
103
|
+
* @license
|
|
104
|
+
* Copyright 2017 Google LLC
|
|
105
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
106
|
+
*/const{is:Mm,defineProperty:Dm,getOwnPropertyDescriptor:Om,getOwnPropertyNames:Fm,getOwnPropertySymbols:jm,getPrototypeOf:$m}=Object,Zs=globalThis,Qc=Zs.trustedTypes,Bm=Qc?Qc.emptyScript:"",qm=Zs.reactiveElementPolyfillSupport,jr=(i,e)=>i,Fs={toAttribute(i,e){switch(e){case Boolean:i=i?Bm:null;break;case Object:case Array:i=i==null?i:JSON.stringify(i)}return i},fromAttribute(i,e){let n=i;switch(e){case Boolean:n=i!==null;break;case Number:n=i===null?null:Number(i);break;case Object:case Array:try{n=JSON.parse(i)}catch{n=null}}return n}},Hl=(i,e)=>!Mm(i,e),Jc={attribute:!0,type:String,converter:Fs,reflect:!1,useDefault:!1,hasChanged:Hl};Symbol.metadata??=Symbol("metadata"),Zs.litPropertyMetadata??=new WeakMap;class fr extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??=[]).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,n=Jc){if(n.state&&(n.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((n=Object.create(n)).wrapped=!0),this.elementProperties.set(e,n),!n.noAccessor){const r=Symbol(),o=this.getPropertyDescriptor(e,r,n);o!==void 0&&Dm(this.prototype,e,o)}}static getPropertyDescriptor(e,n,r){const{get:o,set:a}=Om(this.prototype,e)??{get(){return this[n]},set(l){this[n]=l}};return{get:o,set(l){const u=o?.call(this);a?.call(this,l),this.requestUpdate(e,u,r)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??Jc}static _$Ei(){if(this.hasOwnProperty(jr("elementProperties")))return;const e=$m(this);e.finalize(),e.l!==void 0&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(jr("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(jr("properties"))){const n=this.properties,r=[...Fm(n),...jm(n)];for(const o of r)this.createProperty(o,n[o])}const e=this[Symbol.metadata];if(e!==null){const n=litPropertyMetadata.get(e);if(n!==void 0)for(const[r,o]of n)this.elementProperties.set(r,o)}this._$Eh=new Map;for(const[n,r]of this.elementProperties){const o=this._$Eu(n,r);o!==void 0&&this._$Eh.set(o,n)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){const n=[];if(Array.isArray(e)){const r=new Set(e.flat(1/0).reverse());for(const o of r)n.unshift(Xc(o))}else e!==void 0&&n.push(Xc(e));return n}static _$Eu(e,n){const r=n.attribute;return r===!1?void 0:typeof r=="string"?r:typeof e=="string"?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(e=>e(this))}addController(e){(this._$EO??=new Set).add(e),this.renderRoot!==void 0&&this.isConnected&&e.hostConnected?.()}removeController(e){this._$EO?.delete(e)}_$E_(){const e=new Map,n=this.constructor.elementProperties;for(const r of n.keys())this.hasOwnProperty(r)&&(e.set(r,this[r]),delete this[r]);e.size>0&&(this._$Ep=e)}createRenderRoot(){const e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return km(e,this.constructor.elementStyles),e}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(e=>e.hostConnected?.())}enableUpdating(e){}disconnectedCallback(){this._$EO?.forEach(e=>e.hostDisconnected?.())}attributeChangedCallback(e,n,r){this._$AK(e,r)}_$ET(e,n){const r=this.constructor.elementProperties.get(e),o=this.constructor._$Eu(e,r);if(o!==void 0&&r.reflect===!0){const a=(r.converter?.toAttribute!==void 0?r.converter:Fs).toAttribute(n,r.type);this._$Em=e,a==null?this.removeAttribute(o):this.setAttribute(o,a),this._$Em=null}}_$AK(e,n){const r=this.constructor,o=r._$Eh.get(e);if(o!==void 0&&this._$Em!==o){const a=r.getPropertyOptions(o),l=typeof a.converter=="function"?{fromAttribute:a.converter}:a.converter?.fromAttribute!==void 0?a.converter:Fs;this._$Em=o,this[o]=l.fromAttribute(n,a.type)??this._$Ej?.get(o)??null,this._$Em=null}}requestUpdate(e,n,r){if(e!==void 0){const o=this.constructor,a=this[e];if(r??=o.getPropertyOptions(e),!((r.hasChanged??Hl)(a,n)||r.useDefault&&r.reflect&&a===this._$Ej?.get(e)&&!this.hasAttribute(o._$Eu(e,r))))return;this.C(e,n,r)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(e,n,{useDefault:r,reflect:o,wrapped:a},l){r&&!(this._$Ej??=new Map).has(e)&&(this._$Ej.set(e,l??n??this[e]),a!==!0||l!==void 0)||(this._$AL.has(e)||(this.hasUpdated||r||(n=void 0),this._$AL.set(e,n)),o===!0&&this._$Em!==e&&(this._$Eq??=new Set).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(n){Promise.reject(n)}const e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[o,a]of this._$Ep)this[o]=a;this._$Ep=void 0}const r=this.constructor.elementProperties;if(r.size>0)for(const[o,a]of r){const{wrapped:l}=a,u=this[o];l!==!0||this._$AL.has(o)||u===void 0||this.C(o,void 0,a,u)}}let e=!1;const n=this._$AL;try{e=this.shouldUpdate(n),e?(this.willUpdate(n),this._$EO?.forEach(r=>r.hostUpdate?.()),this.update(n)):this._$EM()}catch(r){throw e=!1,this._$EM(),r}e&&this._$AE(n)}willUpdate(e){}_$AE(e){this._$EO?.forEach(n=>n.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&=this._$Eq.forEach(n=>this._$ET(n,this[n])),this._$EM()}updated(e){}firstUpdated(e){}}fr.elementStyles=[],fr.shadowRootOptions={mode:"open"},fr[jr("elementProperties")]=new Map,fr[jr("finalized")]=new Map,qm?.({ReactiveElement:fr}),(Zs.reactiveElementVersions??=[]).push("2.1.0");/**
|
|
107
|
+
* @license
|
|
108
|
+
* Copyright 2017 Google LLC
|
|
109
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
110
|
+
*/const zm={attribute:!0,type:String,converter:Fs,reflect:!1,hasChanged:Hl},Um=(i=zm,e,n)=>{const{kind:r,metadata:o}=n;let a=globalThis.litPropertyMetadata.get(o);if(a===void 0&&globalThis.litPropertyMetadata.set(o,a=new Map),r==="setter"&&((i=Object.create(i)).wrapped=!0),a.set(n.name,i),r==="accessor"){const{name:l}=n;return{set(u){const f=e.get.call(this);e.set.call(this,u),this.requestUpdate(l,f,i)},init(u){return u!==void 0&&this.C(l,void 0,i,u),u}}}if(r==="setter"){const{name:l}=n;return function(u){const f=this[l];e.call(this,u),this.requestUpdate(l,f,i)}}throw Error("Unsupported decorator location: "+r)};function je(i){return(e,n)=>typeof n=="object"?Um(i,e,n):((r,o,a)=>{const l=o.hasOwnProperty(a);return o.constructor.createProperty(a,r),l?Object.getOwnPropertyDescriptor(o,a):void 0})(i,e,n)}/**
|
|
111
|
+
* @license
|
|
112
|
+
* Copyright 2017 Google LLC
|
|
113
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
114
|
+
*/function Vl(i){return je({...i,state:!0,attribute:!1})}/**
|
|
115
|
+
* @license
|
|
116
|
+
* Copyright 2017 Google LLC
|
|
117
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
118
|
+
*/const Hm=(i,e,n)=>(n.configurable=!0,n.enumerable=!0,Reflect.decorate&&typeof e!="object"&&Object.defineProperty(i,e,n),n);/**
|
|
119
|
+
* @license
|
|
120
|
+
* Copyright 2017 Google LLC
|
|
121
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
122
|
+
*/function Bt(i,e){return(n,r,o)=>{const a=l=>l.renderRoot?.querySelector(i)??null;return Hm(n,r,{get(){return a(this)}})}}var Vm=Object.defineProperty,Gn=(i,e,n,r)=>{for(var o=void 0,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=l(e,n,o)||o);return o&&Vm(e,n,o),o};const wl=class extends fi{constructor(){super(...arguments),this.dense=!1}};wl.shadowRootOptions={...fi.shadowRootOptions,delegatesFocus:!0},wl.styles=[on`
|
|
95
123
|
:host {
|
|
96
124
|
/* color-scheme: light dark; */
|
|
97
125
|
--rokit-primary-color-inner: var(--rokit-primary-color, #008877);
|
|
@@ -121,8 +149,8 @@ a, a:visited { color: inherit; }
|
|
|
121
149
|
`];let ln=xl;Gn([je()],ln.prototype,"name");Gn([je()],ln.prototype,"value");Gn([je({type:Boolean})],ln.prototype,"clearable");Gn([je({type:Boolean})],ln.prototype,"required");Gn([je({type:Boolean})],ln.prototype,"disabled");Gn([je()],ln.prototype,"label");Gn([je()],ln.prototype,"placeholder");function Gm(i){const e=parseFloat(i),n=i.match(/m?s/);let r=0;if(n)switch(n[0]){case"s":r=e*1e3;break;case"ms":r=e;break;default:r=0;break}return r}var Wm=Object.defineProperty,Zm=Object.getOwnPropertyDescriptor,Mf=(i,e,n,r)=>{for(var o=r>1?void 0:r?Zm(e,n):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=(r?l(e,n,o):l(o))||o);return r&&o&&Wm(e,n,o),o};let $i=class extends an{constructor(){super(...arguments),this.icon=!1}render(){return $t`<a part="link"><slot><slot></a>`}};$i.styles=[...an.styles,on`
|
|
122
150
|
:host { display: inline-flex; }
|
|
123
151
|
:host a { display: flex; min-width: 1em; height: 1em; padding: 0.5em; cursor: pointer; border-radius: 0.6em; align-items: center; justify-content: center; }
|
|
124
|
-
:host a
|
|
125
|
-
:host(:not([icon])) a {
|
|
152
|
+
:host(:not([icon])) a { background-color: var(--rokit-light-background-color-inner); box-shadow: 0 0 1px var(--rokit-shadow-color-inner); }
|
|
153
|
+
:host(:not([icon])) a:hover { box-shadow: 0 0 3px var(--rokit-shadow-color-inner); }
|
|
126
154
|
:host([icon]) a { border-radius: 1em; }
|
|
127
155
|
:host([icon]) a:hover { text-shadow: 0 0 1px var(--rokit-shadow-color-inner); background-color: var(--rokit-light-background-darker-color-inner); }
|
|
128
156
|
:host([dense]) { font-size: 0.65em; }
|
|
@@ -130,7 +158,7 @@ a, a:visited { color: inherit; }
|
|
|
130
158
|
:host(.caret) a:before { content: ''; width: var(--rokit-caret-size-inner); height: var(--rokit-caret-size-inner); border-style: none solid solid none; border-width: calc(0.3 * var(--rokit-caret-size-inner)); transform: translate(0.15em, -0.15em) rotate(45deg); transition: transform var(--rokit-transition-duration-inner) ease-out; margin-right: calc(0.5 * var(--rokit-caret-size-inner)); }
|
|
131
159
|
:host(.caret.down) a:before { transform: translate(0.15em, 0.15em) rotate(225deg); }
|
|
132
160
|
:host(.caret.right) a:before { transform: translate(0em, 0em) rotate(-45deg); }
|
|
133
|
-
`];Mf([je({type:Boolean,reflect:!0})],$i.prototype,"icon",2);$i=Mf([An("rokit-button")],$i);var Xm=Object.defineProperty,Qm=Object.getOwnPropertyDescriptor,Df=i=>{throw TypeError(i)},Rn=(i,e,n,r)=>{for(var o=r>1?void 0:r?Qm(e,n):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=(r?l(e,n,o):l(o))||o);return r&&o&&Xm(e,n,o),o},Jm=(i,e,n)=>e.has(i)||Df("Cannot "+n),Kc=(i,e,n)=>(Jm(i,e,"read from private field"),n?n.call(i):e.get(i)),Km=(i,e,n)=>e.has(i)?Df("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(i):e.set(i,n),Is;let Ct=class extends an{constructor(){super(...arguments),this.open=!1,this.disabled=!1,this.transitioning=!1,this.closedBeforeTransition=!1,Km(this,Is,new MutationObserver(()=>this.updateContentHeight())),this.onMouseDown=(()=>{this.closedBeforeTransition=!this.open&&!this.transitioning}).bind(this),this.onClick=(()=>{this.toggle(this.closedBeforeTransition,!0)}).bind(this)}firstUpdated(){this.transitionDuration=Gm(getComputedStyle(this).getPropertyValue("--rokit-transition-duration-inner")),new IntersectionObserver(i=>{i.length&&i[0].isIntersecting&&this.updateContentHeight()}).observe(this)}updated(i){i.has("transitioning")&&this.classList.toggle("transitioning",this.transitioning),i.has("disabled")&&(this.disabled?(this.header.removeEventListener("mousedown",this.onMouseDown),this.header.removeEventListener("click",this.onClick)):(this.header.addEventListener("mousedown",this.onMouseDown),this.header.addEventListener("click",this.onClick))),i.has("open")&&!this.disabled&&
|
|
161
|
+
`];Mf([je({type:Boolean,reflect:!0})],$i.prototype,"icon",2);$i=Mf([An("rokit-button")],$i);var Xm=Object.defineProperty,Qm=Object.getOwnPropertyDescriptor,Df=i=>{throw TypeError(i)},Rn=(i,e,n,r)=>{for(var o=r>1?void 0:r?Qm(e,n):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=(r?l(e,n,o):l(o))||o);return r&&o&&Xm(e,n,o),o},Jm=(i,e,n)=>e.has(i)||Df("Cannot "+n),Kc=(i,e,n)=>(Jm(i,e,"read from private field"),n?n.call(i):e.get(i)),Km=(i,e,n)=>e.has(i)?Df("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(i):e.set(i,n),Is;let Ct=class extends an{constructor(){super(...arguments),this.open=!1,this.disabled=!1,this.transitioning=!1,this.closedBeforeTransition=!1,Km(this,Is,new MutationObserver(()=>this.updateContentHeight())),this.onMouseDown=(()=>{this.closedBeforeTransition=!this.open&&!this.transitioning}).bind(this),this.onClick=(()=>{this.toggle(this.closedBeforeTransition,!0)}).bind(this)}firstUpdated(){this.transitionDuration=Gm(getComputedStyle(this).getPropertyValue("--rokit-transition-duration-inner")),new IntersectionObserver(i=>{i.length&&i[0].isIntersecting&&this.updateContentHeight()}).observe(this)}updated(i){i.has("transitioning")&&this.classList.toggle("transitioning",this.transitioning),i.has("disabled")&&(this.disabled?(this.header.removeEventListener("mousedown",this.onMouseDown),this.header.removeEventListener("click",this.onClick)):(this.header.addEventListener("mousedown",this.onMouseDown),this.header.addEventListener("click",this.onClick))),i.has("open")&&i.get("open")!==void 0&&!this.transitioning&&!this.disabled&&this.toggle(this.open)}updateContentHeight(){setTimeout(()=>{this.content.style.maxHeight=(this.maxHeight!==void 0?Math.min(this.maxHeight,this.content.scrollHeight):this.content.scrollHeight)+"px",this.classList.toggle("has-content",this.content.style.maxHeight!=="0px")})}onSlotChange(){const i=this.shadowRoot.querySelector("#content > slot").assignedNodes();Kc(this,Is).disconnect();for(const e of i)Kc(this,Is).observe(e,{subtree:!0,childList:!0,characterData:!0,attributes:!0});this.updateContentHeight()}toggle(i=!this.open,e=!1){this.disabled||(this.transitioning=!0,this.open=i,this.toggleButton.classList.toggle("down",i),setTimeout(()=>{this.transitioning=!1,this.open&&e&&this.content.scrollIntoView({block:"nearest"})},this.transitionDuration))}render(){return $t`
|
|
134
162
|
<header part="header">
|
|
135
163
|
<slot name="prefix" part="prefix"></slot>
|
|
136
164
|
<span class="label"><slot name="label" part="label">${this.label}</slot></span>
|
|
@@ -153,7 +181,7 @@ a, a:visited { color: inherit; }
|
|
|
153
181
|
.label { flex-grow: 1; overflow: hidden; }
|
|
154
182
|
#content { display: flex; transition: max-height var(--rokit-transition-duration-inner) ease-in-out; position: relative; scrollbar-width: thin; }
|
|
155
183
|
#toggle { margin-left: 3px; }
|
|
156
|
-
`];Rn([je({type:Boolean,reflect:!0})],Ct.prototype,"open",2);Rn([je()],Ct.prototype,"label",2);Rn([je({reflect:!0})],Ct.prototype,"maxHeight",2);Rn([je({type:Boolean})],Ct.prototype,"disabled",2);Rn([Bt("#content")],Ct.prototype,"content",2);Rn([Bt("#toggle")],Ct.prototype,"toggleButton",2);Rn([Bt("header")],Ct.prototype,"header",2);Rn([Vl()],Ct.prototype,"transitioning",2);Ct=Rn([An("rokit-collapsible")],Ct);var Ym=Object.defineProperty,e_=Object.getOwnPropertyDescriptor,Of=i=>{throw TypeError(i)},qt=(i,e,n,r)=>{for(var o=r>1?void 0:r?e_(e,n):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=(r?l(e,n,o):l(o))||o);return r&&o&&Ym(e,n,o),o},Ff=(i,e,n)=>e.has(i)||Of("Cannot "+n),t_=(i,e,n)=>(Ff(i,e,"read from private field"),e.get(i)),n_=(i,e,n)=>e.has(i)?Of("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(i):e.set(i,n),Yc=(i,e,n,r)=>(Ff(i,e,"write to private field"),e.set(i,n),n),Rr;let dt=class extends ln{constructor(){super(),this.type="text",this.readonly=!1,this.sticky=!1,this.minWidth=80,this.autoGrowLabelWidth=!1,n_(this,Rr,""),this.addEventListener("keydown",i=>{i.code==="Escape"&&this.blur()}),this.addEventListener("focus",()=>{this.classList.add("has-focus")}),this.addEventListener("blur",()=>{this.inputElement.scrollLeft=0,this.classList.remove("has-focus")})}firstUpdated(){Yc(this,Rr,this.value),this.inputElement.addEventListener("change",()=>{this.value=this.inputElement.value}),this.autoGrowLabelWidth&&new IntersectionObserver(i=>{i.length&&i[0].isIntersecting&&this.updateMinWidth()}).observe(this)}updateMinWidth(){const i=this.shadowRoot.querySelector(".wrapper");if(i){const e=this.shadowRoot?.querySelector("label")?.scrollWidth||0,n=this.minWidth>e?this.minWidth:e;i.style.minWidth=n>0?n+"px":""}}updated(i){i.has("label")&&(this.classList.toggle("has-label",this.label!==void 0),this.autoGrowLabelWidth&&this.updateMinWidth()),i.has("min")&&(this.inputElement.min=this.min||""),i.has("max")&&(this.inputElement.max=this.max||""),i.has("step")&&(this.inputElement.step=this.step||""),i.has("placeholder")&&(this.inputElement.placeholder=this.placeholder||""),i.has("pattern")&&(this.inputElement.pattern=this.pattern||""),i.has("minLength")&&(this.inputElement.minLength=this.minLength===void 0?-1:this.minLength),i.has("maxLength")&&(this.inputElement.maxLength=this.maxLength===void 0?-1:this.maxLength),i.has("value")&&(this.classList.toggle("has-value",this.value!==""),this.setFormValue(this.value),this.updateValidity(this.inputElement.validity,this.inputElement.validationMessage,this.inputElement),this.value!==t_(this,Rr)&&(Yc(this,Rr,this.value),this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))))}clear(){this.inputElement.value="",this.value="",this.blur()}renderInput(){return $t`<input id="input" part="input" size="1" name="${this.name}" type="${this.type}" autocomplete="off" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" .value="${this.type==="file"?"":this.value}">`}render(){return $t`
|
|
184
|
+
`];Rn([je({type:Boolean,reflect:!0})],Ct.prototype,"open",2);Rn([je()],Ct.prototype,"label",2);Rn([je({reflect:!0})],Ct.prototype,"maxHeight",2);Rn([je({type:Boolean})],Ct.prototype,"disabled",2);Rn([Bt("#content")],Ct.prototype,"content",2);Rn([Bt("#toggle")],Ct.prototype,"toggleButton",2);Rn([Bt("header")],Ct.prototype,"header",2);Rn([Vl()],Ct.prototype,"transitioning",2);Ct=Rn([An("rokit-collapsible")],Ct);var Ym=Object.defineProperty,e_=Object.getOwnPropertyDescriptor,Of=i=>{throw TypeError(i)},qt=(i,e,n,r)=>{for(var o=r>1?void 0:r?e_(e,n):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=(r?l(e,n,o):l(o))||o);return r&&o&&Ym(e,n,o),o},Ff=(i,e,n)=>e.has(i)||Of("Cannot "+n),t_=(i,e,n)=>(Ff(i,e,"read from private field"),e.get(i)),n_=(i,e,n)=>e.has(i)?Of("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(i):e.set(i,n),Yc=(i,e,n,r)=>(Ff(i,e,"write to private field"),e.set(i,n),n),Rr;let dt=class extends ln{constructor(){super(),this.type="text",this.readonly=!1,this.sticky=!1,this.minWidth=80,this.autoGrowLabelWidth=!1,n_(this,Rr,""),this.addEventListener("keydown",i=>{i.code==="Escape"&&this.blur()}),this.addEventListener("focus",()=>{this.classList.add("has-focus")}),this.addEventListener("blur",()=>{this.inputElement.scrollLeft=0,this.classList.remove("has-focus")}),this.addEventListener("click",i=>{i.stopPropagation()})}firstUpdated(){Yc(this,Rr,this.value),this.inputElement.addEventListener("change",()=>{this.value=this.inputElement.value}),this.autoGrowLabelWidth&&new IntersectionObserver(i=>{i.length&&i[0].isIntersecting&&this.updateMinWidth()}).observe(this)}updateMinWidth(){const i=this.shadowRoot.querySelector(".wrapper");if(i){const e=this.shadowRoot?.querySelector("label")?.scrollWidth||0,n=this.minWidth>e?this.minWidth:e;i.style.minWidth=n>0?n+"px":""}}updated(i){i.has("label")&&(this.classList.toggle("has-label",this.label!==void 0),this.autoGrowLabelWidth&&this.updateMinWidth()),i.has("min")&&(this.inputElement.min=this.min||""),i.has("max")&&(this.inputElement.max=this.max||""),i.has("step")&&(this.inputElement.step=this.step||""),i.has("placeholder")&&(this.inputElement.placeholder=this.placeholder||""),i.has("pattern")&&(this.inputElement.pattern=this.pattern||""),i.has("minLength")&&(this.inputElement.minLength=this.minLength===void 0?-1:this.minLength),i.has("maxLength")&&(this.inputElement.maxLength=this.maxLength===void 0?-1:this.maxLength),i.has("value")&&(this.classList.toggle("has-value",this.value!==""),this.setFormValue(this.value),this.updateValidity(this.inputElement.validity,this.inputElement.validationMessage,this.inputElement),this.value!==t_(this,Rr)&&(Yc(this,Rr,this.value),this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))))}clear(){this.inputElement.value="",this.value="",this.blur()}renderInput(){return $t`<input id="input" part="input" size="1" name="${this.name}" type="${this.type}" autocomplete="off" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" .value="${this.type==="file"?"":this.value}">`}render(){return $t`
|
|
157
185
|
<slot name="prefix" part="prefix"></slot>
|
|
158
186
|
<div class="wrapper">
|
|
159
187
|
<label for="input" part="label">${this.label}</label>
|
|
@@ -300,7 +328,7 @@ a, a:visited { color: inherit; }
|
|
|
300
328
|
.clear { justify-self: flex-end; }
|
|
301
329
|
main { flex-grow: 1; overflow: auto; }
|
|
302
330
|
`];Gr([je({type:Boolean,reflect:!0})],mi.prototype,"open",2);Gr([je({type:Boolean})],mi.prototype,"closable",2);Gr([je()],mi.prototype,"title",2);Gr([Bt("#dialog")],mi.prototype,"dialogElement",2);mi=Gr([An("rokit-dialog")],mi);var d_=Object.defineProperty,h_=Object.getOwnPropertyDescriptor,Gl=(i,e,n,r)=>{for(var o=r>1?void 0:r?h_(e,n):e,a=i.length-1,l;a>=0;a--)(l=i[a])&&(o=(r?l(e,n,o):l(o))||o);return r&&o&&d_(e,n,o),o};let zr=class extends an{updated(i){i.has("percent")&&(this.bar.style.width=this.percent?this.percent+"%":"")}render(){return $t`<div class="bar"></div>`}};zr.styles=[...an.styles,on`
|
|
303
|
-
:host { display: flex; }
|
|
331
|
+
:host { display: flex; background-color: var(--rokit-primary-color-transparent-inner); }
|
|
304
332
|
.bar { height: 3px; background-color: var(--rokit-primary-color-inner); }
|
|
305
333
|
:host(:not([percent])) .bar { width: 100%; --c: no-repeat linear-gradient(var(--rokit-primary-color-inner) 0 0); background: var(--c), var(--c); background-size: 60% 100%; animation: indeterminate 3s infinite; }
|
|
306
334
|
@keyframes indeterminate {
|
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-rc5",
|
|
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": "^
|
|
67
|
+
"@ro-kit/ui-widgets": "^1.0.2",
|
|
68
68
|
"jsonld": "^8.3.3",
|
|
69
69
|
"leaflet": "^1.9.4",
|
|
70
70
|
"leaflet-editable": "^1.3.2",
|