@pacem/pacem 1.0.0-bernoulli → 1.0.0-bessel

package/dist/browser/pacem-charts.min.js

@@ -1,7 +1,6 @@
 /*!
- * @pacem/pacem v1.0.0-bernoulli (https://js.pacem.it)
+ * @pacem/pacem v1.0.0-bessel (https://js.pacem.it)
  * Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
 !function(t,e){"use strict";var i=function(t,e,i,r){var s,a=arguments.length,n=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(t,e,i,r);else for(var l=t.length-1;l>=0;l--)(s=t[l])&&(n=(a<3?s(n):a>3?s(e,i,n):s(e,i))||n);return a>3&&n&&Object.defineProperty(e,i,n),n};const r=["keydown","keyup","click","dblclick","mouseover","mouseout","mouseenter","mouseleave","mousedown","mouseup","mousemove","contextmenu"],s=864e5,a="pacem:chart-series:dataitem",n="pacem:chart-series:series";function l(t,e,i){i??=Math.min(o(t,e),10);const r=(e-t)/i,s=Math.pow(10,Math.floor(Math.log10(r))),a=[1,2,5,10].map(t=>t*s).filter(t=>t>=r).reduce((t,e)=>Math.min(t,e),Number.POSITIVE_INFINITY);return{min:Math.floor(t/a)*a,max:Math.ceil(e/a)*a,round:a}}function o(t,e){const i=e-t;if(!(i>0))return 2;const r=Math.floor(Math.log10(i)),s=Math.pow(10,-r);if(0!=r)return o(t*s,e*s);const a=t=>{const e=Math.floor(10*Math.abs(t));return(e+10-e%10).roundoff()},n=a(i);let l=10;0!==t&&(l=a(Math.abs(e)));const c=h(l,n);return 1===c?n:Math.max(c,10-c)}function h(t,e){return t<=0?e:h(e%t,t)}class ChartEvent extends e.CustomUIEvent{constructor(t,e,i){super(t,e,i)}}let c=class PacemChartSeriesElement extends e.Components.PacemItemElement{get values(){return this.datasource}};i([e.Watch({emit:!0,converter:e.PropertyConverters.Json})],c.prototype,"datasource",void 0),i([e.Watch({emit:!0,converter:e.PropertyConverters.String})],c.prototype,"label",void 0),i([e.Watch({emit:!0,converter:e.PropertyConverters.String})],c.prototype,"color",void 0),i([e.Watch({emit:!0,converter:e.PropertyConverters.Boolean})],c.prototype,"datapoints",void 0),i([e.Watch()],c.prototype,"_uiElements",void 0),c=i([e.CustomElement({tagName:e.P+"-chart-series"})],c);const d="http://www.w3.org/2000/svg";class PacemSeriesChartElement extends e.Components.PacemItemsContainerElement{constructor(){super(),this._itemPropertyChangedCallback=t=>{const e=t.detail.propertyName;"datasource"!==e&&"label"!==e&&"datapoints"!==e&&"cssClass"!==e&&"color"!==e||this.draw()},this._series=[],this._resizeHandler=t=>{this._size=t.detail,this.draw()},this._broadcastHandler=t=>{const i=t.currentTarget,r=e.CustomElementUtils.getAttachedPropertyValue(i,a);if(e.Utils.isNull(r))return;const s=this.getAnchorPoint(i),l=new ChartEvent("item"+t.type,{detail:{dataItem:r,anchorPoint:s}},t),o=e.CustomElementUtils.getAttachedPropertyValue(i,n);o instanceof c&&o.dispatchEvent(l),this.dispatchEvent(l)},this._key=e.Utils.uniqueCode()}validate(t){return t instanceof c}register(t){return!!super.register(t)&&(t.addEventListener(e.PropertyChangeEventName,this._itemPropertyChangedCallback,!1),!0)}unregister(t){return!!super.unregister(t)&&(t.removeEventListener(e.PropertyChangeEventName,this._itemPropertyChangedCallback,!1),!0)}propertyChangedCallback(t,i,r,s){if(super.propertyChangedCallback(t,i,r,s),"target"===t){this._div!=i&&this._div&&this._div.remove(),this._div=null,this._body=null;const t=i;t&&(t.classList.remove(e.PCSS+"-chart-area"),t.innerHTML=""),this._ensureResizer(),this.draw()}else if(!s)switch(t){case"items":this._databindAndDrawDebounced();break;case"datasource":this._databind();case"yAxisDensity":case"xAxisDensity":case"xAxisType":case"yAxisMax":case"xAxisPosition":case"yAxisFormat":this.draw()}}_databindAndDrawDebounced(){cancelAnimationFrame(this._handle),this._handle=requestAnimationFrame(()=>{this._databind(),this.draw()})}_databind(){this._datasource=e.Utils.isNullOrEmpty(this.datasource)?this.items:this.datasource}disconnectedCallback(){this._div&&this._div.remove();const t=this._resizer;e.Utils.isNull(t)||(t.removeEventListener(e.Components.ResizeEventName,this._resizeHandler,!1),t.remove(),this._resizer=null),super.disconnectedCallback()}viewActivatedCallback(){super.viewActivatedCallback(),this._ensureResizer(),this._databind(),this.draw()}_ensureResizer(t=this.target||this._div){if(e.Utils.isNull(this._resizer)){const t=e.CustomElementUtils.findAncestorShell(this);(this._resizer=t.appendChild(new e.Components.PacemResizeElement)).addEventListener(e.Components.ResizeEventName,this._resizeHandler,!1)}this._resizer.target=t}get chartSize(){return this._size}get chartSeries(){return this._series}get chartBody(){return this._body}get chartGrid(){return this._grid}get chartMask(){return this._mask}get chartKey(){return this._key}get chartContainer(){return this._div}assignUiBehaviors(t,i,s,l){const o=!e.Utils.isNull(e.CustomElementUtils.getAttachedPropertyValue(t,a)),h=e.Utils.extend({series:i.label,color:l||i.color},s);e.CustomElementUtils.setAttachedPropertyValue(t,a,h),e.CustomElementUtils.setAttachedPropertyValue(t,n,i),o||r.forEach(e=>{t.addEventListener(e,this._broadcastHandler)})}disposeUiBehaviors(t){e.CustomElementUtils.deleteAttachedPropertyValue(t,a),e.CustomElementUtils.deleteAttachedPropertyValue(t,n),r.forEach(e=>{t.removeEventListener(e,this._broadcastHandler)})}ensureChartContainer(){if(e.Utils.isNull(this._div)){let t=this._div=this.target||document.createElement("div");t.classList.add(e.PCSS+"-chart-area"),t!=this.target&&this.parentElement.insertBefore(t,this)}return this._div}ensureChartBody(t,i,r){if(e.Utils.isNull(this._body)){let i=this._body=document.createElementNS(d,"svg");i.setAttribute("pacem",""),i.setAttribute("class",e.PCSS+"-"+t+"-chart"),i.setAttribute("preserveAspectRatio","xMinYMax slice");const r=this._grid=document.createElementNS(d,"svg");r.setAttribute("pacem",""),r.setAttribute("class","chart-grid");let s=document.createElementNS(d,"defs"),a=this._mask=document.createElementNS(d,"mask"),n=document.createElementNS(d,"rect");n.setAttribute("x","0"),n.setAttribute("y","0"),n.setAttribute("width","100%"),n.setAttribute("height","100%");let l=document.createElementNS(d,"rect");l.setAttribute("y","0"),l.setAttribute("width","100%"),l.setAttribute("fill","#fff"),a.id="gnrc_mask_"+this._key,a.appendChild(n),a.appendChild(l),s.appendChild(a),i.appendChild(s),i.appendChild(r),this._div.appendChild(i)}return this._body}chartDataItemToPoint(t,i){switch(this.xAxisType||"string"){case"number":return{x:parseFloat(t.label),y:t.value};case"date":return{x:e.Utils.parseDate(t.label).valueOf(),y:t.value};case"string":return{x:i.findIndex(e=>e.label==t.label),y:t.value};default:throw"Not supported."}}getVirtualGrid(t,i,r,a,n,o=this.xAxisType,h,c){const d=l(a,n,h),u=d.round;var m=[];for(let t=d.min;t<=d.max;t+=u)m.push(t.roundoff());let p=e.Utils.lang(this),v=null;const g=this.xAxisFormat;if(!e.Utils.isNullOrEmpty(g))switch(o){case"number":v=t=>Intl.NumberFormat(p,g).format(t);break;case"date":v=t=>Intl.DateTimeFormat(p,g).format(e.Utils.parseDate(t))}const y=function(t,i,r,a,n,l=10){const o="number"===i||"date"===i?a-r:Math.max(1,t.length-1);for(var h=[],c=1,d=l-1;d>1;d--)if(o%d===0){c=o/d;break}1===c&&o>l&&(c=o);const u="function"==typeof n?n:c>=s?t=>t.toLocaleDateString(n):t=>t.toLocaleTimeString(n),m="function"==typeof n?n:c<s?t=>t.toLocaleString(n):u,p="function"==typeof n?n:t=>t.toLocaleString(n);for(var v=0;v<=o;v+=c){let s;switch(i){case"string":if(v>=t.length)continue;s=t[v].label;break;case"number":s=p(r+v);break;case"date":s=(0==v?m:u)(e.Utils.parseDate(r+v));break;default:throw"Not supported."}h.push(s)}return h}(t,o,i,r,v??p,c);return{x:y,y:m}}wipeOut(t=this._series,e=0){for(var i=t.length-1;i>=e;i--)t[i].remove();t.splice(e)}buildLinearGradient(t,i=!1){const r=document.createElementNS(d,"linearGradient");r.id=this.chartKey+"_grad"+t+(i?"_inverted":""),i&&e.Utils.addClass(r,"bottom-up"),r.setAttribute("x1","0%"),r.setAttribute("x2","0%"),r.setAttribute("y1","0%"),r.setAttribute("y2","100%"),r.setAttribute("spreadMethod","pad");const s=document.createElementNS(d,"stop");s.setAttribute("offset","0%");const a=document.createElementNS(d,"stop");return a.setAttribute("offset","100%"),r.appendChild(s),r.appendChild(a),r}setGradientColor(t,e){for(let i=0;i<t.children.length;i++){const r=t.children.item(i);r instanceof SVGStopElement&&(r.style.stopColor=e)}}estimateYAxisLabelWidth(t){const e=this.formatYAxisLabel(t);return this.estimateLabelWidth(e)}estimateLabelWidth(t){const i=this._grid;if(e.Utils.isNull(i))throw new Error("Unable to estimate label without an underlying grid available.");const r=document.createElementNS(d,"text");r.textContent=t,i.appendChild(r);const s=e.Utils.offset(r);return r.remove(),s.width}formatYAxisLabel(t){const i=this.yAxisFormat;return e.Utils.isNullOrEmpty(i)?t.toString():Intl.NumberFormat(e.Utils.lang(this),i).format(t)}estimateXAxisLabelWidth(t){const e=this.formatXAxisLabel(t);return this.estimateLabelWidth(e)}formatXAxisLabel(t){const i=this.xAxisFormat,r=e.Utils.lang(this);switch(this.xAxisType){case"date":const s=e.Utils.Dates.parse(t);return e.Utils.isNullOrEmpty(i)?s.toLocaleString(r):Intl.DateTimeFormat(r,i).format(s);case"number":const a=t;return e.Utils.isNullOrEmpty(i)?a.toLocaleString(r):Intl.NumberFormat(r,i).format(a);default:return t}}draw(){this.drawSeries(this._datasource)}getAnchorPoint(t){const i=e.Utils.offset(t);return{x:i.left+.5*i.width,y:i.top+.5*i.height}}}i([e.Watch({converter:e.PropertyConverters.Element})],PacemSeriesChartElement.prototype,"target",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.String})],PacemSeriesChartElement.prototype,"xAxisType",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.String})],PacemSeriesChartElement.prototype,"xAxisPosition",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Json})],PacemSeriesChartElement.prototype,"datasource",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Number})],PacemSeriesChartElement.prototype,"yAxisDensity",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Number})],PacemSeriesChartElement.prototype,"xAxisDensity",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Number})],PacemSeriesChartElement.prototype,"yAxisMin",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Number})],PacemSeriesChartElement.prototype,"yAxisMax",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Json})],PacemSeriesChartElement.prototype,"yAxisFormat",void 0),i([e.Watch({emit:!1,converter:e.PropertyConverters.Json})],PacemSeriesChartElement.prototype,"xAxisFormat",void 0),i([e.Throttle(!0)],PacemSeriesChartElement.prototype,"draw",null);var u=function(t,e,i,r){var s,a=arguments.length,n=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(t,e,i,r);else for(var l=t.length-1;l>=0;l--)(s=t[l])&&(n=(a<3?s(n):a>3?s(e,i,n):s(e,i))||n);return a>3&&n&&Object.defineProperty(e,i,n),n};function m(t,i,r){let s=t,a=t;const n=e.Utils.isNull(i),l=e.Utils.isNull(r);if(!n||!l){const e=3;let o,h;n||(o=(t.y-i.y)/(t.x-i.x)),l||(h=(r.y-t.y)/(r.x-t.x));const c=((h||o||0)+(o||h||0))/2,d=n?0:(t.x-i.x)/e,u=l?0:(r.x-t.x)/e;s={x:t.x-d,y:t.y-d*c},a={x:t.x+u,y:t.y+u*c}}return{c0:s,c1:a}}const p=e.CustomElementUtils.getAttachedPropertyValue,v=e.CustomElementUtils.setAttachedPropertyValue;e.CustomElementUtils.deleteAttachedPropertyValue;const g="pacem:chart-series:area",y="http://www.w3.org/2000/svg";let f=class PacemChartElement extends PacemSeriesChartElement{constructor(){super(...arguments),this.#t=!1,this._enterHandler=t=>{this.#t=!0},this._leaveHandler=t=>{this.#t=!1},this._moveHandler=t=>{this.#t},this._chartFillSeries=[]}_getVirtualGrid(t,e,i,r,s,a=this.xAxisType,n,l){return super.getVirtualGrid(t,e,i,r,s,a,n,l)}_wipe(t=this.chartSeries,e=0){super.wipeOut(t,e)}viewActivatedCallback(){super.viewActivatedCallback(),this._setupBehavior()}disconnectedCallback(){this._dismantleBehavior(),super.disconnectedCallback()}propertyChangedCallback(t,e,i,r){switch(super.propertyChangedCallback(t,e,i,r),t){case"type":case"aspectRatio":this.draw()}}_setupBehavior(){this.addEventListener("mouseenter",this._enterHandler,!1),this.addEventListener("mouseleave",this._enterHandler,!1),this.addEventListener("mousemove",this._moveHandler,!1)}_dismantleBehavior(){this.removeEventListener("mouseenter",this._enterHandler,!1),this.removeEventListener("mouseleave",this._leaveHandler,!1),this.removeEventListener("mousemove",this._moveHandler,!1)}#t;_buildLinearGradient(t){return super.buildLinearGradient(t)}_setGradientColor(t,e){super.setGradientColor(t,e)}drawSeries(t){if(!this.isReady||e.Utils.isNull(this.chartSize))return;this.ensureChartContainer();const i=this.type||"line",r=24;var s=this.chartSize;if(s.height<=r||s.width<=r)return;if(e.Utils.isNullOrEmpty(t)||t.every(t=>e.Utils.isNullOrEmpty(t.values)))return void this._wipe();const a=this.ensureChartBody("line",s.width,s.height);this.log(e.Logging.LogLevel.Debug,`Drawing ${i} chart.`);const n=this.xAxisType||"string";let l=this.yAxisMin??Number.NaN,o=this.yAxisMax??Number.NaN,h=Number.NaN,c=Number.NaN,d=1;for(let i of t){let t=i.values;if(t&&t.length){let i=0;for(let r of t){let s=this.chartDataItemToPoint(r,t);e.Utils.isNull(this.yAxisMin)&&(l=isNaN(l)?s.y:Math.min(l,s.y)),e.Utils.isNull(this.yAxisMax)&&(o=isNaN(o)?s.y:Math.max(o,s.y)),0===i?h=isNaN(h)?s.x:Math.min(h,s.x):i===t.length-1&&(c=isNaN(c)?s.x:Math.max(c,s.x)),i++}}}const u=t.find(t=>!e.Utils.isNullOrEmpty(t.values)),f=this._getVirtualGrid(u.values,h,c,l,o,n,this.yAxisDensity,this.xAxisDensity),b=f.y[f.y.length-1],C=f.y[0];if(b===C)return;const x=f.y.reduce((t,e)=>Math.max(t,this.estimateYAxisLabelWidth(e)+12),r),A=.5*f.x.reduce((t,e)=>Math.max(t,this.estimateXAxisLabelWidth(e)),r),_=Math.max(A,x),E=A,w=s.width-_-E,S=s.height-48,N=S*(1-(b-C-(o-l))/(b-C)),P=S*(b-o)/(b-C);("number"!==n||"monometric"!==this.aspectRatio&&"logaritmic"!==this.aspectRatio)&&(d=w/N,a.setAttribute("height",s.height.toString()),a.setAttribute("width",s.width.toString())),a.setAttribute("viewBox",`0 0 ${s.width} ${s.height}`);let M=0;const U=100*d/(c-h),k=100/(o-l),$=2400/N,L=(t,e)=>{let i=this.chartDataItemToPoint(t,e);return i.y*=k,i.x=(i.x-h)*U,i},O=this.chartSeries,W=this._chartFillSeries,D=this.chartGrid,B="spline"===i||"splinearea"===i;for(let r of t){let t,s,n;if(O.length>M)t=O[M],s=W[M],n=s.firstElementChild.firstElementChild;else{t=document.createElementNS(y,"svg"),t.setAttribute("pacem",""),a.appendChild(t),s=document.createElementNS(y,"svg"),s.setAttribute("pacem",""),a.insertBefore(s,a.children.item(M+2));const e=document.createElementNS(y,"defs");e.appendChild(n=this._buildLinearGradient(M)),s.appendChild(e),s.appendChild(document.createElementNS(y,"path")),W.push(s),t.appendChild(document.createElementNS(y,"path")),O.push(t)}let o="chart-series";const h="area"===i||"splinearea"===i;e.Utils.isNullOrEmpty(r.className)||(o+=" "+r.className),[t,s].forEach(t=>{t.setAttribute("class",o),t.setAttribute("x",_.toString()),t.setAttribute("y",P.toString()),t.setAttribute("width",w.toString()),t.setAttribute("height",(N+48).toString())}),e.Utils.addClass(s,e.PCSS+"-inert");let c=s.children.item(1),d=t.firstElementChild;d.style.stroke=r.color,c.style.stroke=d.style.fill="none",this._setGradientColor(n,r.color),c.style.fill=`url(#${n.id})`,c.style.display=h?"":"none";let u="",f=r.values;if(f&&f.length){const i=(e,i,r,s,a)=>{const n=i+1;let l;t.children.length>n?l=t.children.item(n):(l=document.createElementNS(y,"line"),l.setAttribute("class","circle"),t.appendChild(l));const o=e.x.toString(),h=(-e.y).toString();l.setAttribute("x1",o),l.setAttribute("y1",h),l.setAttribute("x2",o),l.setAttribute("y2",h),l.style.stroke=a,this.assignUiBehaviors(l,r,s,a)},s=()=>{const e=r.datapoints?f.length+1:1;for(let r=t.children.length-1;r>=e;r--){var i=t.children.item(r);this.disposeUiBehaviors(i),i.remove()}};if(B){let t,s,a;for(let n=0;n<f.length;n++){const l=f[n];if(isNaN(l.value))continue;let o;s||(s=L(l,f)),B&&n<f.length-1&&(o=L(f[n+1],f));let h=p(r,g,0);h+=l.value,v(r,g,h);var H=m(s,t,o);u+=e.Utils.isNullOrEmpty(u)?`M${s.x},${-s.y} `:`C${a.x},${-a.y} ${H.c0.x},${-H.c0.y} ${s.x},${-s.y} `,r.datapoints&&i(s,n,r,l,r.color),t=s,s=o,a=H.c1}}else{let t=0;for(let s of f){if(isNaN(s.value))continue;const a=L(s,f);let n=p(r,g,0);n+=s.value,v(r,g,n),u+=e.Utils.isNullOrEmpty(u)?`M${a.x},${-a.y} `:`L${a.x},${-a.y} `,r.datapoints&&i(a,t,r,s,r.color),t++}}s()}d.setAttribute("d",u),c.setAttribute("d",u+`V${-l*k} H0 Z`),M++}this._wipe(W,M),this._wipe(O,M);const R=`0 ${-(o*k+$)} ${100*d} ${100+2*$}`;for(var T of O.concat(W))T.setAttribute("viewBox",R);let z,I=this.chartMask.children.item(1);if(I.setAttribute("x",(0).toString()),I.setAttribute("height",(s.height-r).toString()),D.setAttribute("viewBox",`0 0 ${s.width} ${s.height}`),f.x.length<=1||f.y.length<=1){for(let t=D.children.length-1;t>=0;t--)D.children.item(t).remove();return}D.children.length>0?z=D.children.item(0):(z=document.createElementNS(y,"path"),D.appendChild(z));let F=0,V=(t,e,i,r)=>{const s=t+1;let a;return D.children.length<=s?(a=document.createElementNS(y,"text"),D.appendChild(a)):a=D.children.item(s),a.textContent=r,a.setAttribute("x",e.toString()),a.setAttribute("y",i.toString()),a},G=`M${_},24 v${S}`,j=0;const Y=w/(f.x.length-1),q=S/(f.y.length-1);if("none"!==this.xAxisPosition)for(var J of f.x){const t=_+j*Y;if("top"===this.xAxisPosition){G+=` M${t},24 v-6`;let e=V(F++,t,0,J);e.setAttribute("text-anchor","middle"),e.setAttribute("alignment-baseline","hanging")}else{let e=S+r;G+=` M${t},${e} v6`,V(F++,t,e+r,J).setAttribute("text-anchor","middle")}j++}for(var X of(j=0,f.y)){const t=S+r-j*q,e=_-6;G+=` M${e},${t} H${w+_}`,V(F++,e-6,t,this.formatYAxisLabel(X)).setAttribute("text-anchor","end"),j++}z.setAttribute("d",G);for(let t=D.children.length-1;t>F;t--)D.children.item(t).remove()}};u([e.Watch({emit:!1,converter:e.PropertyConverters.String})],f.prototype,"type",void 0),u([e.Watch({converter:e.PropertyConverters.String})],f.prototype,"aspectRatio",void 0),f=u([e.CustomElement({tagName:e.P+"-chart"})],f);var b=function(t,e,i,r){var s,a=arguments.length,n=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(t,e,i,r);else for(var l=t.length-1;l>=0;l--)(s=t[l])&&(n=(a<3?s(n):a>3?s(e,i,n):s(e,i))||n);return a>3&&n&&Object.defineProperty(e,i,n),n};const C="http://www.w3.org/2000/svg";let x=class PacemColumnChartElement extends PacemSeriesChartElement{constructor(){super(...arguments),this.groupWidth=0}propertyChangedCallback(t,e,i,r){super.propertyChangedCallback(t,e,i,r),"type"!==t&&"groupWidth"!==t||this.draw()}_safen(t=this.groupWidth){return Math.min(1,Math.max(t||.75,0))}drawSeries(t){if(!this.isReady||e.Utils.isNull(this.chartSize))return;this.ensureChartContainer();const i=this.type||"cluster",r=24;var s=this.chartSize;if(s.height<=r||s.width<=r)return;if(e.Utils.isNullOrEmpty(t)||t.every(t=>e.Utils.isNullOrEmpty(t.values)))return void this.wipeOut();const a=this.ensureChartBody("column",s.width,s.height);this.log(e.Logging.LogLevel.Debug,`Drawing ${i} chart.`);const n=this.xAxisType||"string";let l=this.yAxisMin??0,o=this.yAxisMax??0,h=0,c=0,d=0,u=1;const m={negative:[],positive:[]};for(let i of t){let t=i.values;if(!e.Utils.isNullOrEmpty(t)){let i=0;for(let r of t){m.positive[i]=m.positive[i]||0,m.negative[i]=m.negative[i]||0;let s=this.chartDataItemToPoint(r,t);e.Utils.isNull(this.yAxisMin)&&(l=Math.min(l,s.y)),e.Utils.isNull(this.yAxisMax)&&(o=Math.max(o,s.y)),h=Math.min(h,s.x),c=Math.max(c,s.x),s.y>0?m.positive[i]+=s.y:s.y<0&&(m.negative[i]+=s.y),i++}d=Math.max(d,t.length)}}const p="stack"===i;p&&(e.Utils.isNull(this.yAxisMin)&&(l=Math.min.apply(null,m.negative)),e.Utils.isNull(this.yAxisMax)&&(o=Math.max.apply(null,m.positive))),0===c&&c===h&&(c=1);const v=(c-h)/d,g=.5*v,y=v*this._safen(this.groupWidth),f=.5*y,b=t.find(t=>!e.Utils.isNullOrEmpty(t.values)),x=this.getVirtualGrid(b.values,h-g,c+g,l,o,n,this.yAxisDensity,this.xAxisDensity),A=x.y[x.y.length-1],_=x.y[0];if(A===_)return;const E=x.y.reduce((t,e)=>Math.max(t,this.estimateYAxisLabelWidth(e)+12),r),w=s.width-E-r,S=s.height-48,N=S*(1-(A-_-(o-l))/(A-_)),P=S*(A-o)/(A-_);u=w/N,a.setAttribute("height",s.height.toString()),a.setAttribute("width",s.width.toString()),a.setAttribute("viewBox",`0 0 ${s.width} ${s.height}`);let M=0;const U=100*u/(c-h),k=100/(o-l),$=2400/N,L=this.chartSeries,O=this.chartGrid,W=(g-h)*U,D=(t,e)=>{const i=this.chartDataItemToPoint(t,e);return{x:W+2*i.x*W,y:i.y*k}};var B=new Array(d);for(let i of t){let r,s,a,n;if(L.length>M)r=L[M],s=r.firstElementChild.firstElementChild,a=r.firstElementChild.lastElementChild,n=r.lastElementChild;else{r=document.createElementNS(C,"svg"),r.setAttribute("pacem",""),O.insertAdjacentElement("afterend",r);const t=document.createElementNS(C,"defs");t.appendChild(s=this.buildLinearGradient(M)),t.appendChild(a=this.buildLinearGradient(M,!0)),r.appendChild(t),r.appendChild(n=document.createElementNS(C,"g")),L.push(r)}var H="chart-series series-fill";e.Utils.isNullOrEmpty(i.className)||(H+=" "+i.className),r.setAttribute("class",H),r.setAttribute("x",E.toString()),r.setAttribute("y",P.toString()),r.setAttribute("width",w.toString()),r.setAttribute("height",(N+48).toString());const l=i.values,o=t=>{for(;t>=n.children.length;)n.appendChild(document.createElementNS(C,"rect"));const e=n.children.item(t);e.style.stroke=i.color;const r=l[t].value<0?a:s;return this.setGradientColor(r,i.color),e.style.fill=`url(#${r.id})`,e},h=10,c=(t,e,i,r=e)=>{const s=-Math.max(e.y,i.y),a=Math.abs(i.y-e.y),n=()=>{t.setAttribute("y",s.toFixed(h)),t.setAttribute("height",a.toFixed(h))};t.hasAttribute("y")?n():(t.setAttribute("y","-"+r.y.toFixed(h)),t.setAttribute("height","0"),requestAnimationFrame(n))};if(!e.Utils.isNullOrEmpty(l)){const r=D({value:0,label:l[0].label},l);if(p){const t=f*U,s=(y*U).toFixed(h);for(let a=0;a<l.length;a++){const n=l[a];e.Utils.isNullOrEmpty(B[a])&&(B[a]={positive:0,negative:0});const d=B[a];let u=d.positive,m=d.negative;const p=n.value<0,v=p?m:u+n.value,g=p?m+n.value:u,y=D({label:n.label,value:v},l),f=D({label:n.label,value:g},l),b=y.x-t,C=o(a);this.assignUiBehaviors(C,i,n),C.setAttribute("x",b.toFixed(h)),C.setAttribute("width",s),c(C,f,y,r),p?d.negative=g:d.positive=v}}else{const e=f*U,s=2*e/t.length,a=s.toFixed(h);for(let t=0;t<l.length;t++){const n=l[t],d=D(n,l),u=d.x-e+s*M,m=o(t);this.assignUiBehaviors(m,i,n),m.setAttribute("x",u.toFixed(h)),m.setAttribute("width",a),c(m,r,d)}}}for(let t=n.children.length-1;t>=l?.length;t--){const e=n.children.item(t);this.disposeUiBehaviors(e),e.remove()}M++}this.wipeOut(L,M);const R=`0 ${-(o*k+$)} ${100*u} ${100+2*$}`;for(var T of L)T.setAttribute("viewBox",R);let z,I=this.chartMask.children.item(1);if(I.setAttribute("x",(0).toString()),I.setAttribute("height",(s.height-r).toString()),O.setAttribute("viewBox",`0 0 ${s.width} ${s.height}`),x.x.length<1||x.y.length<=1){for(let t=O.children.length-1;t>=0;t--)O.children.item(t).remove();return}O.children.length>0?z=O.children.item(0):(z=document.createElementNS(C,"path"),O.appendChild(z));let F=0,V=(t,e,i,r)=>{const s=t+1;let a;return O.children.length<=s?(a=document.createElementNS(C,"text"),O.appendChild(a)):a=O.children.item(s),a.textContent=r,a.setAttribute("x",e.toString()),a.setAttribute("y",i.toString()),a},G=`M${E},24 v${S}`,j=0;const Y=w/x.x.length,q=S/(x.y.length-1);if("none"!==this.xAxisPosition){const t=.5*Y+E;for(var J of x.x){let e=t+j*Y;if("top"===this.xAxisPosition){G+=` M${e},24 v-6`;let t=V(F++,e,0,J);t.setAttribute("text-anchor","middle"),t.setAttribute("alignment-baseline","hanging")}else{let t=S+r;G+=` M${e},${t} v6`,V(F++,e,t+r,J).setAttribute("text-anchor","middle")}j++}}for(var X of(j=0,x.y)){const t=S+r-j*q,e=E-6;G+=` M${e},${t} H${w+E}`,V(F++,e-6,t,this.formatYAxisLabel(X)).setAttribute("text-anchor","end"),j++}z.setAttribute("d",G);for(let t=O.children.length-1;t>F;t--)O.children.item(t).remove()}};b([e.Watch({converter:e.PropertyConverters.String})],x.prototype,"type",void 0),b([e.Watch({converter:e.PropertyConverters.Number})],x.prototype,"groupWidth",void 0),x=b([e.CustomElement({tagName:e.P+"-column-chart"})],x);var A=function(t,e,i,r){var s,a=arguments.length,n=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(t,e,i,r);else for(var l=t.length-1;l>=0;l--)(s=t[l])&&(n=(a<3?s(n):a>3?s(e,i,n):s(e,i))||n);return a>3&&n&&Object.defineProperty(e,i,n),n};let _=class PacemPieSliceElement extends e.Components.PacemItemElement{constructor(){super(...arguments),this._broadcastHandler=t=>{this.emit(t)}}findContainer(){return e.CustomElementUtils.findAncestorOfType(this,S)}get chart(){return this.container}getCenterOfMass(){const t=this.chart&&this.chart.area;if(e.Utils.isNull(t))return null;const i=e.Utils.offset(t),r=i.width/2+i.left,s=i.top+i.height/2,a=.5*Math.min(i.width,i.height),n=this.normalizedPolarCoords,l=w-n.angle;return{y:s-a*n.radius*Math.sin(l),x:r+a*n.radius*Math.cos(l)}}propertyChangedCallback(t,e,i,r){super.propertyChangedCallback(t,e,i,r),!r&&this.chart&&"normalizedPolarCoords"!=t&&this.chart.draw()}_assignUi(t){const e=this._ui=t;r.forEach(t=>{e.addEventListener(t,this._broadcastHandler)})}_disposeUi(){e.Utils.isNull(this._ui)||r.forEach(t=>{this._ui.removeEventListener(t,this._broadcastHandler)})}};A([e.Watch({converter:e.PropertyConverters.Number})],_.prototype,"value",void 0),A([e.Watch({converter:e.PropertyConverters.String})],_.prototype,"label",void 0),A([e.Watch({converter:e.PropertyConverters.String})],_.prototype,"color",void 0),A([e.Watch({converter:e.PropertyConverters.Json})],_.prototype,"normalizedPolarCoords",void 0),_=A([e.CustomElement({tagName:e.P+"-pie-slice"})],_);const E=2*Math.PI,w=.5*Math.PI;let S=class PacemPieChartElement extends e.Components.PacemItemsContainerElement{constructor(){super(),this.cutout=0,this.slicePadding=0,this._slices=new WeakMap,this._key=e.Utils.uniqueCode()}validate(t){return t instanceof _}viewActivatedCallback(){super.viewActivatedCallback(),this.draw()}propertyChangedCallback(t,i,r,s){if(super.propertyChangedCallback(t,i,r,s),"target"===t){this._g=null,this._div&&this._div.remove();const t=i;t&&(t.classList.remove(e.PCSS+"-chart-area"),t.innerHTML=""),this.draw()}else s||"cutout"!==t&&"items"!==t&&"slicePadding"!==t||this.draw()}get area(){return this._svg}disconnectedCallback(){this._div&&this._div.remove(),super.disconnectedCallback()}_ensureArea(){if(e.Utils.isNull(this._g)){let t=this.target||(this._div=document.createElement("div"));t.classList.add(e.PCSS+"-chart-area");let i=this._svg=document.createElementNS("http://www.w3.org/2000/svg","svg");i.setAttribute("pacem",""),i.setAttribute("preserveAspectRatio","xMidYMid meet"),i.setAttribute("viewBox","0 0 100 100"),i.classList.add(e.PCSS+"-pie-chart");let r=document.createElementNS("http://www.w3.org/2000/svg","defs"),s=this._g=document.createElementNS("http://www.w3.org/2000/svg","g");i.appendChild(r),i.appendChild(s),t.appendChild(i),this._div&&this.parentElement.insertBefore(t,this)}if(this.maskBasedRendering){if(e.Utils.isNull(this._mask)){let t=document.createElementNS("http://www.w3.org/2000/svg","mask");t.id="pie_mask_"+this._key;let e=document.createElementNS("http://www.w3.org/2000/svg","rect");e.setAttribute("x","0"),e.setAttribute("y","0"),e.setAttribute("width","100"),e.setAttribute("height","100"),e.setAttribute("fill","#fff");let i=this._mask=document.createElementNS("http://www.w3.org/2000/svg","circle");i.setAttribute("cx","50"),i.setAttribute("cy","50");const r=this._svg.firstElementChild;t.appendChild(e),t.appendChild(i),r.appendChild(t),this._g.setAttribute("mask",`url(#${t.id})`)}const t=50*this._safeCutout;this._mask.setAttribute("r",`${t}`)}else e.Utils.isNull(this._mask)||(this._svg.firstElementChild.innerHTML="",this._mask=null,this._g.removeAttribute("mask"));const t=this._safeSlicePaddingPixels;if(t>0){const i=(t/this._svg.getCTM().a).roundoff(),r=this._sliceMaskId,s=this._svg.firstElementChild;let a=s.querySelector(`#${r}`);e.Utils.isNull(a)?(a=document.createElementNS("http://www.w3.org/2000/svg","mask"),a.id=r,s.appendChild(a)):a.innerHTML="";const n=document.createElementNS("http://www.w3.org/2000/svg","path"),l=`M${50+i},0 H100 V100 H0 V0 H50 V50 h${i} Z`;n.setAttribute("d",l),n.setAttribute("fill","#fff"),a.appendChild(n)}return this._g}get _sliceMaskId(){return"pieslice_mask_"+this._key}get _safeCutout(){return Math.min(1,Math.max(0,this.cutout))||0}get _safeSlicePaddingPixels(){return Math.max(0,this.slicePadding??0)}_drawSlice(t,e,i,r){const s=e.value>.5*i?1:0,a=E*e.value/i,n=360*r/i,l=e.value>=i?49.9:50*(1+Math.sin(a)),o=50*(1-Math.cos(a)),h=this._safeCutout,c=50*h;t.style.fill=e.color,t.style.transform=`rotate(${n}deg)`,t.style.transformOrigin="50% 50%";const d=this.maskBasedRendering?`M50,50 V0 A50,50 0 ${s} 1 ${l} ${o} L50,50 Z`:`M50,0 A50,50 0 ${s} 1 ${l} ${o} l${(50-l)*(1-h)},${(50-o)*(1-h)} A${c},${c} 0 ${s} 0 50,${50-c} Z`;t.setAttribute("d",d),e.normalizedPolarCoords={radius:h+Math.SQRT1_2*(1-h),angle:Math.PI*n/180+a/2}}_isSliceOk(t){return!t.disabled}_padSlice(t){this._safeSlicePaddingPixels>0?t.setAttribute("mask",`url(#${this._sliceMaskId})`):t.removeAttribute("mask")}draw(){const t=this._ensureArea(),i=t.children.length,r=this._svg.parentElement;let s=0,a=0,n=0;if(e.Utils.isNullOrEmpty(this.items))t.innerHTML="",e.Utils.removeClass(r,"chart-has-data");else{e.Utils.addClass(r,"chart-has-data");for(let t of this.items)this._isSliceOk(t)&&(a+=t.value);if(a<=0)t.innerHTML="",e.Utils.removeClass(r,"chart-has-data");else for(let r of this.items){if(!this._isSliceOk(r))continue;let l;if(s>=i){const i=document.createElementNS("http://www.w3.org/2000/svg","g");i.setAttribute("class","chart-series "+e.PCSS+"-pie-slice"+(e.Utils.isNullOrEmpty(r.className)?"":" "+r.className)),l=document.createElementNS("http://www.w3.org/2000/svg","path"),i.appendChild(l),t.appendChild(i),r._assignUi(i),this._slices.set(i,r)}else l=t.children.item(s).firstElementChild;r.value>0?(this._drawSlice(l,r,a,n),this._padSlice(l),n+=r.value,l.removeAttribute("display")):l.setAttribute("display","none"),s++}}for(;s<t.children.length;){const e=this._slices,i=t.children.item(s);e.has(i)&&(e.get(i)._disposeUi(),e.delete(i)),t.removeChild(i)}}};A([e.Watch({converter:e.PropertyConverters.Number})],S.prototype,"cutout",void 0),A([e.Watch({converter:e.PropertyConverters.Element})],S.prototype,"target",void 0),A([e.Watch({converter:e.PropertyConverters.Boolean})],S.prototype,"maskBasedRendering",void 0),A([e.Watch({converter:e.PropertyConverters.Number})],S.prototype,"slicePadding",void 0),A([e.Debounce(!0)],S.prototype,"draw",null),S=A([e.CustomElement({tagName:e.P+"-pie-chart"})],S);var N=Object.freeze({__proto__:null,ChartEvent:ChartEvent,MANAGED_EVENTS:r,get PacemChartElement(){return f},get PacemChartSeriesElement(){return c},get PacemColumnChartElement(){return x},get PacemPieChartElement(){return S},get PacemPieSliceElement(){return _},PacemSeriesChartElement:PacemSeriesChartElement}),P=Object.freeze({__proto__:null,Charts:N}),M=Object.freeze({__proto__:null,Components:P});t.DeepMerger.merge(M)}(Pacem,Pacem);
-//# sourceMappingURL=pacem-charts.min.js.map

package/dist/browser/pacem-cms.js

@@ -1,5 +1,5 @@
 /*!
- * @pacem/pacem v1.0.0-bernoulli (https://js.pacem.it)
+ * @pacem/pacem v1.0.0-bessel (https://js.pacem.it)
  * Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/browser/pacem-cms.min.js

@@ -1,7 +1,6 @@
 /*!
- * @pacem/pacem v1.0.0-bernoulli (https://js.pacem.it)
+ * @pacem/pacem v1.0.0-bessel (https://js.pacem.it)
  * Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
 !function(e,t,r,s){"use strict";const a={dismiss:(...e)=>{for(let t of e||[])delete a[t]},handleExpressionValueChange:(e,r,s)=>{if("value"===e.detail.propertyName&&!t.Utils.isNull(s)){const a=e.detail.currentValue;if(s instanceof HTMLElement){let e=t.CustomElementUtils.camelToKebab(r);t.Utils.isNullOrEmpty(a)?s.removeAttribute(e):s.setAttribute(e,a.toString())}else s[r]=a}}},o=(e,r=":host",s=":host.entity")=>{const o={},i=e.metadata,n=a,l=[];o.value=`{{ ${s} instanceof HTMLElement && ${s}.getAttribute('${t.CustomElementUtils.camelToKebab(i.prop)}') }}`,o["on-"+t.PropertyChangeEventName]=`Pacem.Components.Cms.Functions.handleExpressionValueChange($event, '${i.prop}', ${s})`,o.converter=`{{ Pacem.CustomElementUtils.getWatchedProperty(${s}, '${i.prop}').config.converter }}`;const c=t.P+"-expression";let p=i.extra||{};if(t.Utils.isNullOrEmpty(p.selector)||(o.selector=p.selector),!t.Utils.isNullOrEmpty(p.filter))switch(typeof p.filter){case"string":o.filter=`{{ (e) => e.constructor.name === "${p.filter}" || e.localName === "${p.filter.toLowerCase()}" }}`;break;case"function":const e="fn"+t.Utils.uniqueCode();n[e]=p.filter,o.filter=`{{ Pacem.Components.Cms.Functions.${e}, once }}`,l.push(e)}if("function"==typeof p.labeler){const e="fn"+t.Utils.uniqueCode();n[e]=p.labeler,o.labeler=`{{ Pacem.Components.Cms.Functions.${e}, once }}`,l.push(e)}return l.length>0&&(o["on-unload"]=`{{ Pacem.Components.Cms.Functions.dismiss('${l.join("','")}') }}`),{tagName:c,attrs:o}};var i=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};class PacemElementPickerElementBase extends r.Components.Scaffolding.PacemBaseElement{}i([t.Watch({converter:t.PropertyConverters.String})],PacemElementPickerElementBase.prototype,"selector",void 0),i([t.Watch({converter:t.PropertyConverters.Eval})],PacemElementPickerElementBase.prototype,"filter",void 0),i([t.Watch({converter:t.PropertyConverters.Eval})],PacemElementPickerElementBase.prototype,"labeler",void 0);let n=class PacemElementPickerElement extends PacemElementPickerElementBase{get inputFields(){return[this._select]}toggleReadonlyView(e){this._select.readonly=e}onChange(e){return t.Utils.fromResult(this.value=this._select.value)}acceptValue(e){this._select.value=e}getViewValue(e){return this._select.viewValue}convertValueAttributeToProperty(e){return t.PropertyConverters.Element.convert(e)}viewActivatedCallback(){super.viewActivatedCallback(),this._databind()}propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"selector":case"filter":case"labeler":this._databind()}}_databind(){const e=this.labeler||(e=>{let t=e.constructor.name;return e.id&&(t+="#"+e.id),t}),r=[];document.querySelectorAll(this.selector||"[pacem]").forEach((s,a,o)=>{!t.Utils.isNull(this.filter)&&!0!==this.filter(s)||t.Utils.isNullOrEmpty(s.id)||r.push({element:s,label:e(s)})}),this._select.valueProperty="element",this._select.textProperty="label",this._select.datasource=r}};i([t.ViewChild(t.P+"-select")],n.prototype,"_select",void 0),i([t.Debounce(50)],n.prototype,"_databind",null),n=i([t.CustomElement({tagName:t.P+"-element-picker",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-select></${t.P}-select>`})],n);var l,c=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};!function(e){e.Constant="const",e.PropertyReference="property",e.Expression="expr"}(l||(l={}));let p=class PacemExpressionElement extends PacemElementPickerElementBase{propertyChangedCallback(e,r,s,a){if(super.propertyChangedCallback(e,r,s,a),"converter"===e)this._setFeedbackText(this.value);else if(!a&&this._editing)switch(e){case"_source":if(s===l.PropertyReference)this._picker.focus();else this._editor.focus();break;case"_propRef":t.Utils.isNullOrEmpty(s)||(this._editor.focus(),this._editor.value="{{ #"+this._sourceRef.id+"."+s+"  }}"),this.changeHandler(new Event("change"))}}get inputFields(){return[this._editor]}toggleReadonlyView(e){e&&(this._editing=!1)}setPristine(){super.setPristine(),this._editing=!1}onChange(e){return t.Utils.fromResult(this.value=this._editor.value)}acceptValue(e){this._view.textContent=e||"...",this._setFeedbackText(e),this._reverseStructure(),e!==this._editor.value&&(this._editor.value=e)}_setFeedbackText(e=this.value){const r=this.converter;t.CustomElementUtils.isBindingAttribute(e)||"function"!=typeof(r&&r.convert)?this._eval.setAttribute("text",e):this._eval.text=void 0===e?"<undefined>":r.convert(e)}getViewValue(e){return e}convertValueAttributeToProperty(e){return e}_reverseStructure(){let e=()=>{this._source=this._sourceRef=this._propRef=void 0},r=this.value;if(t.Utils.isNullOrEmpty(r))e();else if(t.CustomElementUtils.isBindingAttribute(r)){const e=t.CustomElementUtils.parseBindingAttribute(r,this).dependencies;if(t.Utils.isNullOrEmpty(e)||e.length>1||t.RepeaterItem.isRepeaterItem(e[0].element))this._source=l.Expression;else{const t=e[0];this._source=l.PropertyReference,this._sourceRef=document.querySelector("#"+t.element.id),this._propRef=t.path}}else this._source=l.Constant}};c([t.Watch({emit:!1})],p.prototype,"converter",void 0),c([t.Watch({converter:t.PropertyConverters.Boolean})],p.prototype,"_editing",void 0),c([t.Watch({converter:t.PropertyConverters.String})],p.prototype,"_source",void 0),c([t.Watch({converter:t.PropertyConverters.Element})],p.prototype,"_sourceRef",void 0),c([t.Watch({converter:t.PropertyConverters.String})],p.prototype,"_propRef",void 0),c([t.ViewChild(t.P+"-element-picker")],p.prototype,"_picker",void 0),c([t.ViewChild(t.P+"-textarea")],p.prototype,"_editor",void 0),c([t.ViewChild("span."+t.PCSS+"-viewfinder")],p.prototype,"_view",void 0),c([t.ViewChild(t.P+"-text")],p.prototype,"_eval",void 0),c([t.Debounce(50)],p.prototype,"_reverseStructure",null),p=c([t.CustomElement({tagName:t.P+"-expression",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-collapse class="${t.PCSS}-expression" collapse="{{ !:host._editing }}">\n    <div class="expression-builder ${t.PCSS}-grid grid-tiny-rowgap grid-tiny-colgap ${t.PCSS}-pad pad-bottom-2">\n        <div class="${t.PCSS}-cell">\n            <${t.P}-select value="{{ :host._source, twoway }}" class="display-block">\n                <${t.P}-data-item value="${l.Constant}" label="constant value"></${t.P}-data-item>\n                <${t.P}-data-item value="${l.PropertyReference}" label="property reference"></${t.P}-data-item>\n                <${t.P}-data-item value="${l.Expression}" label="complex expression"></${t.P}-data-item>\n            </${t.P}-select>\n        </div>\n\n        <${t.P}-panel class="${t.PCSS}-cell cols-hd-6" hide="{{ :host._source !== '${l.PropertyReference}' }}">\n            <${t.P}-element-picker value="{{ :host._sourceRef, twoway }}" selector="{{ :host.selector }}" filter="{{ :host.filter }}" labeler="{{ :host.labeler }}" class="display-block"></${t.P}-element-picker>\n        </${t.P}-panel>\n        <${t.P}-panel class="${t.PCSS}-cell cols-hd-6" hide="{{ :host._source !== '${l.PropertyReference}' }}">\n            <${t.P}-property-picker value="{{ :host._propRef, twoway }}" disabled="{{ !:host._sourceRef }}" target="{{ :host._sourceRef }}" on-change="::_editor.focus()" class="display-block"></${t.P}-property-picker>\n        </${t.P}-panel>\n\n        <${t.P}-panel class="${t.PCSS}-cell">\n            <${t.P}-textarea class="display-block" placeholder="{{ '{{ '+ (:host._source || '') +'... }}' }}" change-policy="${r.Components.Scaffolding.ChangePolicy.Blur}"></${t.P}-textarea>\n        </${t.P}-panel>\n    </div>\n</${t.P}-collapse>\n<div class="${t.PCSS}-fieldset">\n    <div class="fieldset-left">\n        <div class="${t.PCSS}-fieldgroup ${t.PCSS}-viewfinder">\n            <div class="text-truncate ${t.PCSS}-pad pad-x-1"><span class="${t.PCSS}-viewfinder text-tech">{{ :host.value || '...' }}</span></div>\n            <${t.P}-panel class="fieldgroup-prepend">\n                <${t.P}-button class="flat edit ${t.PCSS}-pad pad-left-1" on-click=":host._editing = !:host._editing" hide="{{ :host.readonly }}"></${t.P}-button>\n            </${t.P}-panel>\n            <${t.P}-panel class="fieldgroup-append text-tech display-flex flex-middle flex-nowrap" hide="{{ $pacem.isNullOrEmpty(:host.value) }}">\n                <i class="${t.PCSS}-icon text-primary">keyboard_arrow_right</i>\n                <${t.P}-text text="?" class="bg-primary ${t.PCSS}-pad pad-left-1 pad-right-1 ${t.PCSS}-margin margin-right-1 text-truncate" eval></${t.P}-text>\n            </${t.P}-panel>\n        </div>\n    </div>\n</div>`})],p);var d=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const m=s.Components.UI,h={props:[{prop:"permissions",type:"array",display:{name:"Permissions"},props:{display:{cssClass:[t.PCSS+"-cell",t.PCSS+"-grid","grid-novgap","grid-tiny-colgap","grid-nospace"],name:"Permission"},props:Array.prototype.concat.apply([{prop:"claimType",type:"string",display:{cssClass:[t.PCSS+"-cell","cols-hd-4","cols-lg-6","field-stretch","field-minimal"],name:"Claim type"},validators:[{type:"required",errorMessage:"!"}]},{prop:"claimValue",type:"string",display:{cssClass:[t.PCSS+"-cell","cols-hd-4","cols-lg-6","field-stretch","field-minimal"],name:"Claim value"},validators:[{type:"required",errorMessage:"!"}]}],["read","update","create","delete"].map((e,r)=>({prop:e,type:"boolean",display:{cssClass:[t.PCSS+"-cell","cols-hd-1","cols-3","field-minimal",t.PCSS+"-pad pad-left-2"],name:e.charAt(0).toUpperCase()+e.substr(1)}})))}}]},u={display:{name:"Widget",cssClass:[t.PCSS+"-grid","grid-novgap","grid-tiny-colgap","grid-nospace"]},props:[{prop:"tag",type:"string",display:{name:"Tag",cssClass:[t.PCSS+"-cell"]}}]};function g(e){e.display=e.display||{name:e.prop,cssClass:[]};(e.display.cssClass=t.Utils.isArray(e.display.cssClass)&&e.display.cssClass||[]).push(t.PCSS+"-cell")}function f(e){var r=e&&e.props||[],s=e&&e.display||{name:"Element"};if(!t.Utils.isNull(s)){const e=s.cssClass=s.cssClass||[];Array.prototype.push.apply(e,u.display.cssClass)}return r.forEach(g),{display:s,props:r}}function v(e){var r=t.Utils.extend({},u.display,e&&e.display||{}),s=t.Utils.clone(u.props);return Array.prototype.push.apply(s,(e&&e.props||[]).filter(e=>"tag"!==e.prop&&(g(e),!0))),{display:r,props:s}}const y=t.PCSS+"-widget",P={selector:"."+y,labeler:e=>t.Utils.isNullOrEmpty(e.tag)?(e.metadata&&e.metadata.display&&e.metadata.display.name||"")+"#"+e.id:e.tag};let C=class PacemWidgetToolbarElement extends t.Components.PacemElement{get editButton(){return this._btnEdit}get permissionsButton(){return this._btnPerms}get removeButton(){return this._btnRemove}_edit(e){const t=this._proxy.dom.find(e=>"core"in e.attributes);t.open(this.target,!0),t.metadata=this.target.metadata,this._popoutJustInCase()}_editPermissions(e){const t=this._proxy.dom.find(e=>"permissions"in e.attributes);t.open(this.target),t.metadata=this.target.permissionMetadata,this._popoutJustInCase()}_popoutJustInCase(){const e=t.CustomElementUtils.findAncestorOfType(this,m.PacemBalloonElement);t.Utils.isNullOrEmpty(e)||e.popout()}};d([t.Watch({emit:!1,converter:t.PropertyConverters.Element})],C.prototype,"target",void 0),d([t.ViewChild(".buttons > div")],C.prototype,"_toolbar",void 0),d([t.ViewChild(t.P+"-button[edit]")],C.prototype,"_btnEdit",void 0),d([t.ViewChild(t.P+"-button[permissions]")],C.prototype,"_btnPerms",void 0),d([t.ViewChild(t.P+"-button[remove]")],C.prototype,"_btnRemove",void 0),d([t.ViewChild(t.P+"-shell-proxy")],C.prototype,"_proxy",void 0),C=d([t.CustomElement({tagName:t.P+"-widget-toolbar",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-span class="toolbar-text" content="{{ '<i class=&quot;${t.PCSS}-icon&quot;>'+ (::target.metadata && ::target.metadata.display && ::target.metadata.display.icon || 'widgets') +'</i> '+ (::target.tag || (::target.metadata && ::target.metadata.display && ::target.metadata.display.name || ::target.localName) +'#'+ ::target.id) }}"></${t.P}-span>\n<div class="buttons ${t.PCSS}-buttonset ${t.PCSS}-pad ${t.PCSS}-margin pad-0 margin-left-2">\n    <div class="buttonset-left">\n        <${t.P}-button edit class="button edit" on-click=":host._edit($event)"></${t.P}-button>\n        <${t.P}-button permissions class="button" on-click=":host._editPermissions($event)" css-class="{{ {'button-success': ::target.permissions.length > 0} }}" icon-glyph="verified_user"></${t.P}-button>\n        <${t.P}-button remove class="button button-danger delete"></${t.P}-button>\n    </div>\n<div>\n<${t.P}-shell-proxy>\n    <${t.P}-modal-form core></${t.P}-modal-form>\n    <${t.P}-modal-form permissions></${t.P}-modal-form>\n</${t.P}-shell-proxy>`})],C);class PacemWidgetElement extends t.Components.PacemElement{constructor(e,t="widget"){super(t),this.permissionMetadata=h,this.metadata=e}connectedCallback(){super.connectedCallback(),t.Utils.isNullOrEmpty(this.id)&&(this.id="wdg"+t.Utils.uniqueCode()),t.Utils.addClass(this,y)}propertyChangedCallback(e,r,s,a){switch(super.propertyChangedCallback(e,r,s,a),e){case"editable":s?this.isReady&&this._ensureBalloon():this._disposeBalloon();break;case"editing":t.Utils.isNull(this._balloon)||(this._balloon.disabled=!s),(s?t.Utils.addClass:t.Utils.removeClass).apply(this,[this,"widget-"+e]);break;case"metadata":this._assignIcon(s)}}viewActivatedCallback(){super.viewActivatedCallback(),this._assignIcon(),this._ensureBalloon()}disconnectedCallback(){super.disconnectedCallback()}_assignIcon(e=this.metadata){this.dataset.icon=e&&e.display&&e.display.icon||"widgets"}_ensureBalloon(){if(t.Utils.isNull(this._balloon)){const e=this._balloon=document.createElement(t.P+"-balloon");e.target=this,e.disabled=!this.editing,e.options={behavior:m.BalloonBehavior.Menu,trigger:m.BalloonTrigger.Hover},e.innerHTML=`<${t.P}-widget-toolbar target="{{ #${this.id} }}"><${t.P}-widget-toolbar>`,t.CustomElementUtils.findAncestorShell(this).appendChild(e)}}_disposeBalloon(){t.Utils.isNull(this._balloon)||(this._balloon.remove(),this._balloon=null)}}d([t.Watch({emit:!1,converter:t.PropertyConverters.Boolean})],PacemWidgetElement.prototype,"editing",void 0),d([t.Watch({emit:!1,converter:t.PropertyConverters.Boolean})],PacemWidgetElement.prototype,"editable",void 0),d([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.String})],PacemWidgetElement.prototype,"tag",void 0),d([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Json})],PacemWidgetElement.prototype,"permissions",void 0),d([t.Watch({emit:!1,converter:t.PropertyConverters.Json})],PacemWidgetElement.prototype,"metadata",void 0),d([t.Watch({emit:!1,converter:t.PropertyConverters.Json})],PacemWidgetElement.prototype,"permissionMetadata",void 0);var E=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const b={display:{icon:"storage",name:"Data",description:"Data object widget."},props:[{prop:"model",type:o,display:{name:"Model"},extra:{selector:"."+t.PCSS+"-widget"}}]};let _=class PacemWidgetDataElement extends PacemWidgetElement{constructor(){super(v(b))}};E([t.Watch({reflectBack:!0,converter:t.PropertyConverters.Json})],_.prototype,"model",void 0),_=E([t.CustomElement({tagName:t.P+"-widget-data"})],_);var w=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const S={props:[{prop:"name",type:"string",isReadOnly:!0,display:{name:"Name",cssClass:["cols-md-4","cols-lg-3","cols-hd-2"]}},{prop:"value",type:o,display:{name:"Value",cssClass:["cols-md-8","cols-lg-9","cols-hd-10"]}}]},$={display:{icon:"wifi",name:"Api Fetcher",description:"Fetching widget that retrieves data from a REST endpoint."},props:[{prop:"manifest",type:o,isComplexType:!0,display:{name:"Api Manifest"},extra:{selector:t.P+"-widget-apimanifest"},validators:[{type:"required",errorMessage:"Api Manifest is a required field."}]},{prop:"endpoint",type:"object",isComplexType:!0,display:{name:"Endpoint",ui:"oneToMany"},validators:[{type:"required",errorMessage:"Api Manifest is a required field."}],extra:{source:e=>e.endpoints.map(e=>t.Utils.extend(e,{fullPath:`[${e.method.toUpperCase()}] ${e.path}`})).sort(),textProperty:"fullPath",valueProperty:"fullPath",dependsOn:[{prop:"manifest",hide:!0}]}},{prop:"parameters",type:"array",display:{name:"Parameters"},props:f(S),extra:{lockItems:!0,dependsOn:[{prop:"endpoint",hide:!0}]}},D]},x=t.P+"-widget-fetch-parameter";let U=class PacemWidgetFetchParameterElement extends t.PacemEventTarget{propertyChangedCallback(e,r,s,a){super.propertyChangedCallback(e,r,s.first),"value"!==e||t.Utils.isNull(this._fetcher)||this._fetcher.fetch()}viewActivatedCallback(){super.viewActivatedCallback(),this._fetcher=t.CustomElementUtils.findAncestorOfType(this,k),t.Utils.isNull(this._fetcher)||t.Utils.isNull(this.value)||this._fetcher.fetch()}};w([t.Watch({reflectBack:!0,converter:t.PropertyConverters.Boolean})],U.prototype,"required",void 0),w([t.Watch({reflectBack:!0,converter:t.PropertyConverters.String})],U.prototype,"name",void 0),w([t.Watch({reflectBack:!0,converter:t.PropertyConverters.String})],U.prototype,"value",void 0),U=w([t.CustomElement({tagName:x})],U);let k=class PacemWidgetFetchElement extends PacemBearerWidgetElement{constructor(){super(v($)),this._onerror=e=>{this.failure=!(this.success=!1)},this._onsuccess=e=>{this.failure=!(this.success=!0)},this._onresult=e=>{this.result=e.detail}}get _parameters(){return Array.from(this._itemsElement.children).filter(e=>e.localName===x)}fetch(){const e=this._fetcher,r=this._parameters||[],s=this.endpoint;if(!t.Utils.isNull(s))for(let e of s.parameters)if(e.required&&t.Utils.isNull(r.find(t=>t.name===e.name)))return;const a={};for(let e of r)if(t.Utils.isNullOrEmpty(e.value)){if(e.required)return}else a[e.name]=e.value;return e.url=this.url,e.method=this.method,e.credentials=this.fetchCredentials,e.headers=this.fetchHeaders,e.parameters=a,e.fetch()}viewActivatedCallback(){super.viewActivatedCallback(),this.fetch()}propertyChangedCallback(e,r,s,a){if(super.propertyChangedCallback(e,r,s,a),"endpoint"!==e||t.Utils.isNullOrEmpty(s))switch(e){case"parameters":case"fetchHeaders":case"fetchCredentials":case"url":case"method":this.fetch()}else this._mergeEndpoint(s)}_mergeEndpoint(e=this.endpoint){this.url=this.manifest.baseUrl+e.path,this.method=e.method,this.fields=e.response.fields;const r=this._itemsElement,s=this._parameters;for(let r=s.length-1;r>=0;r--){let a=s[r],o=e.parameters.find(e=>e.name===a.name);t.Utils.isNull(o)&&a.remove()}for(let a of e.parameters){let e=s.find(e=>e.name===a.name);if(t.Utils.isNull(e)){let t=e=document.createElement(x);t.name=a.name,r.appendChild(t)}e.required=a.required}this.parameters=s}};w([t.Watch({reflectBack:!0,emit:!0,converter:t.PropertyConverters.Json})],k.prototype,"manifest",void 0),w([t.Watch({reflectBack:!0,emit:!0,converter:t.PropertyConverters.Json})],k.prototype,"endpoint",void 0),w([t.Watch({reflectBack:!0,emit:!1,converter:t.PropertyConverters.String})],k.prototype,"url",void 0),w([t.Watch({reflectBack:!0,emit:!1,converter:t.PropertyConverters.String})],k.prototype,"method",void 0),w([t.Watch({reflectBack:!0,emit:!1,converter:t.PropertyConverters.Json})],k.prototype,"fields",void 0),w([t.Watch()],k.prototype,"parameters",void 0),w([t.Watch()],k.prototype,"result",void 0),w([t.Watch({converter:t.PropertyConverters.Boolean})],k.prototype,"fetching",void 0),w([t.Watch({converter:t.PropertyConverters.Boolean})],k.prototype,"success",void 0),w([t.Watch({converter:t.PropertyConverters.Boolean})],k.prototype,"failure",void 0),w([t.ViewChild(t.P+"-fetch")],k.prototype,"_fetcher",void 0),w([t.ViewChild("div[hidden]")],k.prototype,"_itemsElement",void 0),k=w([t.CustomElement({tagName:t.P+"-widget-fetch",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-fetch autofetch="false" fetching="{{ :host.fetching, twoway }}" debounce="100"\non-${t.Net.FetchResultEventName}=":host._onresult($event)" on-${t.Net.FetchErrorEventName}=":host._onerror($event)" on-${t.Net.FetchSuccessEventName}=":host._onsuccess($event)"></${t.P}-fetch><div hidden><${t.P}-content></${t.P}-content></div>`})],k);var W=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const D={prop:"accessToken",type:o,display:{name:"Access Token"},extra:t.Utils.extend({},P,{filter:e=>e instanceof _||e instanceof k})};class PacemBearerWidgetElement extends PacemWidgetElement{constructor(){super(...arguments),this.fetchCredentials="same-origin"}propertyChangedCallback(e,r,s,a){super.propertyChangedCallback(e,r,s,a),"accessToken"===e&&(t.Utils.isNullOrEmpty(s)?this.fetchHeaders={}:this.fetchHeaders={Authorization:"Bearer "+s})}}W([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.String})],PacemBearerWidgetElement.prototype,"fetchCredentials",void 0),W([t.Watch({emit:!1,converter:t.PropertyConverters.Json})],PacemBearerWidgetElement.prototype,"fetchHeaders",void 0),W([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.String})],PacemBearerWidgetElement.prototype,"accessToken",void 0),W([t.Watch({converter:t.PropertyConverters.Boolean})],PacemBearerWidgetElement.prototype,"fetching",void 0);var R=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};let O=class PacemWidgetTranslatorElement extends PacemWidgetElement{};O=R([t.CustomElement({tagName:t.P+"-widget-translator"})],O);var T=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const A={display:{icon:"timer",name:"Clock",description:"Timer widget."},props:[{prop:"interval",type:o,display:{name:"Interval (msec)"},extra:{selector:"."+t.PCSS+"-widget",step:1e3},validators:[{type:"range",errorMessage:"Negative numbers not allowed",params:{min:0}}]}]};let N=class PacemWidgetClockElement extends PacemWidgetElement{constructor(){super(v(A)),this.interval=0}};T([t.Watch({reflectBack:!0,converter:t.PropertyConverters.Number})],N.prototype,"interval",void 0),T([t.Watch({converter:t.PropertyConverters.Number})],N.prototype,"time",void 0),N=T([t.CustomElement({tagName:t.P+"-widget-clock",template:`<${t.P}-timer interval="{{ :host.interval }}" on-tick="{{ :host.time = Date.now() }}"></${t.P}-timer>`})],N);const B="pacem:metadatabag";class SwaggerCmsParser{constructor(e=new r.Scaffolding.OpenApi.OpenApiParser){this._openApi=e,this._cachedMetadataUrls=[]}async load(e,t){let r=await this._openApi.load(e,t);if(null!=r){r[B]={};for(let e of r.endpoints)await this._enrichSchemas(r,e,t)}return r}async _enrichSchemas(e,t,r){const s=t.response;s&&s.meta&&(s.fields=await this._fetchMetadata(e,{name:s.fullType,schema:s.meta},r));const a=t.parameters;for(let t of a||[])if(t.meta&&t.fullType){let s=await this._fetchMetadata(e,{name:t.fullType,schema:t.meta},r);t.fields=s}}clearCache(){const e=this.cache,t=this._cachedMetadataUrls;if(e){for(let r of t)e.removeProperty(r);t.splice(0)}}async _fetchMetadata(e,t,s){let a=async t=>{let o=[];if(t&&t.name){if(e[B][t.name])return e[B][t.name];e[B][t.name]=o;let i,n={props:[]};if(!/^https?:\/\//.test(t.name))return void console.warn("Swagger entity definition keys must appear in form of absolute url. Their response to a GET request needs to be the entity metadata itself.\nNo other options are currently supported.");if(i=t.name,i){let e=async()=>{let e=await fetch(i,{credentials:"omit",mode:"cors",headers:s});if(e.ok)return await e.json()};this.cache?(n=this.cache.getPropertyValue(i),n||(n=await e(),this._cachedMetadataUrls.push(i),this.cache.setPropertyValue(i,n,!1))):n=await e()}let l=t.schema;for(let t in l.properties){let s=l.properties[t],i=n&&n.props.find(e=>e.prop===t),c=Object.assign({prop:t,type:s.type||"text",props:void 0},i||{isReadOnly:!0});if(i){let t=s.items&&s.items.$ref||s.$ref;if(t){let s=r.Scaffolding.OpenApi.getOpenApiDefinition(e,t),o=s.name;e[B][o]?c.props=e[B][o]:c.props=await a(s)}}o.push(c)}}return o};return await a(t)}}var M=Object.freeze({__proto__:null,SwaggerCmsParser:SwaggerCmsParser}),j=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const I={display:{icon:"cloud_circle",name:"Api Manifest",description:"OpenApi parser for WebApi scaffolding."},props:[{prop:"url",type:"text",display:{name:"Url",description:"Insert the url of the OpenApi json configuration.",cssClass:["cols-lg-8"],watermark:"https://domain.com/swagger/v1/swagger.json"},extra:{tooltip:!0},validators:[{type:"required",errorMessage:"Url field is required."}]},{prop:"usecache",type:"boolean",display:{name:"Cache results",description:"Whether to cache the manifest per-url.",cssClass:["cols-lg-4"],ui:"switcher"},extra:{tooltip:!0}},D]};let H=class PacemWidgetApiManifestElement extends PacemBearerWidgetElement{constructor(e=new SwaggerCmsParser,r=new t.Storage){super(v(I)),this._openapi=e,this._cache=r}propertyChangedCallback(e,t,r,s){switch(super.propertyChangedCallback(e,t,r,s),e){case"url":case"editing":case"editable":this._scaffold();break;case"usecache":this._openapi.cache=r?this._cache:null}}viewActivatedCallback(){super.viewActivatedCallback(),this.usecache&&(this._openapi.cache=this._cache),this._scaffold()}_scaffold(){this.editing&&this.editable&&!t.Utils.isNullOrEmpty(this.url)&&(this.fetching=!0,this._openapi.load(this.url).then(e=>{this.manifest=e,this.fetching=!1},e=>{this.fetching=!1}))}};j([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.String})],H.prototype,"url",void 0),j([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Boolean})],H.prototype,"usecache",void 0),j([t.Watch({converter:t.PropertyConverters.Json})],H.prototype,"manifest",void 0),H=j([t.CustomElement({tagName:t.P+"-widget-apimanifest"})],H);var V=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};class PacemUiWidgetElement extends PacemWidgetElement{constructor(e,t=1,r){super(e,r),this.colspan=t,this.rowspan=1}connectedCallback(){super.connectedCallback(),t.Utils.addClass(this,"ui-widget "+t.PCSS+"-cell cols-xs-start-1 cols-xs-12 rows-xs-start-auto")}propertyChangedCallback(e,r,s,a){switch(super.propertyChangedCallback(e,r,s,a),e){case"row":t.Utils.removeClass(this,`rows-start-${r+1}`),t.Utils.addClass(this,`rows-start-${s+1}`);break;case"rowspan":t.Utils.removeClass(this,`rows-${r}`),t.Utils.addClass(this,`rows-${s}`);break;case"column":t.Utils.removeClass(this,`cols-start-${r+1}`),t.Utils.addClass(this,`cols-start-${s+1}`);break;case"colspan":t.Utils.removeClass(this,`cols-${r}`),t.Utils.addClass(this,`cols-${s}`);break;case"borders":(this.borders?t.Utils.addClass:t.Utils.removeClass).apply(this,[this,t.PCSS+"-border"]);break;case"corners":(this.borders?t.Utils.addClass:t.Utils.removeClass).apply(this,[this,t.PCSS+"-corners"])}}get container(){return this._container}findContainer(){return t.CustomElementUtils.findAncestor(this,e=>e instanceof PacemCompositeWidgetElement)}viewActivatedCallback(){super.viewActivatedCallback();let e=this._container=this.findContainer();t.Utils.isNull(e)||e.register(this)}disconnectedCallback(){t.Utils.isNull(this._container)||this._container.unregister(this),super.disconnectedCallback()}}V([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.Number})],PacemUiWidgetElement.prototype,"column",void 0),V([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.Number})],PacemUiWidgetElement.prototype,"row",void 0),V([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.Number})],PacemUiWidgetElement.prototype,"colspan",void 0),V([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.Number})],PacemUiWidgetElement.prototype,"rowspan",void 0),V([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.Boolean})],PacemUiWidgetElement.prototype,"borders",void 0),V([t.Watch({emit:!0,reflectBack:!0,converter:t.PropertyConverters.Boolean})],PacemUiWidgetElement.prototype,"corners",void 0);const L="widgetregister",F="widgetunregister";class WidgetRegisterEvent extends CustomEvent{constructor(e,r){super(L,t.Utils.extend(r||{},{detail:e}))}}class WidgetUnregisterEvent extends CustomEvent{constructor(e,r){super(F,t.Utils.extend(r||{},{detail:e}))}}class PacemCompositeWidgetElement extends PacemUiWidgetElement{get itemsElement(){return this}validate(e){return e instanceof PacemUiWidgetElement}viewActivatedCallback(){super.viewActivatedCallback(),t.Utils.addClass(this.itemsElement,t.PCSS+"-items-element")}appendItem(e){this.itemsElement.appendChild(e)}register(e){if(!this.validate(e))return this.log(t.Logging.LogLevel.Debug,`${e&&e.localName} element couldn't be registered in a ${this.localName} element.`),!1;let r=!1;const s=this.items=this.items||[];return t.Utils.isNullOrEmpty(s)?(this.items=[e],r=!0):-1===s.indexOf(e)&&(s.push(e),r=!0),r&&this.dispatchEvent(new WidgetRegisterEvent(e)),r}unregister(e){const r=this.items,s=!t.Utils.isNullOrEmpty(r)&&r.indexOf(e);if(s>=0){let e=r.splice(s,1);return this.dispatchEvent(new WidgetUnregisterEvent(e[0])),!0}return!1}}V([t.Watch()],PacemCompositeWidgetElement.prototype,"items",void 0);var q=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const G=v({display:{icon:"font_download",name:"Text",description:"Plain text widget."},props:[{prop:"text",type:o,display:{name:"Text"},extra:P}]});let J=class PacemWidgetTextElement extends PacemUiWidgetElement{constructor(){super(G)}};q([t.Watch({reflectBack:!0,converter:t.PropertyConverters.String})],J.prototype,"text",void 0),J=q([t.CustomElement({tagName:t.P+"-widget-text",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-text text="{{ :host.text }}"></${t.P}-text>`})],J);var z=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};let X=class PacemWidgetPickerElement extends PacemCompositeWidgetElement{register(e){const t=super.register(e);return t&&(e.hide=!0),t}};z([t.ViewChild(t.P+"-drag-drop")],X.prototype,"_dragDrop",void 0),X=z([t.CustomElement({tagName:t.P+"-widget-picker",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-repeater datasource="{{ :host.items }}">\n    <template>\n        <${t.P}-panel behaviors="{{ [::_dragDrop] }}" class="${t.PCSS}-widget-itempicker display-flex flex-fill flex-middle flex-nowrap">\n            <i class="${t.PCSS}-icon flex-auto" dragger>drag_indicator</i>\n            <${t.P}-icon icon="{{ ^item.metadata.display.icon }}" class="flex-auto ${t.PCSS}-margin margin-x-1"></${t.P}-icon>\n            <${t.P}-text text="{{ ^item.metadata.display.name }}"></${t.P}-text>\n        </${t.P}-panel>\n    </template>\n</${t.P}-repeater>\n<${t.P}-drag-drop handle-selector="i.${t.PCSS}-icon[dragger]"></${t.P}-drag-drop>\n<${t.P}-content></${t.P}-content>`})],X);var Y=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};function K(){const e=document.createElementNS("http://www.w3.org/2000/svg","svg");return e.style.pointerEvents="none",e.style.zIndex="1000",e.setAttribute("height","100%"),e.setAttribute("width","100%"),e.setAttribute("preserveAspectRatio","none"),e.setAttribute("class","grid-cell-wrapper"),e.innerHTML='<rect class="grid-cell" width="100%" height="100%"></rect>',e}const Q={display:{icon:"grid_on",name:"Grid",description:"Composition Widget that lays out child-widgets in a grid container."},props:[{prop:"rows",type:"int",display:{name:"Rows",cssClass:["cols-lg-4"]},validators:[{type:"required",errorMessage:""},{type:"range",errorMessage:"",params:{min:1,max:24}}]},{prop:"rowGap",type:"int",display:{name:"Row gap",cssClass:["cols-lg-4"]},validators:[{type:"range",errorMessage:"",params:{min:0,max:3,step:.25}}]},{prop:"columnGap",type:"int",display:{name:"Column gap",cssClass:["cols-lg-4"]},validators:[{type:"range",errorMessage:"",params:{min:0,max:3,step:.25}}]}]};let Z=class PacemGridWidgetElement extends PacemCompositeWidgetElement{constructor(){super(v(Q),12,"grid"),this._widgetPropertyChange=e=>{if("row"===e.detail.propertyName||"rowspan"===e.detail.propertyName){const t=e.target;this.rows=Math.max(this.rows,t.row+t.rowspan)}},this._dragDropHandler=e=>{const r=e.detail,s=r.element;switch(e.type){case t.UI.DragDropEventType.Start:this._gridBoxes.forEach(e=>{e.style.pointerEvents="auto"}),this._initState={colspan:s.colspan,rowspan:s.rowspan,col:s.column,row:s.row};break;case t.UI.DragDropEventType.End:this._gridBoxes.forEach(e=>{e.style.pointerEvents="none"});break;case t.UI.DragDropEventType.Over:var a=r.target,o=+a.style.gridColumnStart-1,i=+a.style.gridRowStart-1;const e=o+this._initState.colspan,n=i+this._initState.rowspan;if(!this._intersects(s,o,i,s.colspan,s.rowspan)){let t=!1;e<=(this.columns||12)&&(t=s.column!==o,s.column=o),n<=(this.rows||1)&&(t=t||s.row!==i,s.row=i)}}},this._resizeHandler=e=>{switch(e.type){case t.UI.RescaleEventType.Start:t.Utils.addClass(e.detail.element,t.PCSS+"-rescaling"),this._gridBoxes.forEach(e=>{e.style.pointerEvents="auto"});break;case t.UI.RescaleEventType.End:this._gridBoxes.forEach(e=>{e.style.pointerEvents="none"}),t.Utils.removeClass(e.detail.element,t.PCSS+"-rescaling");break;case t.UI.RescaleEventType.Rescale:e.preventDefault();const a={x:e.clientX,y:e.clientY},o=e.detail.handle,i=document.elementsFromPoint(a.x,a.y).find(e=>this._dragDrop.dropTargets.indexOf(e)>=0);if(i){var r=+i.style.gridColumnStart,s=+i.style.gridRowStart;const t=e.detail.element,a=t.column+1,n=t.row+1,l=1+r-a,c=1+s-n;if(!this._intersects(t,t.column,t.row,l,c)){let e=!1;r>=a&&o.endsWith("right")&&(e=t.colspan!==l,t.colspan=l),s>=n&&o.startsWith("bottom")&&(e=e||t.rowspan!==c,t.rowspan=c)}}}},this._gridBoxes=[]}register(e){let r=super.register(e);if(r){const r=e.row||0,s=e.column||0,a=e.colspan||2,o=e.rowspan||1;let i=!this._intersects(e,s,r,a,o);if(i)e.row=r,e.column=s,e.colspan=a,e.rowspan=o;else{if(!i){let t=(t=!1)=>{let r=this.columns-1;t||(r=r-a+1);for(let t=0;t<this.rows;t++){for(let s=0;s<=r;s++)if(!this._intersects(e,s,t,a,o)){e.column=s,e.row=t,e.colspan=Math.min(r+1-s,a),e.rowspan=o,i=!0;break}if(i)break}};t(),!i&&a>1&&t(!0)}i||(this.rows++,e.row=this.rows-1,e.column=0)}e.behaviors=[this._dragDrop,this._rescaler],e.addEventListener(t.PropertyChangeEventName,this._widgetPropertyChange,!1)}return r}unregister(e){let r=super.unregister(e);if(r){e.removeEventListener(t.PropertyChangeEventName,this._widgetPropertyChange,!1);const r=e.behaviors.indexOf(this._dragDrop);r>=0&&e.behaviors.splice(r,1);const s=e.behaviors.indexOf(this._rescaler);s>=0&&e.behaviors.splice(s,1)}return r}_intersects(e,t,r,s,a){for(let o of this.items){let i=o;if(i!==e&&(i.column<t+s&&i.column+i.colspan>t&&i.row<r+a&&i.row+i.rowspan>r))return!0}return!1}connectedCallback(){super.connectedCallback(),t.Utils.addClass(this,t.PCSS+"-grid");let e=this._dragDrop=document.createElement(t.P+"-drag-drop"),r=document.createElement("div");document.body.appendChild(r),e.floater=r,e.mode=t.UI.DragDataMode.Alias,e.dropBehavior=t.UI.DropBehavior.None,e.addEventListener(t.UI.DragDropEventType.Start,this._dragDropHandler,!1),e.addEventListener(t.UI.DragDropEventType.Over,this._dragDropHandler,!1),e.addEventListener(t.UI.DragDropEventType.End,this._dragDropHandler,!1),document.body.appendChild(e);let s=this._rescaler=document.createElement(t.P+"-rescale");s.handles=[t.UI.RescaleHandle.Right,t.UI.RescaleHandle.Bottom],s.addEventListener(t.UI.RescaleEventType.Start,this._resizeHandler,!1),s.addEventListener(t.UI.RescaleEventType.Rescale,this._resizeHandler,!1),s.addEventListener(t.UI.RescaleEventType.End,this._resizeHandler,!1),document.body.appendChild(s),t.Utils.isNullOrEmpty(this.columns)&&(this.columns=12),t.Utils.isNullOrEmpty(this.rows)&&(this.rows=1)}viewActivatedCallback(){super.viewActivatedCallback(),this.adapt()}propertyChangedCallback(e,t,r,s){super.propertyChangedCallback(e,t,r,s),this.adapt()}disconnectedCallback(){var e=this._dragDrop,r=this._rescaler;t.Utils.isNull(e)||(e.floater.remove(),e.removeEventListener(t.UI.DragDropEventType.Start,this._dragDropHandler,!1),e.removeEventListener(t.UI.DragDropEventType.Over,this._dragDropHandler,!1),e.removeEventListener(t.UI.DragDropEventType.End,this._dragDropHandler,!1),e.remove(),this._dragDrop=null),t.Utils.isNull(r)||(r.removeEventListener(t.UI.RescaleEventType.Start,this._resizeHandler,!1),r.removeEventListener(t.UI.RescaleEventType.Rescale,this._resizeHandler,!1),r.removeEventListener(t.UI.RescaleEventType.End,this._resizeHandler,!1),r.remove(),this._rescaler=null),super.disconnectedCallback()}_normalize(e,t=1){return"string"==typeof e?e:(null==e&&(e=t),this.unitPixels(e)+"px")}unitPixels(e){return e*(this.unit||8)}adapt(){this.style.marginTop=this.unitPixels(this.marginTop||0)+"px",this.style.marginBottom=this.unitPixels(this.marginBottom||0)+"px",this.style.gridTemplateColumns=`repeat(${this.columns||12}, 1fr)`;let e=this._normalize(this.minRowheight,3),t=this._normalize(this.rowheight||"auto");this.style.gridTemplateRows=`repeat(${this.rows||1}, minmax(${e}, ${t}))`,this.style.gridRowGap=this._normalize(this.rowGap,1),this.style.gridColumnGap=this._normalize(this.columnGap,1),this._setGridLines()}_setGridLines(){var e=0;const r=this.editing;if(r){const t=this.columns||12,r=t*(this.rows||1);e=r;for(let e=0;e<r;e++){for(;this._gridBoxes.length<=e;){let e=K();this.appendChild(e),this._gridBoxes.push(e)}let r=this._gridBoxes[e];const s=e%t,a=Math.floor(e/t);r.style.gridColumn=(s+1).toString(),r.style.gridRow=(a+1).toString()}}for(let t of this._gridBoxes.splice(e))t.remove();t.Utils.isNull(this._dragDrop)||t.Utils.isNull(this._rescaler)||(this._dragDrop.disabled=this._rescaler.disabled=!r,this._dragDrop.dropTargets=this._gridBoxes)}};Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"unit",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"marginTop",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"marginBottom",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"columns",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"rows",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.String})],Z.prototype,"minRowheight",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.String})],Z.prototype,"rowheight",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"rowGap",void 0),Y([t.Watch({emit:!1,reflectBack:!0,converter:t.PropertyConverters.Number})],Z.prototype,"columnGap",void 0),Y([t.Debounce(100)],Z.prototype,"adapt",null),Z=Y([t.CustomElement({tagName:t.P+"-widget-grid"})],Z);var ee=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const te=(e,r=":host",s=":host.entity")=>{const o={},i=e.metadata,n=a,l=[];o.properties=`{{ Pacem.CustomElementUtils.getWatchedProperty(${s}, '${i.prop}').config.converter }}`;const c=t.P+"-datacolumns";let p=i.extra||{};if(!t.Utils.isNullOrEmpty(p.properties))switch(typeof p.properties){case"string":o.properties=`{{ ${s}.${p.properties} }}`;break;case"function":const e="fn"+t.Utils.uniqueCode();n[e]=p.properties,o.properties=`{{ Pacem.Components.Cms.Functions.${e}(${r}), once }}`,l.push(e)}return l.length>0&&(o["on-unload"]=`{{ Pacem.Components.Cms.Functions.dismiss('${l.join("','")}') }}`),{tagName:c,attrs:o}},re={display:{name:"Columns"},props:[{prop:"header",type:"string",display:{cssClass:["form-minimal"],name:"Header"}},{prop:"content",type:o,display:{name:"Content"},extra:P}]};let se=class PacemDataColumnElement extends t.Components.PacemElement{propertyChangedCallback(e,t,r,s){switch(super.propertyChangedCallback(e,t,r,s),e){case"content":this.contentExpression=r;break;case"contentExpression":this.setAttribute("content",r||"")}}viewActivatedCallback(){super.viewActivatedCallback(),this._form.entity=this,this._form.metadata=f(re)}};ee([t.Watch({converter:t.PropertyConverters.String})],se.prototype,"header",void 0),ee([t.Watch({converter:t.PropertyConverters.String})],se.prototype,"content",void 0),ee([t.Watch({converter:t.PropertyConverters.String})],se.prototype,"contentExpression",void 0),ee([t.ViewChild(t.P+"-form")],se.prototype,"_form",void 0),se=ee([t.CustomElement({tagName:t.P+"-widget-datacolumn",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<${t.P}-form class="panel-body" autogenerate="true"></${t.P}-form>`})],se);let ae=class PacemDataColumnsElement extends r.Components.Scaffolding.PacemBaseElement{constructor(){super(...arguments),this._dropHandler=e=>{this.changeHandler(e)},this._columnifyMetadata=(e=this.properties)=>(e||[]).map(e=>({header:"function"==typeof e.display?.name?e.prop:e.display?.name||e.prop,content:`{{ ^item.${e.prop} }}`})).sort((e,t)=>e.header>t.header?1:-1)}get inputFields(){return[]}toggleReadonlyView(e){}onChange(e){return t.Utils.fromResult(this.value=this._repeater.datasource)}acceptValue(e){t.Utils.isNull(this._repeater)||(this._repeater.datasource=t.Utils.clone(e||[]))}getViewValue(e){return"[DataColumns]"}convertValueAttributeToProperty(e){return t.PropertyConverters.Json.convert(e,this)}viewActivatedCallback(){super.viewActivatedCallback(),this._propDragger.addEventListener(t.UI.DragDropEventType.End,this._dropHandler,!1),this._colDragger.addEventListener(t.UI.DragDropEventType.End,this._dropHandler,!1)}disconnectedCallback(){t.Utils.isNull(this._propDragger)||this._propDragger.removeEventListener(t.UI.DragDropEventType.End,this._dropHandler,!1),t.Utils.isNull(this._colDragger)||this._colDragger.removeEventListener(t.UI.DragDropEventType.End,this._dropHandler,!1),super.disconnectedCallback()}};ee([t.ViewChild(`${t.P}-repeater[columns]`)],ae.prototype,"_repeater",void 0),ee([t.ViewChild(`${t.P}-drag-drop[properties]`)],ae.prototype,"_propDragger",void 0),ee([t.ViewChild(`${t.P}-drag-drop[columns]`)],ae.prototype,"_colDragger",void 0),ee([t.ViewChild("div[drop-target]")],ae.prototype,"_dropTarget",void 0),ee([t.Watch({converter:t.PropertyConverters.Json})],ae.prototype,"properties",void 0),ae=ee([t.CustomElement({tagName:t.P+"-widget-datacolumns",shadow:t.Defaults.USE_SHADOW_ROOT,template:`<div class="${t.PCSS}-datacolumns">\n    <div class="datacolumns-main display-flex flex-fill">\n\n        <${t.P}-drag-drop mode="${t.UI.DragDataMode.Alias}" disabled="{{ :host.readonly }}" handle-selector="*[handle]"\n              drop-behavior="${t.UI.DropBehavior.InsertChild}" drop-targets="{{ [::_dropTarget] }}" columns></${t.P}-drag-drop>\n        <${t.P}-repeater class="display-flex flex-fill" columns>\n            \x3c!-- columns --\x3e\n            <div class="display-flex flex-nowrap" drop-target>\n                <template>\n                    <${t.P}-panel behaviors="{{ [::_colDragger] }}">\n                        <div class="${t.PCSS}-panel panel-side-left side-auto">\n                            <div class="panel-side">\n                                <${t.P}-button class="display-block button-flat icon-glyph-small" icon-glyph="drag_indicator" handle></${t.P}-button>\n                                <${t.P}-button class="display-block button-flat icon-glyph-small" on-click=":host.value.splice(^index, 1)" icon-glyph="clear"></${t.P}-button>\n                            </div>\n                            <div class="panel-heading">\n                                <${t.P}-text text="{{ ^item.header }}"></${t.P}-text>\n                            </div>\n                            <${t.P}-widget-datacolumn class="panel-body" header="{{ ^item.header, twoway }}" content-expression="{{ ^item.content, twoway }}"></${t.P}-widget-datacolumn>\n                        </div>\n                    </${t.P}-panel>\n                </template>\n            </div>\n        </${t.P}-repeater>\n\n    </div>\n    <${t.P}-panel class="datacolumns-props" hide="{{ :host.readonly }}">\n        <${t.P}-drag-drop mode="${t.UI.DragDataMode.Copy}" disabled="{{ :host.readonly }}" handle-selector="*[handle]"\n              drop-behavior="${t.UI.DropBehavior.InsertChild}" drop-targets="{{ [::_dropTarget] }}" properties></${t.P}-drag-drop>\n        <${t.P}-repeater datasource="{{ :host._columnifyMetadata(:host.properties) }}">\n        \x3c!-- properties --\x3e\n            <template>\n                <${t.P}-panel behaviors="{{ [::_propDragger] }}" class="${t.PCSS}-panel panel-side-left side-auto panel-primary panel-filled ${t.PCSS}-margin margin-bottom-1">\n                    <div class="panel-side">\n                        <${t.P}-button class="display-block button-flat icon-glyph-small" icon-glyph="drag_indicator" handle></${t.P}-button>\n                    </div>\n                    <div class="text-truncate panel-body">\n                        <${t.P}-span text="{{ ^item.header }}"></${t.P}-span>\n                    </div>\n                </${t.P}-panel>\n            </template>\n        </${t.P}-repeater>\n    </${t.P}-panel>\n</div>`})],ae);var oe=function(e,t,r,s){var a,o=arguments.length,i=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,s);else for(var n=e.length-1;n>=0;n--)(a=e[n])&&(i=(o<3?a(i):o>3?a(t,r,i):a(t,r))||i);return o>3&&i&&Object.defineProperty(t,r,i),i};const ie={display:{name:"DataColumn"},props:[{prop:"header",type:"string",display:{name:"Header"}},{prop:"content",type:o,display:{name:"Content"},extra:P}]},ne=v({display:{icon:"table_chart",name:"DataGrid",description:"DataGrid widget."},props:[{prop:"datasource",type:o,display:{name:"Datasource"},extra:t.Utils.extend({},P,{filter:e=>e instanceof _||e instanceof k})},{prop:"columns",type:te,display:{name:"Columns"},extra:{properties:"datarowMetadata"},props:f(ie)}]});function le(e,r=[]){const{head:s,body:a}=function(e=[]){const r=document.createDocumentFragment(),s=document.createDocumentFragment();let a=1;for(let o of e){const e=document.createElement("div");e.classList.add(t.PCSS+"-headcell"),e.textContent=o.header,r.appendChild(e);const i=new t.Components.PacemSpanElement;i.classList.add(t.PCSS+"-datacell","datacell-corners"),i.style.gridColumn=a.toString(),i.setAttribute("css","{{ {'grid-row': ^index+2} }}"),i.setAttribute("content",o.content),s.appendChild(i),a++}const o=new t.Components.PacemPanelElement;return o.classList.add(t.PCSS+"-datarow"),o.setAttribute("css","{{ {'grid-row': ^index+2} }}"),o.setAttribute("css-class","{{ {'datarow-alt': ^index % 2 === 1} }}"),o.style.gridColumn="1/"+(e.length+1),s.appendChild(o),{head:r,body:s}}(r),o=document.createElement("div");o.appendChild(s);const i=document.createElement("div");return i.appendChild(a),`<${t.P}-repeater datasource="{{ #${e}.datasource }}">\n    <div class="${t.PCSS}-datatable" style="grid-template-columns: ${function(e=[]){var t="";for(let r of e||[]){const e=r.width||1;t+="number"==typeof e?e+"fr ":"auto "}return t}(r)}">\n    ${o.innerHTML}\n    <template>${i.innerHTML}</template>\n</div></${t.P}-repeater>`}let ce=class PacemWidgetDataGridElement extends PacemUiWidgetElement{constructor(){super(ne),this.columns=[],this.datasource=[],this.datarowMetadata=[],this._builtUponDatasource=!1}_gridify(e=this.columns){var t="";for(let r of e||[]){const e=r.width||1;t+="number"==typeof e?e+"fr ":"auto "}return t}propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"columns":this.innerHTML=le(this.id,r);break;case"datasource":this._extractMetadataJustInCase(r)}}viewActivatedCallback(){super.viewActivatedCallback(),this.innerHTML=le(this.id,this.columns)}_seekArray(e){if(t.Utils.isArray(e))return e;if("object"==typeof e)for(let r in e){const s=this._seekArray(e[r]);if(!t.Utils.isNull(s))return s}return null}_extractMetadataJustInCase(e=this.datasource){if((t.Utils.isNullOrEmpty(this.datarowMetadata)||this._builtUponDatasource)&&!t.Utils.isNullOrEmpty(e)){const r=this._seekArray(e);if(!t.Utils.isNullOrEmpty(r)){const e=[],t=r[0];for(let r in t)e.push({prop:r,type:typeof t[r]});this.datarowMetadata=e,this._builtUponDatasource=!0}}}};oe([t.Watch({reflectBack:!0,converter:t.PropertyConverters.Json})],ce.prototype,"columns",void 0),oe([t.Watch({converter:t.PropertyConverters.Json})],ce.prototype,"datasource",void 0),oe([t.Watch({converter:t.PropertyConverters.Json})],ce.prototype,"datarowMetadata",void 0),oe([t.ViewChild(`.${t.PCSS}-datatable`)],ce.prototype,"_datatable",void 0),oe([t.ViewChild("template")],ce.prototype,"_template",void 0),oe([t.ViewChild(t.P+"-repeater")],ce.prototype,"_repeater",void 0),ce=oe([t.CustomElement({tagName:t.P+"-widget-datagrid"})],ce);var pe=Object.freeze({__proto__:null,ACCESS_TOKEN_METADATA:D,DATACOLUMNS_METADATA_TYPE:te,DEFAULT_METADATA:u,EXPRESSION_METADATA_TYPE:o,EXPRESSION_WIDGET_METADATA_EXTRA:P,get ExpressionSource(){return l},FETCH_CREDENTIALS_METADATA:{prop:"fetchCredentials",type:"string",dataType:"enumeration",display:{name:"Fetch Credentials"},extra:{enum:["same-origin","omit","include"]}},Functions:a,GRID_COLUMNS:12,LayoutChangeEventName:"layoutchange",PacemBearerWidgetElement:PacemBearerWidgetElement,PacemCompositeWidgetElement:PacemCompositeWidgetElement,get PacemDataColumnElement(){return se},get PacemDataColumnsElement(){return ae},get PacemElementPickerElement(){return n},PacemElementPickerElementBase:PacemElementPickerElementBase,get PacemExpressionElement(){return p},get PacemGridWidgetElement(){return Z},PacemUiWidgetElement:PacemUiWidgetElement,get PacemWidgetApiManifestElement(){return H},get PacemWidgetClockElement(){return N},get PacemWidgetDataElement(){return _},get PacemWidgetDataGridElement(){return ce},PacemWidgetElement:PacemWidgetElement,get PacemWidgetFetchElement(){return k},get PacemWidgetFetchParameterElement(){return U},get PacemWidgetPickerElement(){return X},get PacemWidgetTextElement(){return J},get PacemWidgetToolbarElement(){return C},get PacemWidgetTranslatorElement(){return O},Widget:class Widget{static findAll(e){return t.CustomElementUtils.findAll("."+y,r=>r instanceof PacemWidgetElement&&!t.Utils.isNullOrEmpty(r.id)&&(t.Utils.isNull(e)||e(r)))}},WidgetRegisterEvent:WidgetRegisterEvent,WidgetRegisterEventName:L,WidgetUnregisterEvent:WidgetUnregisterEvent,WidgetUnregisterEventName:F,buildWidgetMetadata:v,gridifyMetadata:f});const de="permissionedit";class PermissionEditEvent extends CustomEvent{constructor(e){super(de,{detail:e,cancelable:!1,bubbles:!0})}}var me=Object.freeze({__proto__:null,DATACOLUMNS_METADATA_TYPE:te,OpenApi:M,get PacemDataColumnElement(){return se},get PacemDataColumnsElement(){return ae},Permissible:class Permissible{static canEdit(e,t){return this._canDoSomethingToResource(e,t,e=>e.update)}static canRead(e,t){return this._canDoSomethingToResource(e,t,e=>e.read)}static canAdd(e,t){return this._canDoSomethingToResource(e,t,e=>e.create)}static canDelete(e,t){return this._canDoSomethingToResource(e,t,e=>e.delete)}static canTranslate(e,t){return this._canDoSomethingToResource(e,t,e=>e.translate)}static _canDoSomethingToResource(e,r,s){if(t.Utils.isNullOrEmpty(e)||t.Utils.isNull(r))return!1;var a=!0;if(r.permissions&&r.permissions.length>0){a=!1;for(let t of r.permissions)if(s(t)&&e[t.claimType]&&e[t.claimType].indexOf(t.claimValue)>=0)return!0}return a}},PermissionEditEvent:PermissionEditEvent,PermissionEditEventName:de}),he=Object.freeze({__proto__:null,Cms:me,Components:pe});e.DeepMerger.merge(he)}(Pacem,Pacem,Pacem,Pacem);
-//# sourceMappingURL=pacem-cms.min.js.map

package/dist/browser/pacem-core.js

@@ -1,5 +1,5 @@
 /*!
- * @pacem/pacem v1.0.0-bernoulli (https://js.pacem.it)
+ * @pacem/pacem v1.0.0-bessel (https://js.pacem.it)
  * Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
@@ -1048,6 +1048,13 @@
         static set scrollLeft(x) {
             window.scrollTo(x, Utils.scrollTop);
         }
+        static scrollTo(x, y = true, smooth = true) {
+            const yFirst = Utils.isNull(y) || typeof y === 'boolean';
+            const left = yFirst ? Utils.scrollLeft : x;
+            const top = yFirst ? x : y;
+            const behavior = (yFirst ? y : smooth) ? 'smooth' : 'instant';
+            window.scrollTo({ behavior, left, top });
+        }
         static get scrollTop() {
             return window.scrollY /*window.pageYOffset*/ || document.documentElement.scrollTop || document.body.scrollTop || 0;
         }
