@pacem/pacem-cms 1.0.0-abel → 1.0.0-ampere

package/dist/browser/pacem-cms.js

@@ -1,3 +1,8 @@
+/*!
+ * @pacem/pacem-cms v1.0.0-ampere (https://js.pacem.it)
+ * Pacem (https://pacem.it)
+ * Licensed under Apache-2.0
+ */
 (function (pacemFoundation, pacemCore, pacemScaffolding, pacemUi) {
     'use strict';
 
@@ -306,41 +311,41 @@
     PacemExpressionElement = __decorate$d([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-expression', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-collapse class="${pacemCore.PCSS}-expression" collapse="{{ !:host._editing }}">
-    <div class="expression-builder ${pacemCore.PCSS}-grid grid-tiny-rowgap grid-tiny-colgap ${pacemCore.PCSS}-pad pad-bottom-2">
-        <div class="${pacemCore.PCSS}-cell">
-            <${pacemCore.P}-select value="{{ :host._source, twoway }}" class="display-block">
-                <${pacemCore.P}-data-item value="${ExpressionSource.Constant}" label="constant value"></${pacemCore.P}-data-item>
-                <${pacemCore.P}-data-item value="${ExpressionSource.PropertyReference}" label="property reference"></${pacemCore.P}-data-item>
-                <${pacemCore.P}-data-item value="${ExpressionSource.Expression}" label="complex expression"></${pacemCore.P}-data-item>
-            </${pacemCore.P}-select>
-        </div>
-
-        <${pacemCore.P}-panel class="${pacemCore.PCSS}-cell cols-hd-6" hide="{{ :host._source !== '${ExpressionSource.PropertyReference}' }}">
-            <${pacemCore.P}-element-picker value="{{ :host._sourceRef, twoway }}" selector="{{ :host.selector }}" filter="{{ :host.filter }}" labeler="{{ :host.labeler }}" class="display-block"></${pacemCore.P}-element-picker>
-        </${pacemCore.P}-panel>
-        <${pacemCore.P}-panel class="${pacemCore.PCSS}-cell cols-hd-6" hide="{{ :host._source !== '${ExpressionSource.PropertyReference}' }}">
-            <${pacemCore.P}-property-picker value="{{ :host._propRef, twoway }}" disabled="{{ !:host._sourceRef }}" target="{{ :host._sourceRef }}" on-change="::_editor.focus()" class="display-block"></${pacemCore.P}-property-picker>
-        </${pacemCore.P}-panel>
-
-        <${pacemCore.P}-panel class="${pacemCore.PCSS}-cell">
-            <${pacemCore.P}-textarea class="display-block" placeholder="{{ '{{ '+ (:host._source || '') +'... }}' }}" change-policy="${pacemScaffolding.Components.Scaffolding.ChangePolicy.Blur}"></${pacemCore.P}-textarea>
-        </${pacemCore.P}-panel>
-    </div>
-</${pacemCore.P}-collapse>
-<div class="${pacemCore.PCSS}-fieldset">
-    <div class="fieldset-left">
-        <div class="${pacemCore.PCSS}-fieldgroup ${pacemCore.PCSS}-viewfinder">
-            <div class="text-truncate ${pacemCore.PCSS}-pad pad-x-1"><span class="${pacemCore.PCSS}-viewfinder text-tech">{{ :host.value || '...' }}</span></div>
-            <${pacemCore.P}-panel class="fieldgroup-prepend">
-                <${pacemCore.P}-button class="flat edit ${pacemCore.PCSS}-pad pad-left-1" on-click=":host._editing = !:host._editing" hide="{{ :host.readonly }}"></${pacemCore.P}-button>
-            </${pacemCore.P}-panel>
-            <${pacemCore.P}-panel class="fieldgroup-append text-tech display-flex flex-middle flex-nowrap" hide="{{ $pacem.isNullOrEmpty(:host.value) }}">
-                <i class="${pacemCore.PCSS}-icon text-primary">keyboard_arrow_right</i>
-                <${pacemCore.P}-text text="?" class="bg-primary ${pacemCore.PCSS}-pad pad-left-1 pad-right-1 ${pacemCore.PCSS}-margin margin-right-1 text-truncate" eval></${pacemCore.P}-text>
-            </${pacemCore.P}-panel>
-        </div>
-    </div>
+            template: `<${pacemCore.P}-collapse class="${pacemCore.PCSS}-expression" collapse="{{ !:host._editing }}">
+    <div class="expression-builder ${pacemCore.PCSS}-grid grid-tiny-rowgap grid-tiny-colgap ${pacemCore.PCSS}-pad pad-bottom-2">
+        <div class="${pacemCore.PCSS}-cell">
+            <${pacemCore.P}-select value="{{ :host._source, twoway }}" class="display-block">
+                <${pacemCore.P}-data-item value="${ExpressionSource.Constant}" label="constant value"></${pacemCore.P}-data-item>
+                <${pacemCore.P}-data-item value="${ExpressionSource.PropertyReference}" label="property reference"></${pacemCore.P}-data-item>
+                <${pacemCore.P}-data-item value="${ExpressionSource.Expression}" label="complex expression"></${pacemCore.P}-data-item>
+            </${pacemCore.P}-select>
+        </div>
+
+        <${pacemCore.P}-panel class="${pacemCore.PCSS}-cell cols-hd-6" hide="{{ :host._source !== '${ExpressionSource.PropertyReference}' }}">
+            <${pacemCore.P}-element-picker value="{{ :host._sourceRef, twoway }}" selector="{{ :host.selector }}" filter="{{ :host.filter }}" labeler="{{ :host.labeler }}" class="display-block"></${pacemCore.P}-element-picker>
+        </${pacemCore.P}-panel>
+        <${pacemCore.P}-panel class="${pacemCore.PCSS}-cell cols-hd-6" hide="{{ :host._source !== '${ExpressionSource.PropertyReference}' }}">
+            <${pacemCore.P}-property-picker value="{{ :host._propRef, twoway }}" disabled="{{ !:host._sourceRef }}" target="{{ :host._sourceRef }}" on-change="::_editor.focus()" class="display-block"></${pacemCore.P}-property-picker>
+        </${pacemCore.P}-panel>
+
+        <${pacemCore.P}-panel class="${pacemCore.PCSS}-cell">
+            <${pacemCore.P}-textarea class="display-block" placeholder="{{ '{{ '+ (:host._source || '') +'... }}' }}" change-policy="${pacemScaffolding.Components.Scaffolding.ChangePolicy.Blur}"></${pacemCore.P}-textarea>
+        </${pacemCore.P}-panel>
+    </div>
+</${pacemCore.P}-collapse>
+<div class="${pacemCore.PCSS}-fieldset">
+    <div class="fieldset-left">
+        <div class="${pacemCore.PCSS}-fieldgroup ${pacemCore.PCSS}-viewfinder">
+            <div class="text-truncate ${pacemCore.PCSS}-pad pad-x-1"><span class="${pacemCore.PCSS}-viewfinder text-tech">{{ :host.value || '...' }}</span></div>
+            <${pacemCore.P}-panel class="fieldgroup-prepend">
+                <${pacemCore.P}-button class="flat edit ${pacemCore.PCSS}-pad pad-left-1" on-click=":host._editing = !:host._editing" hide="{{ :host.readonly }}"></${pacemCore.P}-button>
+            </${pacemCore.P}-panel>
+            <${pacemCore.P}-panel class="fieldgroup-append text-tech display-flex flex-middle flex-nowrap" hide="{{ $pacem.isNullOrEmpty(:host.value) }}">
+                <i class="${pacemCore.PCSS}-icon text-primary">keyboard_arrow_right</i>
+                <${pacemCore.P}-text text="?" class="bg-primary ${pacemCore.PCSS}-pad pad-left-1 pad-right-1 ${pacemCore.PCSS}-margin margin-right-1 text-truncate" eval></${pacemCore.P}-text>
+            </${pacemCore.P}-panel>
+        </div>
+    </div>
 </div>`
         })
     ], PacemExpressionElement);
