@sme.up/ketchup 7.4.2 → 8.0.0

package/dist/collection/components/kup-snackbar/kup-snackbar.css

@@ -17,6 +17,7 @@
 }
 
 #kup-component {
+  box-sizing: border-box;
   display: flex;
   justify-content: center;
   height: 100%;
@@ -31,7 +32,7 @@
   box-shadow: var(--kup-box-shadow);
   color: var(--kup-navbar-color);
   display: flex;
-  justify-content: flex-start;
+  justify-content: space-between;
   max-width: 672px;
   min-height: 48px;
   min-width: 344px;
@@ -39,7 +40,7 @@
 .snackbar__text {
   padding: 14px 16px;
   pointer-events: all;
-  white-space: nowrap;
+  word-break: break-word;
 }
 .snackbar__buttons {
   --kup-button-primary-color: var(--kup-navbar-color);
@@ -52,7 +53,7 @@
   justify-content: flex-end;
   margin-right: 8px;
   pointer-events: all;
-  width: 100%;
+  width: max-content;
 }
 .snackbar__close {
   --kup-button-font-size: 11px;

package/dist/collection/components/kup-spinner/kup-spinner.css

@@ -779,8 +779,7 @@
 @keyframes sk-spinner-bar-v1 {
   from {
     left: -25%;
-    background: var(--kup-spinner-color);
-    /* fallback */
+    background: var(--kup-spinner-color); /* fallback */
     background: linear-gradient(to left, var(--kup-spinner-color) 0, rgba(255, 255, 255, 0) 100%);
   }
   50% {
@@ -788,8 +787,7 @@
   }
   to {
     left: -25%;
-    background: var(--kup-spinner-color);
-    /* fallback */
+    background: var(--kup-spinner-color); /* fallback */
     background: linear-gradient(to right, var(--kup-spinner-color) 0, rgba(255, 255, 255, 0) 100%);
   }
 }

package/dist/collection/components/kup-tree/kup-tree.js

@@ -1,3 +1,11 @@
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+  if (kind === "a" && !f)
+    throw new TypeError("Private accessor was defined without a getter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+    throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _KupTree_kupManager;
 import { forceUpdate, getAssetPath, h, Host, } from '@stencil/core';
 import { TotalLabel, TotalMode, } from './../kup-data-table/kup-data-table-declarations';
 import { KupTreeProps, treeMainColumnName, KupTreeExpansionMode, } from './kup-tree-declarations';
@@ -32,7 +40,7 @@ export class KupTree {
     /**
      * Instance of the KupManager class.
      */
-    this.kupManager = kupManagerInstance();
+    _KupTree_kupManager.set(this, kupManagerInstance());
     /**
      * Reference to the column menu card.
      */
@@ -97,31 +105,31 @@ export class KupTree {
   persistState() {
     if (this.store && this.stateId) {
       let somethingChanged = false;
-      if (!this.kupManager.objects.deepEqual(this.state.filters, this.filters)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.filters, this.filters)) {
         this.state.filters = Object.assign({}, this.filters);
         somethingChanged = true;
       }
-      if (!this.kupManager.objects.deepEqual(this.state.density, this.density)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.density, this.density)) {
         this.state.density = this.density;
         somethingChanged = true;
       }
-      if (!this.kupManager.objects.deepEqual(this.state.showFilters, this.showFilters)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.showFilters, this.showFilters)) {
         this.state.showFilters = this.showFilters;
         somethingChanged = true;
       }
-      if (!this.kupManager.objects.deepEqual(this.state.showFooter, this.showFooter)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.showFooter, this.showFooter)) {
         this.state.showFooter = this.showFooter;
         somethingChanged = true;
       }
-      if (!this.kupManager.objects.deepEqual(this.state.totals, this.totals)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.totals, this.totals)) {
         this.state.totals = Object.assign({}, this.totals);
         somethingChanged = true;
       }
-      if (!this.kupManager.objects.deepEqual(this.state.globalFilter, this.globalFilter)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.globalFilter, this.globalFilter)) {
         this.state.globalFilter = this.globalFilter;
         somethingChanged = true;
       }
-      if (!this.kupManager.objects.deepEqual(this.state.globalFilterValue, this.globalFilterValue)) {
+      if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.deepEqual(this.state.globalFilterValue, this.globalFilterValue)) {
         this.state.globalFilterValue = this.globalFilterValue;
         somethingChanged = true;
       }
