@sme.up/ketchup 9.6.6-a → 9.6.7

package/dist/cjs/app-globals-3a1e7e63.js

@@ -0,0 +1,5 @@
+'use strict';
+
+const globalScripts = () => {};
+
+exports.globalScripts = globalScripts;

package/dist/cjs/{f-button-23ec3db5.js → f-button-3cc5c9ba.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-const index = require('./index-958d0399.js');
+const index = require('./index-380e4fcd.js');
 const fButtonDeclarations = require('./f-button-declarations-51ef6d9a.js');
-const fImage = require('./f-image-f3944c01.js');
+const fImage = require('./f-image-98e4e61d.js');
 
 /*-------------------------------------------------*/
 /*                C o m p o n e n t                */

package/dist/cjs/{f-cell-bcc51c0f.js → f-cell-192e5b87.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-const kupManager = require('./kup-manager-e1bfd4f8.js');
-const index = require('./index-958d0399.js');
-const fCheckbox = require('./f-checkbox-1fa28e76.js');
-const fTextField = require('./f-text-field-354b6c78.js');
-const fImage = require('./f-image-f3944c01.js');
-const fChip = require('./f-chip-63363ecf.js');
-const fButton = require('./f-button-23ec3db5.js');
+const kupManager = require('./kup-manager-72ad15fe.js');
+const index = require('./index-380e4fcd.js');
+const fCheckbox = require('./f-checkbox-e19055aa.js');
+const fTextField = require('./f-text-field-1efcecb6.js');
+const fImage = require('./f-image-98e4e61d.js');
+const fChip = require('./f-chip-be2dddb4.js');
+const fButton = require('./f-button-3cc5c9ba.js');
 
 /**
  * Props of the kup-list component.

package/dist/cjs/{f-checkbox-1fa28e76.js → f-checkbox-e19055aa.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const index = require('./index-958d0399.js');
+const index = require('./index-380e4fcd.js');
 
 /*-------------------------------------------------*/
 /*                C o m p o n e n t                */

package/dist/cjs/{f-chip-63363ecf.js → f-chip-be2dddb4.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-const index = require('./index-958d0399.js');
-const fImage = require('./f-image-f3944c01.js');
-const kupManager = require('./kup-manager-e1bfd4f8.js');
+const index = require('./index-380e4fcd.js');
+const fImage = require('./f-image-98e4e61d.js');
+const kupManager = require('./kup-manager-72ad15fe.js');
 
 /**
  * Types of the f-chip component.

package/dist/cjs/{f-image-f3944c01.js → f-image-98e4e61d.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const index = require('./index-958d0399.js');
+const index = require('./index-380e4fcd.js');
 
 /**
  * The type of a CSS step in CSS-drawing mode.
@@ -14,6 +14,9 @@ var FImageShape;
 /*-------------------------------------------------*/
 /*                C o m p o n e n t                */
 /*-------------------------------------------------*/
+let img;
+let placeholder;
+const HIDDEN_CLASS = 'f-image__hidden';
 const FImage = (props) => {
     let el;
     let style;
@@ -32,7 +35,7 @@ const FImage = (props) => {
                 '--kup_image_height': props.sizeY ? props.sizeY : '100%',
                 '--kup_image_width': props.sizeX ? props.sizeX : '100%',
             };
-            el = createIcon(props);
+            el = createIcon(props.resource, props.color);
         }
     }
     else if (props.data) {
@@ -49,33 +52,53 @@ const FImage = (props) => {
         }
     }
     return (index.h("div", Object.assign({ class: `f-image ${props.wrapperClass ? props.wrapperClass : ''} ` }, props.dataSet, { id: props.id, style: style, title: props.title, onClick: props.onClick }),
+        props.placeholderResource
+            ? createIcon(props.placeholderResource, props.color, 'f-image__placeholder ' + HIDDEN_CLASS)
+            : undefined,
         el,
         ...badgeCollection));
 };
 /*-------------------------------------------------*/
 /*                  M e t h o d s                  */
 /*-------------------------------------------------*/
-function createIcon(props) {
+function createIcon(icon, color, iconClass = 'f-image__icon') {
     const classObj = {
-        'f-image__icon': true,
+        [iconClass]: true,
     };
     const style = {
-        background: props.color ? props.color : `var(--kup-gray-color-70)`,
+        background: color ? color : `var(--kup-gray-color-70)`,
     };
-    if (props.resource.indexOf('--kup') > -1) {
-        let themeIcon = props.resource.replace('--', '');
+    if (icon.indexOf('--kup') > -1) {
+        let themeIcon = icon.replace('--', '');
         classObj['kup-icon'] = true;
         classObj[themeIcon] = true;
     }
     else {
-        const path = index.getAssetPath(`./assets/svg/${props.resource}.svg`);
+        const path = index.getAssetPath(`./assets/svg/${icon}.svg`);
         style.mask = `url('${path}') no-repeat center`;
         style.webkitMask = `url('${path}') no-repeat center`;
     }
-    return index.h("div", { class: classObj, style: style });
+    return (index.h("div", { class: classObj, ref: (el) => {
+            if (iconClass.indexOf('placeholder') > 1) {
+                placeholder = el;
+            }
+        }, style: style }));
 }
 function createImage(props) {
-    return index.h("img", { onLoad: props.onLoad, src: props.resource });
+    return (index.h("img", { class: props.placeholderResource ? HIDDEN_CLASS : '', onLoad: (e) => {
+            if (props.onLoad) {
+                props.onLoad(e);
+            }
+            if (placeholder) {
+                placeholder.classList.add(HIDDEN_CLASS);
+                img.classList.remove(HIDDEN_CLASS);
+            }
+        }, onError: () => {
+            if (placeholder) {
+                placeholder.classList.remove(HIDDEN_CLASS);
+                img.classList.add(HIDDEN_CLASS);
+            }
+        }, ref: (el) => (img = el), src: props.resource }));
 }
 function createBar(data) {
     const steps = [];

package/dist/cjs/{f-paginator-utils-60e05759.js → f-paginator-utils-44d07f52.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-const kupManager = require('./kup-manager-e1bfd4f8.js');
+const kupManager = require('./kup-manager-72ad15fe.js');
 const kupDates = require('./kup-dates-e22ee32c.js');
-const index = require('./index-958d0399.js');
-const fButton = require('./f-button-23ec3db5.js');
+const index = require('./index-380e4fcd.js');
+const fButton = require('./f-button-3cc5c9ba.js');
 const fButtonDeclarations = require('./f-button-declarations-51ef6d9a.js');
 
 /**

package/dist/cjs/{f-text-field-354b6c78.js → f-text-field-1efcecb6.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const index = require('./index-958d0399.js');
-const kupManager = require('./kup-manager-e1bfd4f8.js');
+const index = require('./index-380e4fcd.js');
+const kupManager = require('./kup-manager-72ad15fe.js');
 
 const dom = document.documentElement;
 /*-------------------------------------------------*/