@@ -493,17 +498,17 @@
     PacemWidgetToolbarElement = __decorate$c([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-widget-toolbar', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-span class="toolbar-text" content="{{ '<i class=&quot;${pacemCore.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) }}"></${pacemCore.P}-span>
-<div class="buttons ${pacemCore.PCSS}-buttonset ${pacemCore.PCSS}-pad ${pacemCore.PCSS}-margin pad-0 margin-left-2">
-    <div class="buttonset-left">
-        <${pacemCore.P}-button edit class="button edit" on-click=":host._edit($event)"></${pacemCore.P}-button>
-        <${pacemCore.P}-button permissions class="button" on-click=":host._editPermissions($event)" css-class="{{ {'button-success': ::target.permissions.length > 0} }}" icon-glyph="verified_user"></${pacemCore.P}-button>
-        <${pacemCore.P}-button remove class="button button-danger delete"></${pacemCore.P}-button>
-    </div>
-<div>
-<${pacemCore.P}-shell-proxy>
-    <${pacemCore.P}-modal-form core></${pacemCore.P}-modal-form>
-    <${pacemCore.P}-modal-form permissions></${pacemCore.P}-modal-form>
+            template: `<${pacemCore.P}-span class="toolbar-text" content="{{ '<i class=&quot;${pacemCore.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) }}"></${pacemCore.P}-span>
+<div class="buttons ${pacemCore.PCSS}-buttonset ${pacemCore.PCSS}-pad ${pacemCore.PCSS}-margin pad-0 margin-left-2">
+    <div class="buttonset-left">
+        <${pacemCore.P}-button edit class="button edit" on-click=":host._edit($event)"></${pacemCore.P}-button>
+        <${pacemCore.P}-button permissions class="button" on-click=":host._editPermissions($event)" css-class="{{ {'button-success': ::target.permissions.length > 0} }}" icon-glyph="verified_user"></${pacemCore.P}-button>
+        <${pacemCore.P}-button remove class="button button-danger delete"></${pacemCore.P}-button>
+    </div>
+<div>
+<${pacemCore.P}-shell-proxy>
+    <${pacemCore.P}-modal-form core></${pacemCore.P}-modal-form>
+    <${pacemCore.P}-modal-form permissions></${pacemCore.P}-modal-form>
 </${pacemCore.P}-shell-proxy>`
         })
     ], PacemWidgetToolbarElement);