@@ -252,7 +260,7 @@ export class KupTree {
    * @param {KupDataColumn} column - Column to hide.
    */
   async hideColumn(column) {
-    this.kupManager.data.column.hide(this.columns, [column.name]);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").data.column.hide(this.columns, [column.name]);
     this.kupColumnRemove.emit({
       comp: this,
       id: this.rootElement.id,
@@ -336,21 +344,21 @@ export class KupTree {
     return this.treeColumnVisible;
   }
   checkScrollOnHover() {
-    if (!this.kupManager.scrollOnHover.isRegistered(this.treeWrapperRef)) {
+    if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").scrollOnHover.isRegistered(this.treeWrapperRef)) {
       if (this.scrollOnHover) {
-        this.kupManager.scrollOnHover.register(this.treeWrapperRef);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").scrollOnHover.register(this.treeWrapperRef);
       }
     }
     else {
       if (!this.scrollOnHover) {
-        this.kupManager.scrollOnHover.unregister(this.treeWrapperRef);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").scrollOnHover.unregister(this.treeWrapperRef);
       }
     }
   }
   onKupTreeNodeDblClick(treeNodeData, treeNodePath) {
     for (let index = 0; index < this.clickTimeout.length; index++) {
       clearTimeout(this.clickTimeout[index]);
-      this.kupManager.debug.logMessage(this, 'Cleared hdlTreeNodeClick timeout(' +
+      __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.logMessage(this, 'Cleared hdlTreeNodeClick timeout(' +
         this.clickTimeout[index] +
         ').');
     }
@@ -539,7 +547,7 @@ export class KupTree {
   }
   contextMenuHandler(e) {
     e.preventDefault();
-    const details = this.getEventDetails(this.getEventPath(e.target), e);
+    const details = this.getEventDetails(__classPrivateFieldGet(this, _KupTree_kupManager, "f").getEventPath(e.target, this.rootElement), e);
     if (details.area === 'header') {
       if (details.th && details.column) {
         this.openColumnMenu(details.column.name);
@@ -555,18 +563,6 @@ export class KupTree {
     }
     return details;
   }
-  getEventPath(currentEl) {
-    const path = [];
-    while (currentEl &&
-      currentEl !== this.rootElement &&
-      currentEl !== document.body) {
-      path.push(currentEl);
-      currentEl = currentEl.parentNode
-        ? currentEl.parentNode
-        : currentEl.host;
-    }
-    return path;
-  }
   // When a TreeNode can be selected
   hdlTreeNodeClick(e, treeNodeData, treeNodePath) {
     if (this.expansionMode.toLowerCase() ===
@@ -574,7 +570,9 @@ export class KupTree {
       (this.expansionMode.toLowerCase() === KupTreeExpansionMode.NODE &&
         !treeNodeData.expandable)) {
       const td = e
-        ? this.getEventPath(e.target).find((el) => {
+        ? __classPrivateFieldGet(this, _KupTree_kupManager, "f")
+          .getEventPath(e.target, this.rootElement)
+          .find((el) => {
           if (el.tagName === 'TD')
             return el;
         })
@@ -766,10 +764,10 @@ export class KupTree {
   refreshStructureState() {
     if (this.data) {
       if (this.data.columns) {
-        this.kupManager.debug.logMessage(this, 'Detected KupDataDataset: setting up tree as grid.', KupDebugCategory.WARNING);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.logMessage(this, 'Detected KupDataDataset: setting up tree as grid.', KupDebugCategory.WARNING);
         const data = this.data;
         this.columns = data.columns;
-        this.data = this.kupManager.data.row.toNode(data);
+        this.data = __classPrivateFieldGet(this, _KupTree_kupManager, "f").data.row.toNode(data);
         this.showColumns = true;
         this.showHeader = true;
       }
@@ -832,7 +830,7 @@ export class KupTree {
       //---- Filter ----
       let filter = null;
       if (this.filtersColumnMenuInstance.hasFiltersForColumn(this.filters, column)) {
-        const svgLabel = this.kupManager.language.translate(KupLanguageGeneric.REMOVE_FILTERS) + `: '${this.getFilterValueForTooltip(column)}'`;
+        const svgLabel = __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageGeneric.REMOVE_FILTERS) + `: '${this.getFilterValueForTooltip(column)}'`;
         /**
          * When column has a filter but filters must not be displayed, shows an icon to remove the filter.
          * Upon click, the filter gets removed.
@@ -907,9 +905,9 @@ export class KupTree {
         expandClass += ` ${KupThemeIconValues.COLLAPSED.replace('--', '')}`;
       }
     }
-    let treeExpandIcon = (h("span", { title: this.kupManager.language.translate(KupLanguageGeneric.EXPAND) +
+    let treeExpandIcon = (h("span", { title: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageGeneric.EXPAND) +
         '/' +
-        this.kupManager.language.translate(KupLanguageGeneric.COLLAPSE) +
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageGeneric.COLLAPSE) +
         ' (CTRL + Click)', class: expandClass, onClick: this.expansionMode.toLowerCase() ===
         KupTreeExpansionMode.DROPDOWN && !treeNodeData.disabled
         ? (event) => {
@@ -982,8 +980,8 @@ export class KupTree {
       }
     }
     let title = undefined;
-    if (!this.kupManager.objects.isEmptyKupObj(treeNodeData.obj) &&
-      this.kupManager.debug.isDebug()) {
+    if (!__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.isEmptyKupObj(treeNodeData.obj) &&
+      __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.isDebug()) {
       title =
         treeNodeData.obj.t +
           '; ' +
@@ -1006,7 +1004,7 @@ export class KupTree {
           'mdc-ripple-surface': this.ripple &&
             !this.showColumns &&
             !treeNodeData.disabled,
-          'is-obj': !this.kupManager.objects.isEmptyKupObj(treeNodeData.obj),
+          'is-obj': !__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.isEmptyKupObj(treeNodeData.obj),
         }, style: treeNodeData.style || null, title: title, onDblClick: () => {
           this.onKupTreeNodeDblClick(treeNodeData, treeNodePath);
         } }, this.asAccordion && !treeNodeDepth
@@ -1029,7 +1027,7 @@ export class KupTree {
   }
   closeTotalMenu() {
     this.openedTotalMenu = null;
-    this.kupManager.removeClickCallback(this.clickCb);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").removeClickCallback(this.clickCb);
   }
   isOpenedTotalMenuForColumn(column) {
     return this.openedTotalMenu === column;
@@ -1059,15 +1057,15 @@ export class KupTree {
       let totalMenu = undefined;
       let menuLabel = TotalLabel.CALC;
       const translation = {
-        [TotalLabel.AVERAGE]: this.kupManager.language.translate(KupLanguageTotals.AVERAGE),
-        [TotalLabel.CALC]: this.kupManager.language.translate(KupLanguageTotals.CALCULATE),
-        [TotalLabel.CANC]: this.kupManager.language.translate(KupLanguageTotals.CANCEL),
-        [TotalLabel.COUNT]: this.kupManager.language.translate(KupLanguageTotals.COUNT),
-        [TotalLabel.DISTINCT]: this.kupManager.language.translate(KupLanguageTotals.DISTINCT),
-        [TotalLabel.MATH]: this.kupManager.language.translate(KupLanguageTotals.FORMULA),
-        [TotalLabel.MAX]: this.kupManager.language.translate(KupLanguageTotals.MAXIMUM),
-        [TotalLabel.MIN]: this.kupManager.language.translate(KupLanguageTotals.MINIMUM),
-        [TotalLabel.SUM]: this.kupManager.language.translate(KupLanguageTotals.SUM),
+        [TotalLabel.AVERAGE]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.AVERAGE),
+        [TotalLabel.CALC]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.CALCULATE),
+        [TotalLabel.CANC]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.CANCEL),
+        [TotalLabel.COUNT]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.COUNT),
+        [TotalLabel.DISTINCT]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.DISTINCT),
+        [TotalLabel.MATH]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.FORMULA),
+        [TotalLabel.MAX]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.MAXIMUM),
+        [TotalLabel.MIN]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.MINIMUM),
+        [TotalLabel.SUM]: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageTotals.SUM),
       };
       if (this.totals) {
         const totalValue = this.totals[column.name];
@@ -1112,7 +1110,7 @@ export class KupTree {
             value: translation[TotalLabel.DISTINCT],
           },
         ];
-        if (this.kupManager.objects.isNumber(column.obj)) {
+        if (__classPrivateFieldGet(this, _KupTree_kupManager, "f").objects.isNumber(column.obj)) {
           listData.push({
             id: TotalMode.SUM,
             value: translation[TotalLabel.SUM],
@@ -1178,25 +1176,25 @@ export class KupTree {
         });
       }
     };
-    this.kupManager.interact.on(this.treeWrapperRef, KupPointerEventTypes.TAP, tapCb);
-    this.kupManager.interact.on(this.treeWrapperRef, KupPointerEventTypes.HOLD, holdCb);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").interact.on(this.treeWrapperRef, KupPointerEventTypes.TAP, tapCb);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").interact.on(this.treeWrapperRef, KupPointerEventTypes.HOLD, holdCb);
   }
   totalMenuPosition() {
     if (this.rootElement.shadowRoot) {
       const menu = this.rootElement.shadowRoot.querySelector('#totals-menu');
       if (menu) {
-        this.kupManager.dynamicPosition.register(menu, this.totalMenuCoords);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").dynamicPosition.register(menu, this.totalMenuCoords);
         if (!this.clickCb) {
           this.clickCb = {
             cb: () => {
               this.closeTotalMenu();
-              this.kupManager.dynamicPosition.stop(menu);
+              __classPrivateFieldGet(this, _KupTree_kupManager, "f").dynamicPosition.stop(menu);
             },
             el: menu,
           };
         }
-        this.kupManager.addClickCallback(this.clickCb, true);
-        this.kupManager.dynamicPosition.start(menu);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").addClickCallback(this.clickCb, true);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").dynamicPosition.start(menu);
         menu.menuVisible = true;
       }
     }
@@ -1254,20 +1252,20 @@ export class KupTree {
   /*          L i f e c y c l e   H o o k s          */
   /*-------------------------------------------------*/
   componentWillLoad() {
-    this.kupManager.debug.logLoad(this, false);
-    this.kupManager.language.register(this);
-    this.kupManager.theme.register(this);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.logLoad(this, false);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.register(this);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").theme.register(this);
     this.columnMenuInstance = new KupColumnMenu();
     this.refreshStructureState();
   }
   componentDidLoad() {
     this.didLoadInteractables();
     this.kupDidLoad.emit({ comp: this, id: this.rootElement.id });
-    this.kupManager.resize.observe(this.rootElement);
-    this.kupManager.debug.logLoad(this, true);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").resize.observe(this.rootElement);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.logLoad(this, true);
   }
   componentWillRender() {
-    this.kupManager.debug.logRender(this, false);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.logRender(this, false);
     if (this.showFooter && this.columns) {
       this.footer = calcTotals(normalizeRows(this.getColumns(), this.nodesToRows()), this.totals);
     }
@@ -1299,7 +1297,7 @@ export class KupTree {
     this.persistState();
     // ***
     this.oldWidth = this.rootElement.clientWidth;
-    this.kupManager.debug.logRender(this, true);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").debug.logRender(this, true);
   }
   render() {
     this.contentRefs = [];
@@ -1322,7 +1320,7 @@ export class KupTree {
     }
     else {
       // There are no TreeNodes, so we print a single cell with a caption
-      treeNodes.push(h("tr", null, h("td", null, this.kupManager.language.translate(KupLanguageGeneric.EMPTY_DATA))));
+      treeNodes.push(h("tr", null, h("td", null, __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageGeneric.EMPTY_DATA))));
     }
     // Calculates if header must be shown or not
     const visibleHeader = this.showHeader && this.showColumns;
@@ -1331,12 +1329,12 @@ export class KupTree {
       this.data &&
       this.data.length &&
       this.data.length > 0) {
-      filterField = (h("div", { id: "global-filter" }, h("kup-text-field", { fullWidth: true, label: this.kupManager.language.translate(KupLanguageSearch.SEARCH), icon: KupThemeIconValues.SEARCH, initialValue: this.globalFilterValue, "onkup-textfield-input": (event) => {
+      filterField = (h("div", { id: "global-filter" }, h("kup-text-field", { fullWidth: true, label: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), icon: KupThemeIconValues.SEARCH, initialValue: this.globalFilterValue, "onkup-textfield-input": (event) => {
           window.clearTimeout(this.globalFilterTimeout);
           this.globalFilterTimeout = window.setTimeout(() => this.onGlobalFilterChange(event), 600);
         } })));
     }
-    return (h(Host, null, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, class: wrapperClass }, filterField, h("div", { class: "wrapper", ref: (el) => (this.treeWrapperRef =
+    return (h(Host, null, h("style", null, __classPrivateFieldGet(this, _KupTree_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, class: wrapperClass }, filterField, h("div", { class: "wrapper", ref: (el) => (this.treeWrapperRef =
         el) }, h("table", { class: "kup-tree", "data-show-columns": this.showColumns, onContextMenu: (e) => {
         e.preventDefault();
       } }, h("thead", { class: {
@@ -1347,18 +1345,18 @@ export class KupTree {
       : null)))));
   }
   disconnectedCallback() {
-    this.kupManager.language.register(this);
-    this.kupManager.resize.unobserve(this.rootElement);
-    this.kupManager.theme.unregister(this);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.register(this);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").resize.unobserve(this.rootElement);
+    __classPrivateFieldGet(this, _KupTree_kupManager, "f").theme.unregister(this);
     const dynamicPositionElements = this.rootElement.shadowRoot.querySelectorAll('[' + kupDynamicPositionAttribute + ']');
     if (dynamicPositionElements.length > 0) {
-      this.kupManager.dynamicPosition.unregister(Array.prototype.slice.call(dynamicPositionElements));
+      __classPrivateFieldGet(this, _KupTree_kupManager, "f").dynamicPosition.unregister(Array.prototype.slice.call(dynamicPositionElements));
     }
     if (this.columnMenuCard) {
       this.columnMenuCard.remove();
     }
     if (this.scrollOnHover) {
-      this.kupManager.scrollOnHover.unregister(this.treeWrapperRef);
+      __classPrivateFieldGet(this, _KupTree_kupManager, "f").scrollOnHover.unregister(this.treeWrapperRef);
     }
     this.kupDidUnload.emit({ comp: this, id: this.rootElement.id });
   }
@@ -2478,3 +2476,4 @@ export class KupTree {
       }];
   }
 }
+_KupTree_kupManager = new WeakMap();

package/dist/collection/f-components/f-image/f-image.js

@@ -15,7 +15,7 @@ export const FImage = (props) => {
         '--kup_image_height': props.sizeY ? props.sizeY : 'auto',
         '--kup_image_width': props.sizeX ? props.sizeX : '100%',
       };
-      el = createImage(props.resource);
+      el = createImage(props);
     }
     else {
       style = {
@@ -64,8 +64,8 @@ function createIcon(props) {
   }
   return h("div", { class: classObj, style: style });
 }
-function createImage(resource) {
-  return h("img", { src: resource });
+function createImage(props) {
+  return h("img", { onLoad: props.onLoad, src: props.resource });
 }
 function createBar(data) {
   const steps = [];

package/dist/collection/managers/kup-data/kup-data-column-helper.js

@@ -104,6 +104,7 @@ function newColumnFromConcatenate(dataset, columns, separator) {
       const message = 'The product of these columns in the same order already exists!(' +
         columns.toString() +
         ')';
+      col.visible = true;
       dom.ketchup.debug.logMessage('kup-data', message, KupDebugCategory.WARNING);
       return message;
     }

package/dist/collection/managers/kup-manager/kup-manager.js

@@ -233,6 +233,24 @@ export class KupManager {
       this.utilities.clickCallbacks.add(cb);
     }
   }
+  /**
+   * Retrives event path from event.target
+   * @param currentEl event.target
+   * @param rootElement rootElement of component
+   * @returns
+   */
+  getEventPath(currentEl, rootElement) {
+    const path = [];
+    while (currentEl &&
+      currentEl !== rootElement &&
+      currentEl !== document.body) {
+      path.push(currentEl);
+      currentEl = currentEl.parentNode
+        ? currentEl.parentNode
+        : currentEl.host;
+    }
+    return path;
+  }
   /**
    * Rasterizes an HTMLElement, transforming into a canvas.
    * @param {HTMLElement} el - Element to rasterize.

package/dist/collection/managers/kup-theme/kup-theme-declarations.js

@@ -112,6 +112,7 @@ export const fTextFieldUsers = [
   KupTagNames.DATE_PICKER,
   KupTagNames.FORM,
   KupTagNames.NUMERIC_PICKER,
+  KupTagNames.PLANNER,
   KupTagNames.TEXT_FIELD,
   KupTagNames.TIME_PICKER,
   KupTagNames.TREE,

package/dist/collection/types/GenericTypes.js

@@ -37,6 +37,7 @@ export var KupTagNames;
   KupTagNames["MAGIC_BOX"] = "KUP-MAGIC-BOX";
   KupTagNames["NAV_BAR"] = "KUP-NAV-BAR";
   KupTagNames["NUMERIC_PICKER"] = "KUP-NUMERIC-PICKER";
+  KupTagNames["PLANNER"] = "KUP-PLANNER";
   KupTagNames["PROBE"] = "KUP-PROBE";
   KupTagNames["PROGRESS_BAR"] = "KUP-PROGRESS-BAR";
   KupTagNames["QLIK"] = "KUP-QLIK";