@pacem/pacem 1.0.0-abel → 1.0.0-amaldi

package/dist/browser/pacem-plus.js

@@ -1,6 +1,6 @@
-/**
- * @pacem/pacem v1.0.0-abel (https://js.pacem.it)
- * Copyright 2026 Pacem (https://pacem.it)
+/*!
+ * @pacem/pacem v1.0.0-amaldi (https://js.pacem.it)
+ * Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
 (function (pacemFoundation, pacemCore, pacemUi, pacemScaffolding) {
@@ -139,26 +139,26 @@
     PacemCarouselElement = __decorate$9([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-carousel', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-repeater datasource="{{ :host.datasource }}">
-        <${pacemCore.P}-slideshow class="${pacemCore.PCSS}-carousel" adapter="{{ ::adapter }}" index="{{ :host.index, twoway }}" on-load="this.focus()">
-
-            <template>
-
-                <${pacemCore.P}-slide class="${pacemCore.PCSS}-carousel-item" css-class="{{ { '${pacemCore.PCSS}-carousel-previous': :host.isPrevious(^index, ::slideshow.index), '${pacemCore.PCSS}-carousel-next': :host.isNext(^index, ::slideshow.index), '${pacemCore.PCSS}-carousel-focus': ^index === ::slideshow.index } }}">
-                <${pacemCore.P}-a href="{{ ^item.url }}">
-                    <${pacemCore.P}-img disabled="{{ !:host.isCloseTo(^index, ::slideshow.index) }}" class="${pacemCore.PCSS}-carousel-splash" adapt="cover" src="{{ ^item.image }}"></${pacemCore.P}-img>
-                    <div class="${pacemCore.PCSS}-carousel-content">
-                        <div class="${pacemCore.PCSS}-carousel-caption">
-                            <h3><${pacemCore.P}-text text="{{ ^item.title }}"></${pacemCore.P}-text></h3>
-                            <${pacemCore.P}-panel class="paragraph" content="{{ ^item.content }}"></${pacemCore.P}-panel>
-                        </div>
-                    </div>
-                </${pacemCore.P}-a>
-                </${pacemCore.P}-slide>
-
-            </template>
-        </${pacemCore.P}-slideshow>
-
+            template: `<${pacemCore.P}-repeater datasource="{{ :host.datasource }}">
+        <${pacemCore.P}-slideshow class="${pacemCore.PCSS}-carousel" adapter="{{ ::adapter }}" index="{{ :host.index, twoway }}" on-load="this.focus()">
+
+            <template>
+
+                <${pacemCore.P}-slide class="${pacemCore.PCSS}-carousel-item" css-class="{{ { '${pacemCore.PCSS}-carousel-previous': :host.isPrevious(^index, ::slideshow.index), '${pacemCore.PCSS}-carousel-next': :host.isNext(^index, ::slideshow.index), '${pacemCore.PCSS}-carousel-focus': ^index === ::slideshow.index } }}">
+                <${pacemCore.P}-a href="{{ ^item.url }}">
+                    <${pacemCore.P}-img disabled="{{ !:host.isCloseTo(^index, ::slideshow.index) }}" class="${pacemCore.PCSS}-carousel-splash" adapt="cover" src="{{ ^item.image }}"></${pacemCore.P}-img>
+                    <div class="${pacemCore.PCSS}-carousel-content">
+                        <div class="${pacemCore.PCSS}-carousel-caption">
+                            <h3><${pacemCore.P}-text text="{{ ^item.title }}"></${pacemCore.P}-text></h3>
+                            <${pacemCore.P}-panel class="paragraph" content="{{ ^item.content }}"></${pacemCore.P}-panel>
+                        </div>
+                    </div>
+                </${pacemCore.P}-a>
+                </${pacemCore.P}-slide>
+
+            </template>
+        </${pacemCore.P}-slideshow>
+
     </${pacemCore.P}-repeater><${pacemCore.P}-adapter pausable="{{ :host.pausable }}" class="${pacemCore.PCSS}-carousel-adapter" interval="{{ :host.interval }}"></${pacemCore.P}-adapter>`
         })
     ], PacemCarouselElement);
@@ -792,19 +792,19 @@
     };
     const UI$2 = pacemUi.Components.UI;
     function getGallerySlideShowTemplate(captionTemplate = getDefaultCaptionTemplate(), imageProperty = 'image') {
-        return `<${pacemCore.P}-slide class="${pacemCore.PCSS}-gallery-item"
-css-class="{{ { '${pacemCore.PCSS}-gallery-previous': :host.isPrevious(^index, ::_slideshow.index), '${pacemCore.PCSS}-gallery-next': :host.isNext(^index, ::_slideshow.index), '${pacemCore.PCSS}-gallery-focus': ^index === ::_slideshow.index } }}"
->
-            <${pacemCore.P}-img src="{{ ^item.${imageProperty} }}" disabled="{{ !::_lightbox.show || !(:host.isCloseTo(^index, ::_slideshow.index) || ^index === ::_slideshow.index) }}"
-css="{{ {'visibility': (:host._poppingUp ? 'hidden' : ''), 'transition': (:host._poppingUp ? 'none' : '')} }}" class="${pacemCore.PCSS}-gallery-splash" adapt="contain"></${pacemCore.P}-img>
-
-${captionTemplate}
-
+        return `<${pacemCore.P}-slide class="${pacemCore.PCSS}-gallery-item"
+css-class="{{ { '${pacemCore.PCSS}-gallery-previous': :host.isPrevious(^index, ::_slideshow.index), '${pacemCore.PCSS}-gallery-next': :host.isNext(^index, ::_slideshow.index), '${pacemCore.PCSS}-gallery-focus': ^index === ::_slideshow.index } }}"
+>
+            <${pacemCore.P}-img src="{{ ^item.${imageProperty} }}" disabled="{{ !::_lightbox.show || !(:host.isCloseTo(^index, ::_slideshow.index) || ^index === ::_slideshow.index) }}"
+css="{{ {'visibility': (:host._poppingUp ? 'hidden' : ''), 'transition': (:host._poppingUp ? 'none' : '')} }}" class="${pacemCore.PCSS}-gallery-splash" adapt="contain"></${pacemCore.P}-img>
+
+${captionTemplate}
+
             </${pacemCore.P}-slide>`;
     }
     function getDefaultCaptionTemplate(captionProperty = 'caption') {
-        return `<${pacemCore.P}-panel hide="{{ $pacem.isNullOrEmpty(^item.${captionProperty}) }}" class="${pacemCore.PCSS}-gallery-caption gallery-caption-default">
-        <${pacemCore.P}-span class="paragraph" text="{{ ^item.${captionProperty} }}"></${pacemCore.P}-span>
+        return `<${pacemCore.P}-panel hide="{{ $pacem.isNullOrEmpty(^item.${captionProperty}) }}" class="${pacemCore.PCSS}-gallery-caption gallery-caption-default">
+        <${pacemCore.P}-span class="paragraph" text="{{ ^item.${captionProperty} }}"></${pacemCore.P}-span>
     </${pacemCore.P}-panel>`;
     }
     let PacemGalleryElement = class PacemGalleryElement extends UI$2.PacemAdaptedIterativeElement {
@@ -955,14 +955,14 @@ ${captionTemplate}
     PacemGalleryElement = __decorate$6([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-gallery', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-lightbox class="${pacemCore.PCSS}-gallery">
-    <${pacemCore.P}-repeater>
-        <${pacemCore.P}-slideshow adapter="{{ ::_adapter }}" index="{{ :host.index, twoway }}" hide="{{ !::_lightbox.show }}">
-            <${pacemCore.P}-template-proxy></${pacemCore.P}-template-proxy>
-        </${pacemCore.P}-slideshow>
-    </${pacemCore.P}-repeater>
-<${pacemCore.P}-adapter class="${pacemCore.PCSS}-gallery-adapter"></${pacemCore.P}-adapter>
-</${pacemCore.P}-lightbox>
+            template: `<${pacemCore.P}-lightbox class="${pacemCore.PCSS}-gallery">
+    <${pacemCore.P}-repeater>
+        <${pacemCore.P}-slideshow adapter="{{ ::_adapter }}" index="{{ :host.index, twoway }}" hide="{{ !::_lightbox.show }}">
+            <${pacemCore.P}-template-proxy></${pacemCore.P}-template-proxy>
+        </${pacemCore.P}-slideshow>
+    </${pacemCore.P}-repeater>
+<${pacemCore.P}-adapter class="${pacemCore.PCSS}-gallery-adapter"></${pacemCore.P}-adapter>
+</${pacemCore.P}-lightbox>
 <${pacemCore.P}-shell-proxy><div class="${pacemCore.PCSS}-gallery-hero-target"></div></${pacemCore.P}-shell-proxy>`
         })
     ], PacemGalleryElement);
@@ -1133,28 +1133,28 @@ ${captionTemplate}
     PacemModalFormElement = PacemModalFormElement_1 = __decorate$5([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-modal-form', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-lightbox modal="true" logger="{{ :host.logger }}">
-        <${pacemCore.P}-form wrapper>
-            <${pacemCore.P}-form logger="{{ :host.logger }}" on-submit=":host._onSubmit($event)" readonly="{{ :host.readonly }}" entity="{{ :host.state, twoway }}" on-success=":host._broadcast($event)"
-                on-fail=":host._broadcast($event)" success="{{ :host.success, twoway }}" fail="{{ :host.fail, twoway }}" autogenerate="{{ !$pacem.isNull($this.entity) }}" metadata="{{ :host.metadata }}"
-                fetch-headers="{{ :host.fetchHeaders }}" fetch-credentials="{{ :host.fetchCredentials }}" sudden-validation="{{ :host.suddenValidation }}"></${pacemCore.P}-form>
-        </${pacemCore.P}-form>
-        <${pacemCore.P}-fetch logger="{{ :host.logger }}" method="{{ :host.method }}" headers="{{ :host.fetchHeaders }}" credentials="{{ :host.fetchCredentials }}" autofetch="false" url="{{ :host.action }}"></${pacemCore.P}-fetch>
-    <div class="${pacemCore.PCSS}-dialog-buttons ${pacemCore.PCSS}-buttonset buttons" slot="bottom">
-        <div class="buttonset-left">
-        <${pacemCore.P}-button on-click=":host._submit($event)" css-class="{{ {'buttonset-last': :host.readonly} }}" type="submit"
-            class="button primary button-size size-small" disabled="{{ (:host.suddenValidation && !:host.readonly && !(::_form.valid && ::_form.dirty)) || ::_fetcher.fetching }}">
-            <${pacemCore.P}-panel class="submit-spinner ${pacemCore.PCSS}-anim anim-pop" hide="{{ !::_form.fetching }}"><i class="${pacemCore.PCSS}-icon ${pacemCore.PCSS}-anim anim-rotate rotate-uniform display-block">refresh</i></${pacemCore.P}-panel>
-            <${pacemCore.P}-text text="{{ :host.okCaption || 'OK' }}"></${pacemCore.P}-text>
-        </${pacemCore.P}-button>
-        <${pacemCore.P}-button on-click=":host._cancel($event)" hide="{{ :host.readonly }}" class="button button-size size-small" disabled="{{ ::_fetcher.fetching }}"><${pacemCore.P}-text text="{{ :host.cancelCaption || 'Cancel' }}"></${pacemCore.P}-text></${pacemCore.P}-button>
-    </div></div>
-    <div class="${pacemCore.PCSS}-dialog-heading" slot="top">
-        <${pacemCore.P}-content></${pacemCore.P}-content>
-    </div>
-    <div class="pos-absolute absolute-top absolute-right absolute-left absolute-bottom overflow-hidden ${pacemCore.PCSS}-inert display-flex flex-center flex-middle">
-        <${pacemCore.P}-loader type="{{ :host.loaderType }}" class="loader-primary loader-smaller ${pacemCore.PCSS}-anim anim-pop" active="{{ ::_fetcher.fetching }}"></${pacemCore.P}-loader>
-    </div>
+            template: `<${pacemCore.P}-lightbox modal="true" logger="{{ :host.logger }}">
+        <${pacemCore.P}-form wrapper>
+            <${pacemCore.P}-form logger="{{ :host.logger }}" on-submit=":host._onSubmit($event)" readonly="{{ :host.readonly }}" entity="{{ :host.state, twoway }}" on-success=":host._broadcast($event)"
+                on-fail=":host._broadcast($event)" success="{{ :host.success, twoway }}" fail="{{ :host.fail, twoway }}" autogenerate="{{ !$pacem.isNull($this.entity) }}" metadata="{{ :host.metadata }}"
+                fetch-headers="{{ :host.fetchHeaders }}" fetch-credentials="{{ :host.fetchCredentials }}" sudden-validation="{{ :host.suddenValidation }}"></${pacemCore.P}-form>
+        </${pacemCore.P}-form>
+        <${pacemCore.P}-fetch logger="{{ :host.logger }}" method="{{ :host.method }}" headers="{{ :host.fetchHeaders }}" credentials="{{ :host.fetchCredentials }}" autofetch="false" url="{{ :host.action }}"></${pacemCore.P}-fetch>
+    <div class="${pacemCore.PCSS}-dialog-buttons ${pacemCore.PCSS}-buttonset buttons" slot="bottom">
+        <div class="buttonset-left">
+        <${pacemCore.P}-button on-click=":host._submit($event)" css-class="{{ {'buttonset-last': :host.readonly} }}" type="submit"
+            class="button primary button-size size-small" disabled="{{ (:host.suddenValidation && !:host.readonly && !(::_form.valid && ::_form.dirty)) || ::_fetcher.fetching }}">
+            <${pacemCore.P}-panel class="submit-spinner ${pacemCore.PCSS}-anim anim-pop" hide="{{ !::_form.fetching }}"><i class="${pacemCore.PCSS}-icon ${pacemCore.PCSS}-anim anim-rotate rotate-uniform display-block">refresh</i></${pacemCore.P}-panel>
+            <${pacemCore.P}-text text="{{ :host.okCaption || 'OK' }}"></${pacemCore.P}-text>
+        </${pacemCore.P}-button>
+        <${pacemCore.P}-button on-click=":host._cancel($event)" hide="{{ :host.readonly }}" class="button button-size size-small" disabled="{{ ::_fetcher.fetching }}"><${pacemCore.P}-text text="{{ :host.cancelCaption || 'Cancel' }}"></${pacemCore.P}-text></${pacemCore.P}-button>
+    </div></div>
+    <div class="${pacemCore.PCSS}-dialog-heading" slot="top">
+        <${pacemCore.P}-content></${pacemCore.P}-content>
+    </div>
+    <div class="pos-absolute absolute-top absolute-right absolute-left absolute-bottom overflow-hidden ${pacemCore.PCSS}-inert display-flex flex-center flex-middle">
+        <${pacemCore.P}-loader type="{{ :host.loaderType }}" class="loader-primary loader-smaller ${pacemCore.PCSS}-anim anim-pop" active="{{ ::_fetcher.fetching }}"></${pacemCore.P}-loader>
+    </div>
 </${pacemCore.P}-lightbox>`
         })
     ], PacemModalFormElement);
@@ -1460,10 +1460,10 @@ ${captionTemplate}
     PacemSearchElement = __decorate$3([
         pacemCore.CustomElement({
             tagName: pacemCore.P + '-search', shadow: pacemCore.Defaults.USE_SHADOW_ROOT,
-            template: `<${pacemCore.P}-fetch debounce="800" url="{{ :host.url }}" method="{{ :host.method }}">
-</${pacemCore.P}-fetch><${pacemCore.P}-input-search value="{{ :host.hint, twoway }}"></${pacemCore.P}-input-search>
-<${pacemCore.P}-repeater datasource="{{ ::_fetch.result }}">
-    <${pacemCore.P}-content></${pacemCore.P}-content>
+            template: `<${pacemCore.P}-fetch debounce="800" url="{{ :host.url }}" method="{{ :host.method }}">
+</${pacemCore.P}-fetch><${pacemCore.P}-input-search value="{{ :host.hint, twoway }}"></${pacemCore.P}-input-search>
+<${pacemCore.P}-repeater datasource="{{ ::_fetch.result }}">
+    <${pacemCore.P}-content></${pacemCore.P}-content>
 </${pacemCore.P}-repeater>`
         })
     ], PacemSearchElement);
@@ -1993,12 +1993,12 @@ ${captionTemplate}
         pacemCore.CustomElement({ tagName: pacemCore.P + '-datacolumn' })
     ], PacemDataColumnElement);
     function headColumnHtml(c) {
-        return `<${pacemCore.P}-headcell metadata="{{ :host._getColumnMetadata('${c.prop}') }}" state="{{ :host._columnState.${c.prop} }}" grid-state="{{ :host._gridState }}"
-on-${DataColumnSortEventName}=":host._broadcastSortCommand($event)"
+        return `<${pacemCore.P}-headcell metadata="{{ :host._getColumnMetadata('${c.prop}') }}" state="{{ :host._columnState.${c.prop} }}" grid-state="{{ :host._gridState }}"
+on-${DataColumnSortEventName}=":host._broadcastSortCommand($event)"
 on-${DataColumnRescaleEventName}=":host._broadcastRescaleCommand($event)"></${pacemCore.P}-headcell>`;
     }
     function dataColumnHtml(c, extra) {
-        return `<${pacemCore.P}-datacell metadata="{{ :host._getColumnMetadata('${c.prop}') }}" state="{{ :host._columnState.${c.prop} }}" grid-state="{{ :host._gridState }}"
+        return `<${pacemCore.P}-datacell metadata="{{ :host._getColumnMetadata('${c.prop}') }}" state="{{ :host._columnState.${c.prop} }}" grid-state="{{ :host._gridState }}"
 dataitem="{{ ^item }}" rowindex="{{ ^index }}" ${extra}></${pacemCore.P}-datacell>`;
     }
     let PacemDataGridElement = class PacemDataGridElement extends pacemCore.Components.PacemItemsContainerElement {
@@ -2167,13 +2167,13 @@ dataitem="{{ ^item }}" rowindex="{{ ^index }}" ${extra}></${pacemCore.P}-datacel
                 datacells += dataColumnHtml(c, extraUi);
             }
             datacells += `<${pacemCore.P}-panel class="${pacemCore.PCSS}-datarow" css-class="{{ {'datarow-alt': ^index % 2 === 1, 'datarow-first': ^index === 0, 'datarow-last': ^index === (:host.datasource.length - 1), 'datarow-selected': :host._gridState.selectedRows.indexOf(^index) >= 0 } }}" style="grid-column: 1 /span ${colCount};" css="{{ {'grid-row': ^index+2} }}"></${pacemCore.P}-panel>`;
-            const html = `<${pacemCore.P}-repeater datasource="{{ :host.datasource }}">
-<${pacemCore.P}-panel class="${pacemCore.PCSS}-datatable" css="{{ {'grid-template-columns': :host._getColumnSizes(:host._columnState, '${css.trimEnd()}', :host._gridState) } }}">
-    ${headcells}
-    <template>
-    ${datacells}
-    </template>
-    ${footcells}
+            const html = `<${pacemCore.P}-repeater datasource="{{ :host.datasource }}">
+<${pacemCore.P}-panel class="${pacemCore.PCSS}-datatable" css="{{ {'grid-template-columns': :host._getColumnSizes(:host._columnState, '${css.trimEnd()}', :host._gridState) } }}">
+    ${headcells}
+    <template>
+    ${datacells}
+    </template>
+    ${footcells}
 </${pacemCore.P}-panel>`;
             container.innerHTML = html;
         }