@@ -834,7 +839,7 @@
     PacemWidgetFetchElement = __decorate$a([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-widget-fetch', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-fetch autofetch="false" fetching="{{ :host.fetching, twoway }}" debounce="100"
+            template: `<${pacemCore.P}-fetch autofetch="false" fetching="{{ :host.fetching, twoway }}" debounce="100"
 on-${pacemCore.Net.FetchResultEventName}=":host._onresult($event)" on-${pacemCore.Net.FetchErrorEventName}=":host._onerror($event)" on-${pacemCore.Net.FetchSuccessEventName}=":host._onsuccess($event)"></${pacemCore.P}-fetch><div hidden><${pacemCore.P}-content></${pacemCore.P}-content></div>`
         })
     ], PacemWidgetFetchElement);
@@ -1354,16 +1359,16 @@ on-${pacemCore.Net.FetchResultEventName}=":host._onresult($event)" on-${pacemCor
     PacemWidgetPickerElement = __decorate$3([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-widget-picker', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-repeater datasource="{{ :host.items }}">
-    <template>
-        <${pacemCore.P}-panel behaviors="{{ [::_dragDrop] }}" class="${pacemCore.PCSS}-widget-itempicker display-flex flex-fill flex-middle flex-nowrap">
-            <i class="${pacemCore.PCSS}-icon flex-auto" dragger>drag_indicator</i>
-            <${pacemCore.P}-icon icon="{{ ^item.metadata.display.icon }}" class="flex-auto ${pacemCore.PCSS}-margin margin-x-1"></${pacemCore.P}-icon>
-            <${pacemCore.P}-text text="{{ ^item.metadata.display.name }}"></${pacemCore.P}-text>
-        </${pacemCore.P}-panel>
-    </template>
-</${pacemCore.P}-repeater>
-<${pacemCore.P}-drag-drop handle-selector="i.${pacemCore.PCSS}-icon[dragger]"></${pacemCore.P}-drag-drop>
+            template: `<${pacemCore.P}-repeater datasource="{{ :host.items }}">
+    <template>
+        <${pacemCore.P}-panel behaviors="{{ [::_dragDrop] }}" class="${pacemCore.PCSS}-widget-itempicker display-flex flex-fill flex-middle flex-nowrap">
+            <i class="${pacemCore.PCSS}-icon flex-auto" dragger>drag_indicator</i>
+            <${pacemCore.P}-icon icon="{{ ^item.metadata.display.icon }}" class="flex-auto ${pacemCore.PCSS}-margin margin-x-1"></${pacemCore.P}-icon>
+            <${pacemCore.P}-text text="{{ ^item.metadata.display.name }}"></${pacemCore.P}-text>
+        </${pacemCore.P}-panel>
+    </template>
+</${pacemCore.P}-repeater>
+<${pacemCore.P}-drag-drop handle-selector="i.${pacemCore.PCSS}-icon[dragger]"></${pacemCore.P}-drag-drop>
 <${pacemCore.P}-content></${pacemCore.P}-content>`
         })
     ], PacemWidgetPickerElement);