@@ -1490,6 +1497,20 @@
             super(PropertyChangeEventName, args);
         }
     }
+    // #region NAVIGATING
+    const RouterNavigatingEventName = 'navigating';
+    const RouterNavigateEventName = 'navigate';
+    class RouterNavigateEvent extends CustomTypedEvent {
+        constructor(path) {
+            super(RouterNavigateEventName, typeof path === 'string' ? { path } : path, { cancelable: false, bubbles: false });
+        }
+    }
+    class RouterNavigatingEvent extends CustomTypedEvent {
+        constructor(path) {
+            super(RouterNavigatingEventName, path, { cancelable: true, bubbles: false });
+        }
+    }
+    // #endregion
     //}
 
     class AnimationEvent extends CustomTypedEvent {
@@ -6152,28 +6173,24 @@
         else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
         return c > 3 && r && Object.defineProperty(target, key, r), r;
     };
-    //namespace Pacem {
-    const RouterNavigatingEventName = 'navigating';
-    const RouterNavigateEventName = 'navigate';
-    class RouterNavigateEvent extends CustomTypedEvent {
-        constructor(path) {
-            super(RouterNavigateEventName, typeof path === 'string' ? { path } : path, { cancelable: false, bubbles: false });
-        }
-    }
-    class RouterNavigatingEvent extends CustomTypedEvent {
-        constructor(path) {
-            super(RouterNavigatingEventName, path, { cancelable: true, bubbles: false });
-        }
-    }
-    //}
     //namespace Pacem.Components {
     const CHECK_PATTERN = /^([\w\.]:)?\/\/[^\/]+/;
     let PacemRouterElement = class PacemRouterElement extends PacemEventTarget {
         constructor() {
             super(...arguments);
+            this._onScroll = (e) => {
+                const scrollRestoration = this.scrollRestoration ?? true;
+                if (!scrollRestoration) {
+                    return;
+                }
+                const y = Math.floor(Utils.scrollTop);
+                window.history.replaceState(Utils.extend({}, window.history.state, { $scrollY: y }), document.title);
+            };
             this._onPopState = (evt) => {
                 if (!Utils.isNull(evt.state) && !this.#cancelingNavigation) {
-                    this.path = evt.state.$path;
+                    const state = evt.state;
+                    // navigate and scroll, just in case
+                    this.path = state.$path;
                 }
             };
         }
@@ -6225,14 +6242,18 @@
                     // exiting
                     return;
                 }