@@ -1895,49 +1900,49 @@ on-${pacemCore.Net.FetchResultEventName}=":host._onresult($event)" on-${pacemCor
     PacemDataColumnsElement = __decorate$1([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-widget-datacolumns', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<div class="${pacemCore.PCSS}-datacolumns">
-    <div class="datacolumns-main display-flex flex-fill">
-
-        <${pacemCore.P}-drag-drop mode="${pacemCore.UI.DragDataMode.Alias}" disabled="{{ :host.readonly }}" handle-selector="*[handle]"
-              drop-behavior="${pacemCore.UI.DropBehavior.InsertChild}" drop-targets="{{ [::_dropTarget] }}" columns></${pacemCore.P}-drag-drop>
-        <${pacemCore.P}-repeater class="display-flex flex-fill" columns>
-            <!-- columns -->
-            <div class="display-flex flex-nowrap" drop-target>
-                <template>
-                    <${pacemCore.P}-panel behaviors="{{ [::_colDragger] }}">
-                        <div class="${pacemCore.PCSS}-panel panel-side-left side-auto">
-                            <div class="panel-side">
-                                <${pacemCore.P}-button class="display-block button-flat icon-glyph-small" icon-glyph="drag_indicator" handle></${pacemCore.P}-button>
-                                <${pacemCore.P}-button class="display-block button-flat icon-glyph-small" on-click=":host.value.splice(^index, 1)" icon-glyph="clear"></${pacemCore.P}-button>
-                            </div>
-                            <div class="panel-heading">
-                                <${pacemCore.P}-text text="{{ ^item.header }}"></${pacemCore.P}-text>
-                            </div>
-                            <${pacemCore.P}-widget-datacolumn class="panel-body" header="{{ ^item.header, twoway }}" content-expression="{{ ^item.content, twoway }}"></${pacemCore.P}-widget-datacolumn>
-                        </div>
-                    </${pacemCore.P}-panel>
-                </template>
-            </div>
-        </${pacemCore.P}-repeater>
-
-    </div>
-    <${pacemCore.P}-panel class="datacolumns-props" hide="{{ :host.readonly }}">
-        <${pacemCore.P}-drag-drop mode="${pacemCore.UI.DragDataMode.Copy}" disabled="{{ :host.readonly }}" handle-selector="*[handle]"
-              drop-behavior="${pacemCore.UI.DropBehavior.InsertChild}" drop-targets="{{ [::_dropTarget] }}" properties></${pacemCore.P}-drag-drop>
-        <${pacemCore.P}-repeater datasource="{{ :host._columnifyMetadata(:host.properties) }}">
-        <!-- properties -->
-            <template>
-                <${pacemCore.P}-panel behaviors="{{ [::_propDragger] }}" class="${pacemCore.PCSS}-panel panel-side-left side-auto panel-primary panel-filled ${pacemCore.PCSS}-margin margin-bottom-1">
-                    <div class="panel-side">
-                        <${pacemCore.P}-button class="display-block button-flat icon-glyph-small" icon-glyph="drag_indicator" handle></${pacemCore.P}-button>
-                    </div>
-                    <div class="text-truncate panel-body">
-                        <${pacemCore.P}-span text="{{ ^item.header }}"></${pacemCore.P}-span>
-                    </div>
-                </${pacemCore.P}-panel>
-            </template>
-        </${pacemCore.P}-repeater>
-    </${pacemCore.P}-panel>
+            template: `<div class="${pacemCore.PCSS}-datacolumns">
+    <div class="datacolumns-main display-flex flex-fill">
+
+        <${pacemCore.P}-drag-drop mode="${pacemCore.UI.DragDataMode.Alias}" disabled="{{ :host.readonly }}" handle-selector="*[handle]"
+              drop-behavior="${pacemCore.UI.DropBehavior.InsertChild}" drop-targets="{{ [::_dropTarget] }}" columns></${pacemCore.P}-drag-drop>
+        <${pacemCore.P}-repeater class="display-flex flex-fill" columns>
+            <!-- columns -->
+            <div class="display-flex flex-nowrap" drop-target>
+                <template>
+                    <${pacemCore.P}-panel behaviors="{{ [::_colDragger] }}">
+                        <div class="${pacemCore.PCSS}-panel panel-side-left side-auto">
+                            <div class="panel-side">
+                                <${pacemCore.P}-button class="display-block button-flat icon-glyph-small" icon-glyph="drag_indicator" handle></${pacemCore.P}-button>
+                                <${pacemCore.P}-button class="display-block button-flat icon-glyph-small" on-click=":host.value.splice(^index, 1)" icon-glyph="clear"></${pacemCore.P}-button>
+                            </div>
+                            <div class="panel-heading">
+                                <${pacemCore.P}-text text="{{ ^item.header }}"></${pacemCore.P}-text>
+                            </div>
+                            <${pacemCore.P}-widget-datacolumn class="panel-body" header="{{ ^item.header, twoway }}" content-expression="{{ ^item.content, twoway }}"></${pacemCore.P}-widget-datacolumn>
+                        </div>
+                    </${pacemCore.P}-panel>
+                </template>
+            </div>
+        </${pacemCore.P}-repeater>
+
+    </div>
+    <${pacemCore.P}-panel class="datacolumns-props" hide="{{ :host.readonly }}">
+        <${pacemCore.P}-drag-drop mode="${pacemCore.UI.DragDataMode.Copy}" disabled="{{ :host.readonly }}" handle-selector="*[handle]"
+              drop-behavior="${pacemCore.UI.DropBehavior.InsertChild}" drop-targets="{{ [::_dropTarget] }}" properties></${pacemCore.P}-drag-drop>
+        <${pacemCore.P}-repeater datasource="{{ :host._columnifyMetadata(:host.properties) }}">
+        <!-- properties -->
+            <template>
+                <${pacemCore.P}-panel behaviors="{{ [::_propDragger] }}" class="${pacemCore.PCSS}-panel panel-side-left side-auto panel-primary panel-filled ${pacemCore.PCSS}-margin margin-bottom-1">
+                    <div class="panel-side">
+                        <${pacemCore.P}-button class="display-block button-flat icon-glyph-small" icon-glyph="drag_indicator" handle></${pacemCore.P}-button>
+                    </div>
+                    <div class="text-truncate panel-body">
+                        <${pacemCore.P}-span text="{{ ^item.header }}"></${pacemCore.P}-span>
+                    </div>
+                </${pacemCore.P}-panel>
+            </template>
+        </${pacemCore.P}-repeater>
+    </${pacemCore.P}-panel>
 </div>`
         })
     ], PacemDataColumnsElement);
@@ -2015,10 +2020,10 @@ on-${pacemCore.Net.FetchResultEventName}=":host._onresult($event)" on-${pacemCor
         head0.appendChild(head);
         const body0 = document.createElement('div');
         body0.appendChild(body);
-        return `<${pacemCore.P}-repeater datasource="{{ #${id}.datasource }}">
-    <div class="${pacemCore.PCSS}-datatable" style="grid-template-columns: ${gridify(columns)}">
-    ${head0.innerHTML}
-    <template>${body0.innerHTML}</template>
+        return `<${pacemCore.P}-repeater datasource="{{ #${id}.datasource }}">
+    <div class="${pacemCore.PCSS}-datatable" style="grid-template-columns: ${gridify(columns)}">
+    ${head0.innerHTML}
+    <template>${body0.innerHTML}</template>
 </div></${pacemCore.P}-repeater>`;
     }
     let PacemWidgetDataGridElement = class PacemWidgetDataGridElement extends PacemUiWidgetElement {