+                const newState = !poppingState
+                    ? Utils.extend({ $scrollY: 0 }, state)
+                    : Utils.extend({ $scrollY: 0 }, window.history.state /* < may include `$scrollY` */, state);
                 // this one actually does trigger the navigation in the outer world
-                this.state = state;
+                // 'cause it is usually bound to a PacemViewElement 'url'
+                this.state = newState;
+                window.history.scrollRestoration = (this.scrollRestoration ?? true) ? 'manual' : 'auto';
                 if (poppingState) {
-                    window.history.scrollRestoration = 'manual';
-                    window.history.replaceState(state, title);
+                    window.history.replaceState(newState, document.title);
                 }
                 else {
-                    window.history.pushState(state, title, path);
+                    window.history.pushState(newState, title, path);
                 }
                 if (!Utils.isNullOrEmpty(title)) {
                     document.title = title;
@@ -6257,6 +6278,7 @@
         connectedCallback() {
             super.connectedCallback();
             window.addEventListener('popstate', this._onPopState, false);
+            document.addEventListener('scroll', this._onScroll, false);
         }
         viewActivatedCallback() {
             super.viewActivatedCallback();
@@ -6266,6 +6288,7 @@
             }
         }
         disconnectedCallback() {
+            document.removeEventListener('scroll', this._onScroll, false);
             window.removeEventListener('popstate', this._onPopState, false);
             super.disconnectedCallback();
         }
@@ -6320,6 +6343,9 @@
     __decorate$l([
         Watch({ emit: false, converter: PropertyConverters.String })
     ], PacemRouterElement.prototype, "path", void 0);
+    __decorate$l([
+        Watch({ emit: false, reflectBack: true, converter: PropertyConverters.Boolean })
+    ], PacemRouterElement.prototype, "scrollRestoration", void 0);
     PacemRouterElement = __decorate$l([
         CustomElement({ tagName: P + '-router' })
     ], PacemRouterElement);
@@ -8762,10 +8788,6 @@
         RepeaterItemRemoveEventName: RepeaterItemRemoveEventName,
         ResizeEvent: ResizeEvent,
         ResizeEventName: ResizeEventName,
-        RouterNavigateEvent: RouterNavigateEvent,
-        RouterNavigateEventName: RouterNavigateEventName,
-        RouterNavigatingEvent: RouterNavigatingEvent,
-        RouterNavigatingEventName: RouterNavigatingEventName,
         ScrollEvent: ScrollEvent,
         ScrollEventName: ScrollEventName,
         StateEvent: StateEvent,
@@ -9097,6 +9119,10 @@
         Regex: Regex,
         Repeater: Repeater,
         RepeaterItem: RepeaterItem$1,
+        RouterNavigateEvent: RouterNavigateEvent,
+        RouterNavigateEventName: RouterNavigateEventName,
+        RouterNavigatingEvent: RouterNavigatingEvent,
+        RouterNavigatingEventName: RouterNavigatingEventName,
         Storage: Storage,
         TemplateElement: TemplateElement,
         Throttle: Throttle,