@sme.up/ketchup 6.6.0 → 6.8.0

package/dist/ketchup/p-e6f19333.entry.js

@@ -0,0 +1 @@
+import{r as i,h as t,g as h}from"./p-4fdb684f.js";import{k as o}from"./p-a740352c.js";const e=class{constructor(t){i(this,t),this.kupManager=o(),this.config=void 0,this.qlik=void 0,this.appid="",this.app=!1,this.grid=[],this.debug=!1,this.fluid=!1,this.bordered=!1,this.defobjsize="400px",this.divlist=[]}getObjects(i){let t;return new Promise((h=>{i.rows.forEach((i=>{i.columns.forEach((i=>{t=!1,i.noSelections&&(t=i.noSelections),this.app.getObject(i.obj,i.obj,{noInteraction:!1,noSelections:t})}))})),h(!0)}))}doSelection(i){return new Promise((t=>{i.selections&&i.selections.forEach((i=>{this.app.field(i.field).selectValues(i.values,!1,!0)})),t(!0)}))}setRender(i){return new Promise((h=>{this.divlist=[],i.rows.forEach((i=>{let h=[];i.columns.forEach((i=>{let o="qvobject ";this.bordered&&(o+="bordered "),o=o+"width-"+i.colDim+" size-"+i.size,h.push(t("div",""!=i.obj?{id:i.obj,class:o}:{class:o}))})),this.divlist.push(t("div",{class:"kup-qlik-row"},h))})),h(!0)}))}componentWillLoad(){this.kupManager.debug.logLoad(this,!1)}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1),this.setRender(this.grid)}render(){let i=null,h=null;return i=this.fluid?{"kup-qlik-container-fluid":!0}:{"kup-qlik-container":!0},h={"--lyo_obj-height":this.defobjsize},t("div",{class:i,style:h},this.divlist)}componentDidRender(){this.debug&&console.log("Grid",this.grid),this.qlik&&(""==this.appid||this.app?this.debug&&console.log("App already open:",this.app):this.app=this.qlik.openApp(this.appid,this.config),this.app&&this.getObjects(this.grid).then((()=>{this.doSelection(this.grid)}))),this.kupManager.debug.logRender(this,!0)}get rootElement(){return h(this)}};e.style=".kup-qlik-container-fluid{width:100%}.kup-qlik-container{width:100%}@media (min-width: 576px){.kup-qlik-container{width:576px}.kup-qlik-row>.qvobject{flex:0 0 auto;min-width:100px;margin:0px auto 5px auto}}@media (min-width: 768px){.kup-qlik-container{width:768px}.kup-qlik-row>.qvobject{flex:0 0 auto;min-width:100px;margin:0px auto 5px auto}}@media (min-width: 992px){.kup-qlik-container{width:992px}.kup-qlik-row>.qvobject{flex:0 0 auto;min-width:100px;margin:0px auto 5px auto}}@media (min-width: 1200px){.kup-qlik-container{width:1200px}.kup-qlik-row>.qvobject{flex:0 0 auto;min-width:100px;margin:0px auto 5px auto}}.kup-qlik-row{display:flex;display:ms-flexbox;flex-wrap:wrap;-ms-flex-wrap:wrap;margin-bottom:5px}.kup-qlik-row .size-M{height:var(--lyo_obj-height)}.kup-qlik-row .size-S{height:calc(var(--lyo_obj-height)/2)}.kup-qlik-row .size-XS{height:calc(var(--lyo_obj-height)/3)}.kup-qlik-row .size-L{height:calc(var(--lyo_obj-height)*2)}.kup-qlik-row .size-XL{height:calc(var(--lyo_obj-height)*3)}.kup-qlik-row .bordered{border:1px solid var(--kup-border-color, #969696)}.kup-qlik-row .width-1{width:8.3333%}.kup-qlik-row .width-2{width:16.6666%}.kup-qlik-row .width-3{width:25%}.kup-qlik-row .width-4{width:33.3333%}.kup-qlik-row .width-5{width:41.6666%}.kup-qlik-row .width-6{width:50%}.kup-qlik-row .width-7{width:58.3333%}.kup-qlik-row .width-8{width:66.6666%}.kup-qlik-row .width-9{width:75%}.kup-qlik-row .width-10{width:83.3333%}.kup-qlik-row .width-11{width:91.6666%}.kup-qlik-row .width-12{width:100%}";export{e as kup_qlik}

package/dist/ketchup/{p-1ef5d16d.entry.js → p-eb10958a.entry.js}

@@ -1 +1 @@
-import{r as t,c as e,f as i,h as o,H as s,g as r}from"./p-b0b3989b.js";import{k as h,g as a,s as n}from"./p-c05f2638.js";import{c as p}from"./p-97e8ea42.js";var l;!function(t){t.customStyle="Custom style of the component.",t.placeholderAttrs="Html attributes of the picture before the component enters the viewport.",t.resourceAttrs="Html attributes of the picture after the component enters the viewport."}(l||(l={}));var f,c,d,u,m,w,b=function(t,e,i,o){if("a"===i&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!o:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===i?o:"a"===i?o.call(t):o?o.value:e.get(t)},k=function(t,e,i,o,s){if("m"===o)throw new TypeError("Private method is not writable");if("a"===o&&!s)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!s:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===o?s.call(t,i):s?s.value=i:e.set(t,i),i};const v=class{constructor(i){t(this,i),this.kupPhotoFramePlaceholderLoad=e(this,"kup-photoframe-placeholderload",6),this.kupPhotoFrameResourceLoad=e(this,"kup-photoframe-resourceload",6),this.isInViewport=!1,this.customStyle="",this.placeholderAttrs={},this.resourceAttrs={},this.threshold=.25,f.set(this,null),c.set(this,h()),d.set(this,null),u.set(this,null),m.set(this,!1),w.set(this,null)}async getProps(t){return a(this,l,t)}async refresh(){i(this)}async setProps(t){n(this,l,t)}setObserver(){k(this,f,new IntersectionObserver((t=>{t.forEach((t=>{t.isIntersecting&&(this.isInViewport=!0,b(this,f,"f").unobserve(this.rootElement))}))}),{threshold:this.threshold}),"f")}componentWillLoad(){b(this,c,"f").debug.logLoad(this,!1),b(this,c,"f").theme.register(this),this.setObserver()}componentDidLoad(){b(this,c,"f").debug.logLoad(this,!0)}componentWillRender(){b(this,c,"f").debug.logRender(this,!1)}componentDidRender(){b(this,c,"f").debug.logRender(this,!0)}render(){return this.isInViewport&&!b(this,m,"f")&&k(this,m,!0,"f"),o(s,null,o("style",null,b(this,c,"f").theme.setKupStyle(this.rootElement)),o("div",{id:p,ref:t=>{k(this,w,t,"f")}},o("img",Object.assign({},this.placeholderAttrs,{class:"placeholder",ref:t=>k(this,d,t,"f"),onLoad:()=>{b(this,d,"f").naturalWidth>b(this,d,"f").naturalHeight?b(this,w,"f").classList.add("horizontal"):b(this,w,"f").classList.add("vertical"),b(this,f,"f").observe(this.rootElement),b(this,d,"f").classList.add("placeholder--loaded"),this.kupPhotoFramePlaceholderLoad.emit({comp:this,id:this.rootElement.id})}})),b(this,m,"f")?o("img",Object.assign({},this.resourceAttrs,{class:"resource",ref:t=>k(this,u,t,"f"),onLoad:()=>{b(this,d,"f").classList.add("placeholder--fade-out"),b(this,u,"f").classList.add("resource--fade-in"),this.kupPhotoFrameResourceLoad.emit({comp:this,id:this.rootElement.id})}})):null))}disconnectedCallback(){b(this,c,"f").theme.unregister(this),b(this,f,"f").unobserve(this.rootElement)}get rootElement(){return r(this)}};f=new WeakMap,c=new WeakMap,d=new WeakMap,u=new WeakMap,m=new WeakMap,w=new WeakMap,v.style=":host{--kup_photoframe_border:var(\n    --kup-photoframe-border,\n    1px inset var(--kup-border-color)\n  );--kup_photoframe_fade_out_time:var(--kup-photoframe-fade-out-time, 2000ms);border:var(--kup_photoframe_border);display:block;height:100%;position:relative;width:100%}#kup-component{position:relative;height:100%;width:100%}img{max-height:100%;max-width:100%}.horizontal img{width:100%}.vertical img{height:100%}.placeholder{display:none;transition:opacity var(--kup_photoframe_fade_out_time) ease-out;will-change:opacity;z-index:1}.placeholder--loaded{display:block}.placeholder--fade-out{opacity:0;position:absolute}.resource{display:none;left:0;position:absolute;top:0;z-index:0}.resource--fade-in{display:block;position:relative}:host(.kup-fit) img{height:100%;object-fit:cover;width:100%}";export{v as kup_photo_frame}
+import{r as t,c as e,f as i,h as o,H as s,g as r}from"./p-4fdb684f.js";import{k as h,g as a,s as n}from"./p-a740352c.js";import{c as p}from"./p-97e8ea42.js";var l;!function(t){t.customStyle="Custom style of the component.",t.placeholderAttrs="Html attributes of the picture before the component enters the viewport.",t.resourceAttrs="Html attributes of the picture after the component enters the viewport."}(l||(l={}));var f,c,d,u,m,w,b=function(t,e,i,o){if("a"===i&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!o:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===i?o:"a"===i?o.call(t):o?o.value:e.get(t)},v=function(t,e,i,o,s){if("m"===o)throw new TypeError("Private method is not writable");if("a"===o&&!s)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!s:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===o?s.call(t,i):s?s.value=i:e.set(t,i),i};const k=class{constructor(i){t(this,i),this.kupPhotoFramePlaceholderLoad=e(this,"kup-photoframe-placeholderload",6),this.kupPhotoFrameResourceLoad=e(this,"kup-photoframe-resourceload",6),f.set(this,null),c.set(this,h()),d.set(this,null),u.set(this,null),m.set(this,!1),w.set(this,null),this.isInViewport=!1,this.customStyle="",this.placeholderAttrs={},this.resourceAttrs={},this.threshold=.25}async getProps(t){return a(this,l,t)}async refresh(){i(this)}async setProps(t){n(this,l,t)}setObserver(){v(this,f,new IntersectionObserver((t=>{t.forEach((t=>{t.isIntersecting&&(this.isInViewport=!0,b(this,f,"f").unobserve(this.rootElement))}))}),{threshold:this.threshold}),"f")}componentWillLoad(){b(this,c,"f").debug.logLoad(this,!1),b(this,c,"f").theme.register(this),this.setObserver()}componentDidLoad(){b(this,c,"f").debug.logLoad(this,!0)}componentWillRender(){b(this,c,"f").debug.logRender(this,!1)}componentDidRender(){b(this,c,"f").debug.logRender(this,!0)}render(){return this.isInViewport&&!b(this,m,"f")&&v(this,m,!0,"f"),o(s,null,o("style",null,b(this,c,"f").theme.setKupStyle(this.rootElement)),o("div",{id:p,ref:t=>{v(this,w,t,"f")}},o("img",Object.assign({},this.placeholderAttrs,{class:"placeholder",ref:t=>v(this,d,t,"f"),onLoad:()=>{b(this,d,"f").naturalWidth>b(this,d,"f").naturalHeight?b(this,w,"f").classList.add("horizontal"):b(this,w,"f").classList.add("vertical"),b(this,f,"f").observe(this.rootElement),b(this,d,"f").classList.add("placeholder--loaded"),this.kupPhotoFramePlaceholderLoad.emit({comp:this,id:this.rootElement.id})}})),b(this,m,"f")?o("img",Object.assign({},this.resourceAttrs,{class:"resource",ref:t=>v(this,u,t,"f"),onLoad:()=>{b(this,d,"f").classList.add("placeholder--fade-out"),b(this,u,"f").classList.add("resource--fade-in"),this.kupPhotoFrameResourceLoad.emit({comp:this,id:this.rootElement.id})}})):null))}disconnectedCallback(){var t;b(this,c,"f").theme.unregister(this),null===(t=b(this,f,"f"))||void 0===t||t.unobserve(this.rootElement)}get rootElement(){return r(this)}};f=new WeakMap,c=new WeakMap,d=new WeakMap,u=new WeakMap,m=new WeakMap,w=new WeakMap,k.style=":host{--kup_photoframe_border:var(\n    --kup-photoframe-border,\n    1px inset var(--kup-border-color)\n  );--kup_photoframe_fade_out_time:var(--kup-photoframe-fade-out-time, 2000ms);border:var(--kup_photoframe_border);display:block;height:100%;position:relative;width:100%}#kup-component{position:relative;height:100%;width:100%}img{max-height:100%;max-width:100%}.horizontal img{width:100%}.vertical img{height:100%}.placeholder{display:none;transition:opacity var(--kup_photoframe_fade_out_time) ease-out;will-change:opacity;z-index:1}.placeholder--loaded{display:block}.placeholder--fade-out{opacity:0;position:absolute}.resource{display:none;left:0;position:absolute;top:0;z-index:0}.resource--fade-in{display:block;position:relative}:host(.kup-fit) img{height:100%;object-fit:cover;width:100%}";export{k as kup_photo_frame}

package/dist/ketchup/{p-20221a50.js → p-ecac6269.js}

@@ -1 +1 @@
-import{h as t,a as e}from"./p-b0b3989b.js";import{b as s}from"./p-c05f2638.js";var i;!function(t){t.BAR="bar"}(i||(i={}));const a=a=>{let r,o;a.resource?a.resource.indexOf(".")>-1||a.resource.indexOf("/")>-1||a.resource.indexOf("\\")>-1?(o={"--kup_image_height":a.sizeY?a.sizeY:"auto","--kup_image_width":a.sizeX?a.sizeX:"100%"},r=t("img",{src:a.resource})):(o={"--kup_image_height":a.sizeY?a.sizeY:"100%","--kup_image_width":a.sizeX?a.sizeX:"100%"},r=function(i){const a={"f-image__icon":!0},r={background:i.color?i.color:`var(${s.ICON})`};if(i.resource.indexOf("--kup")>-1){let t=i.resource.replace("--","");a["kup-icon"]=!0,a[t]=!0}else{const t=e(`./assets/svg/${i.resource}.svg`);r.mask=`url('${t}') no-repeat center`,r.webkitMask=`url('${t}') no-repeat center`}return t("div",{class:a,style:r})}(a)):a.data&&(o={"--kup_image_height":a.sizeY?a.sizeY:"100%","--kup_image_width":a.sizeX?a.sizeX:"100%"},r=function(e){const s=[];let a=0;for(let r=0;r<e.length;r++){let o;e[r].shape||(e[r].shape=i.BAR),e[r].color||(e[r].color="transparent"),e[r].height||(e[r].height="100%"),e[r].width||(e[r].width="100%");const n="step-"+r,c="css-step bottom-aligned",l={backgroundColor:e[r].color,left:a+"%",height:e[r].height,width:e[r].width};a+=parseFloat(e[r].width),o=t("span",{id:n,class:c,style:l}),s.push(o)}return t("div",{class:"f-image__css"},s)}(a.data));const n=[];if(a.badgeData)for(let e=0;e<a.badgeData.length;e++)n.push(t("kup-badge",Object.assign({},a.badgeData[e])));return t("div",Object.assign({class:`f-image ${a.wrapperClass?a.wrapperClass:""} ${a.fit?"kup-fit":""}`},a.dataSet,{id:a.id,style:o,title:a.title,onClick:a.onClick}),r,...n)};export{a as F}
+import{h as t,a as e}from"./p-4fdb684f.js";import{b as s}from"./p-a740352c.js";var i;!function(t){t.BAR="bar"}(i||(i={}));const a=a=>{let r,o;a.resource?a.resource.indexOf(".")>-1||a.resource.indexOf("/")>-1||a.resource.indexOf("\\")>-1?(o={"--kup_image_height":a.sizeY?a.sizeY:"auto","--kup_image_width":a.sizeX?a.sizeX:"100%"},r=t("img",{src:a.resource})):(o={"--kup_image_height":a.sizeY?a.sizeY:"100%","--kup_image_width":a.sizeX?a.sizeX:"100%"},r=function(i){const a={"f-image__icon":!0},r={background:i.color?i.color:`var(${s.ICON})`};if(i.resource.indexOf("--kup")>-1){let t=i.resource.replace("--","");a["kup-icon"]=!0,a[t]=!0}else{const t=e(`./assets/svg/${i.resource}.svg`);r.mask=`url('${t}') no-repeat center`,r.webkitMask=`url('${t}') no-repeat center`}return t("div",{class:a,style:r})}(a)):a.data&&(o={"--kup_image_height":a.sizeY?a.sizeY:"100%","--kup_image_width":a.sizeX?a.sizeX:"100%"},r=function(e){const s=[];let a=0;for(let r=0;r<e.length;r++){let o;e[r].shape||(e[r].shape=i.BAR),e[r].color||(e[r].color="transparent"),e[r].height||(e[r].height="100%"),e[r].width||(e[r].width="100%");const n="step-"+r,c="css-step bottom-aligned",l={backgroundColor:e[r].color,left:a+"%",height:e[r].height,width:e[r].width};a+=parseFloat(e[r].width),o=t("span",{id:n,class:c,style:l}),s.push(o)}return t("div",{class:"f-image__css"},s)}(a.data));const n=[];if(a.badgeData)for(let e=0;e<a.badgeData.length;e++)n.push(t("kup-badge",Object.assign({},a.badgeData[e])));return t("div",Object.assign({class:`f-image ${a.wrapperClass?a.wrapperClass:""} ${a.fit?"kup-fit":""}`},a.dataSet,{id:a.id,style:o,title:a.title,onClick:a.onClick}),r,...n)};export{a as F}

package/dist/ketchup/p-f43b445e.entry.js

@@ -0,0 +1 @@
+import{r as t,c as o,f as i,h as e,H as s,g as r}from"./p-4fdb684f.js";import{k as n,z as a,g as l,s as h,u as c,l as p,K as b,c as d,R as u,W as x,X as g,Y as f,I as m,a3 as k}from"./p-a740352c.js";import{f as w,p as v,s as y,d as _,r as j,h as C,b as R}from"./p-86154e2b.js";import{F as A}from"./p-ecac6269.js";import{a as z}from"./p-395675b8.js";import{c as P}from"./p-97e8ea42.js";import{F as I}from"./p-3cf97e3a.js";import{F as O}from"./p-a203f78b.js";import"./p-a992cf87.js";import"./p-6c77a36c.js";import"./p-23cd5a68.js";import"./p-61ff1761.js";import"./p-79b0730b.js";import"./p-81605f08.js";var S;!function(t){t.cardData="Data of the card linked to the box when the latter's layout must be a premade template.",t.columns="Number of columns.",t.customStyle="Custom style of the component.",t.data="Actual data of the box.",t.dragEnabled="Enable dragging.",t.dropEnabled="Enable dropping.",t.dropOnSection="Drop can be done in section.",t.enableRowActions="If enabled, a button to load / display the row actions will be displayed on the right of every box.",t.globalFilter="When set to true it activates the global filter.",t.globalFilterValue="The value of the global filter.",t.kanban="Displays the boxlist as a Kanban.",t.layout="How the field will be displayed. If not present, a default one will be created.",t.multiSelection="Enable multi selection.",t.pageSelected="Current page number.",t.pageSize="Number of boxes per page.",t.pagination="Enables pagination.",t.rowsPerPage="Number of current rows per page.",t.scrollOnHover="Activates the scroll on hover function.",t.selectBox="Automatically selects the box at the specified index.",t.selectedRowsState="Multiple selection.",t.showSelection="If enabled, highlights the selected box/boxes.",t.sortBy="If sorting is enabled, specifies which column to sort.",t.sortEnabled="Enable sorting.",t.stateId="",t.store="",t.swipeDisabled="Disable swipe."}(S||(S={}));class M{constructor(){this.globalFilterValue="",this.sortBy="",this.selectedRowsState="",this.pageSelected=1,this.rowsPerPage=0,this.load=!1}toDebugString(){return"box state"}}const B=class{constructor(i){t(this,i),this.kupBoxClick=o(this,"kup-box-click",6),this.kupBoxSelected=o(this,"kup-box-selected",6),this.kupAutoBoxSelect=o(this,"kup-box-autoselect",6),this.kupRowActionMenuClick=o(this,"kup-box-rowactionmenuclick",6),this.kupRowActionClick=o(this,"kup-box-rowactionclick",6),this.kupDidLoad=o(this,"kup-box-didload",6),this.kupDidUnload=o(this,"kup-box-didunload",6),this.kupBoxContextMenu=o(this,"kup-box-contextmenu",6),this.state=new M,this.kupManager=n(),this.visibleColumns=[],this.rows=[],this.filteredRows=[],this.sectionRef=null,this.rowsRefs=[],this.hold=!1,this.interactableDrag=[],this.interactableDrop=[],this.interactableTouch=[],this.collapsedSection={},this.selectedRows=[],this.rowActionMenuOpened=void 0,this.currentPage=1,this.currentRowsPerPage=10,this.cardData=null,this.columns=1,this.customStyle="",this.data=null,this.dragEnabled=!1,this.dropEnabled=!1,this.dropOnSection=!1,this.editableData=!1,this.enableRowActions=!1,this.globalFilter=!1,this.globalFilterValue="",this.kanban=null,this.layout=void 0,this.multiSelection=!1,this.pageSelected=1,this.pageSize=10,this.pagination=!1,this.rowsPerPage=void 0,this.scrollOnHover=!1,this.selectBox=void 0,this.selectedRowsState=void 0,this.showSelection=!0,this.sortBy=void 0,this.sortEnabled=!1,this.stateId="",this.store=void 0,this.swipeDisabled=!1}initWithPersistedState(){if(this.store&&this.stateId){const t=this.store.getState(this.stateId);null!=t&&(this.kupManager.debug.logMessage(this,"Initialize with state for stateId "+this.stateId+": "+t),this.sortBy=this.state.sortBy,this.globalFilterValue=this.state.globalFilterValue,this.selectedRowsState=this.state.selectedRowsState,this.pageSelected=this.state.pageSelected,this.rowsPerPage=this.state.rowsPerPage)}}persistState(){if(this.store&&this.stateId){let t=!1;this.kupManager.objects.deepEqual(this.state.sortBy,this.sortBy)||(this.state.sortBy=this.sortBy,t=!0),this.kupManager.objects.deepEqual(this.state.globalFilterValue,this.globalFilterValue)||(this.state.globalFilterValue=this.globalFilterValue,t=!0),this.kupManager.objects.deepEqual(this.state.pageSelected,this.currentPage)||(this.state.pageSelected=this.currentPage,t=!0),this.kupManager.objects.deepEqual(this.state.rowsPerPage,this.currentRowsPerPage)||(this.state.rowsPerPage=this.currentRowsPerPage,t=!0);const o=this.selectedRows.reduce(((t,o,i)=>t+(i>0?";":"")+o.id),"");if(this.kupManager.objects.deepEqual(this.state.selectedRowsState,o)||(this.state.selectedRowsState=o,t=!0),!this.state.load)return void(this.state.load=!0);t&&(this.kupManager.debug.logMessage(this,"Persisting state for stateId "+this.stateId+": "+this.state),this.store.persistState(this.stateId,this.state))}}rowsPerPageHandler(t){this.currentRowsPerPage=t}recalculateRows(){this.initRows()}onDataChanged(){a(this.getRows()),this.initVisibleColumns(),this.initRows(),this.checkLayout()}onLayoutChanged(){this.checkLayout()}onSelectBoxChanged(){this.handleAutomaticBoxSelection()}async getProps(t){return l(this,S,t)}async loadRowActions(t,o){t.actions=o,this.rowActionMenuOpened=t}async refresh(){i(this)}async setProps(t){h(this,S,t)}getColumns(){return this.data&&this.data.columns?this.data.columns:[{title:"",name:"",size:void 0}]}initVisibleColumns(){this.visibleColumns=this.getColumns().filter((t=>!t.hasOwnProperty("visible")||t.visible))}getRows(){return this.data&&this.data.rows?this.data.rows:[]}initRows(){this.filteredRows=this.getRows(),this.globalFilter&&this.globalFilterValue&&(this.filteredRows=w(this.filteredRows,null,this.globalFilterValue,this.visibleColumns)),this.rows=this.sortRows(this.filteredRows),this.pagination&&(this.rows=v(this.rows,this.currentPage,this.currentRowsPerPage,!1))}sortRows(t){let o=t;return this.sortBy&&(o=y(o,[{column:this.sortBy,sortMode:k.A}])),o}checkScrollOnHover(){this.kupManager.scrollOnHover.isRegistered(this.boxContainer)?this.scrollOnHover||this.kupManager.scrollOnHover.unregister(this.boxContainer):this.scrollOnHover&&this.kupManager.scrollOnHover.register(this.boxContainer)}checkLayout(){if(this.layout)return void(this.boxLayout=this.layout);const t={horizontal:!1,sections:[]},o=this.visibleColumns;let i=o.length,e=[],s=0;for(;i-- >0;)e.push({column:o[s++].name});t.content=e,this.boxLayout={sections:[t]}}onSortChange(t){let o=c(this.visibleColumns,t.detail.value);this.sortBy=o.name}onGlobalFilterChange({detail:t}){let o="";t&&t.value&&(o=t.value),this.globalFilterValue=o}isSectionExpanded(t,o){return!(!t.id||!o.id)&&this.collapsedSection[o.id]&&this.collapsedSection[o.id][t.id]}handleAutomaticBoxSelection(){if(this.selectBox&&this.selectBox>0&&this.selectBox<=this.data.rows.length){this.selectedRows=[];for(let t of this.data.rows)if(t.id===(this.selectBox-1).toString()){this.selectedRows.push(t);break}this.kupAutoBoxSelect.emit({comp:this,id:this.rootElement.id,row:this.selectedRows[0]})}}getEventDetails(t,o){let i=null,e=null,s=null,r=null;if(t&&(i=t.closest(".box-object")||t.querySelector(".box-object")||t.closest(".f-cell")),i)if(i.classList.contains("f-cell")){const t=i["kup-get-cell-props"]();e=t.cell,r=t.column,s=t.row}else e=i["data-cell"],s=i["data-row"],r=c(this.visibleColumns,i.dataset.column);return{boxObject:i||null,column:r||null,cell:e||null,originalEvent:o,row:s||null}}contextMenuHandler(t){return this.getEventDetails(t.target,t)}checkIfElementIsActionMenuIcon(t){return!(!t.tagName||!t.parentElement)&&"svg"===t.tagName&&t.parentElement.classList.contains("row-actions-toggler")}onBoxClick({target:t},o){if(!(t instanceof HTMLElement))return;let i=t,e=i.classList;for(;!e.contains("box-object")&&!e.contains("box-section")&&!e.contains("box")&&(i=i.parentElement,null!==i);)e=i.classList;let s=null;e.contains("box-object")&&(s=i.dataset.column),this.kupBoxClick.emit({comp:this,id:this.rootElement.id,row:o,column:s}),this.multiSelection?this.onSelectionCheckChange(o):this.selectedRows=[o]}onSelectionCheckChange(t){var o=-1;for(let i=0;i<this.selectedRows.length;i++)if(this.selectedRows[i].id===t.id){o=i;break}o>=0?(this.selectedRows.splice(o,1),this.selectedRows=[...this.selectedRows]):this.selectedRows=[...this.selectedRows,t],this.kupBoxSelected.emit({comp:this,id:this.rootElement.id,rows:this.selectedRows})}toggleSectionExpand(t,o){if(o.id)if(t.id){if(this.collapsedSection[o.id]){const i=this.collapsedSection[o.id];i[t.id]=!i[t.id]||!i[t.id]}else this.collapsedSection[o.id]={},this.collapsedSection[o.id][t.id]=!0;this.collapsedSection=Object.assign({},this.collapsedSection)}else console.error("cannot expand / collapse a section of a row without ad id");else console.error("cannot expand / collapse a section withoun an ID")}onRowAction(t){t&&(t!==this.rowActionMenuOpened?t.actions?this.rowActionMenuOpened=t:this.kupRowActionMenuClick.emit({comp:this,id:this.rootElement.id,row:t}):this.rowActionMenuOpened=null)}onRowActionClick(t,o,i){this.kupRowActionClick.emit({comp:this,id:this.rootElement.id,row:t,action:o,index:i})}clickFunction(t){try{const o=t.composedPath();for(let t of o)if(this.checkIfElementIsActionMenuIcon(t))return}catch(o){if(this.checkIfElementIsActionMenuIcon(t.target))return}this.rowActionMenuOpened=null}handlePageChange(t){const o=_(t,this.filteredRows.length,this.currentRowsPerPage);o&&(this.currentPage=o)}handleRowsPerPageChange(t){const o=j(t,this.filteredRows.length);o&&(this.currentRowsPerPage=o,this.adjustPaginator())}adjustPaginator(){const t=Math.ceil(this.rows.length/this.currentRowsPerPage);this.currentPage>t&&(this.currentPage=1)}renderSectionAsCard(t){let o=!1;const i={button:[],cell:[],columns:[],image:[],progressbar:[],text:[]};for(let o=0;o<this.data.columns.length;o++){const e=this.data.columns[o];!1!==e.visible&&(i.cell.push(t.cells[e.name]),i.columns.push(e))}for(const o in t.cells)if(t.cells.hasOwnProperty(o)){const e=t.cells[o];if(void 0!==e.cardID&&e.obj)switch(e.obj.p){case"BTN":do{i.button.push({})}while(i.button.length<e.cardID);i.button[e.cardID]={label:e.value};break;case"IMG":do{i.image.push({})}while(i.image.length<e.cardID);i.image[e.cardID]={resource:e.value};break;case"PGB":do{i.progressbar.push({})}while(i.progressbar.length<e.cardID);i.progressbar[e.cardID]={value:e.value};break;default:do{i.text.push("")}while(i.text.length<e.cardID);i.text[e.cardID]=e.value}}for(const e in t.cells)if(t.cells.hasOwnProperty(e)){const s=t.cells[e];if(void 0===s.cardID&&s.obj)switch(o=!1,s.obj.p){case"BTN":for(let t=0;t<i.button.length;t++)if(!Object.keys(i.button[t]).length){i.button[t]={label:s.value},o=!0;break}o||i.button.push({label:s.value});break;case"IMG":for(let t=0;t<i.image.length;t++)if(!Object.keys(i.image[t]).length){i.image[t]={resource:s.value},o=!0;break}o||i.image.push({resource:s.value});break;case"PGB":for(let t=0;t<i.progressbar.length;t++)if(!Object.keys(i.progressbar[t]).length){i.progressbar[t]={value:s.value},o=!0;break}o||i.progressbar.push({value:s.value});break;default:for(let t=0;t<i.text.length;t++)if(""===i.text[t]){i.text[t]=s.value,o=!0;break}o||i.text.push(s.value)}}return e("kup-card",Object.assign({data:i},this.cardData))}renderRow(t){const o=[...this.visibleColumns];let i=null,s=t.layout;s||(s=this.boxLayout);let r=!1;if(s){s.horizontal&&(r=!0);const e=s.sections;let n=e.length,a=0;n>0&&(i=[]);const l={horizontal:r};for(;n-- >0;)i.push(null!=this.cardData&&"object"==typeof this.cardData?this.renderSectionAsCard(t):this.renderSection(e[a++],l,t,o))}var n=!1;for(let o of this.selectedRows)o.id===t.id&&(n=!0);let a=null;this.multiSelection&&(a=e("div",{class:"box-selection"},e("kup-checkbox",{checked:n})));let l=null;if(this.enableRowActions&&!this.swipeDisabled){const o={"row-action-menu":!0,open:t===this.rowActionMenuOpened};let i=null;if(t.actions){const o=t.actions.map(((o,i)=>e("li",{tabindex:"0",onClick:()=>this.onRowActionClick(t,o,i)},e("div",{class:`icon ${o.icon}`}),e("div",{class:"text"},o.text))));i=e("ul",null,o)}l=e("div",{class:"row-actions-wrapper"},e("div",{class:"row-actions-toggler"},e("svg",{version:"1.1",width:"24",height:"24",viewBox:"0 0 24 24",onClick:()=>this.onRowAction(t)},e("path",{d:"M12,16A2,2 0 0,1 14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18A2,2 0 0,1 12,16M12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12A2,2 0 0,1 12,10M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8A2,2 0 0,1 10,6A2,2 0 0,1 12,4Z"})),e("div",{class:o},i)))}let h=null;return t.badgeData&&t.badgeData.length>0&&(h=t.badgeData.map((t=>e("kup-badge",{text:t.text,class:t.className?`centered ${t.className}`:"centered",imageData:t.imageData})))),e("div",{class:"box-wrapper",style:t.style||{}},e("div",{class:{box:!0,draggable:this.dragEnabled,selected:this.showSelection&&n,column:!r},onClick:o=>this.onBoxClick(o,t),ref:t=>this.rowsRefs.push(t)},a,i,h),l)}renderSection(t,o,i,s){let r=null;if(t.sections&&t.sections.length>0){const o=t.sections;let e=o.length,n=0;for(e>0&&(r=[]);e-- >0;)r.push(this.renderSection(o[n++],t,i,s))}else if(t.content){const o=t.content;let e=o.length,n=0;for(e>0&&(r=[]);e-- >0;)r.push(this.renderBoxObject({boxObject:o[n++],row:i,visibleColumns:s},!0))}else s.length>0&&(r=this.renderBoxObject({boxObject:{column:s[0].name},row:i,visibleColumns:s}));const n=this.isSectionExpanded(i,t),a=!!t.columns,l={"box-section":!0,open:n,column:!a&&!t.horizontal,grid:a,titled:!!t.title,"last-child":!t.sections||0===t.sections.length},h=t.style||{};t.dim&&o&&(h.flex=`0 0 ${t.dim}`,o.horizontal?h.maxWidth=t.dim:h.maxHeight=t.dim),a&&(h["grid-template-columns"]=`repeat(${t.columns}, 1fr)`);let c=null;if(t.collapsible){l["collapse-section"]=!0;const o={content:!0};let s="";s=t.title?t.title:this.kupManager.language.translate(n?p.COLLAPSE:p.EXPAND),c=e("div",{class:l,style:h},e("div",{class:o},r),e("div",{class:"header",role:"button",onClick:o=>{o.stopPropagation(),this.toggleSectionExpand(i,t)}},e("div",{class:"header-content"},e("span",null,s),e(A,{resource:`${b.DROPDOWN}`,sizeX:"1.25em",sizeY:"1.25em",wrapperClass:n?"toggled":""}))))}else{const o=t.title?e("h3",null,t.title):null;c=e("div",{class:l,style:h},o,r)}return c}renderBoxObject({boxObject:t,row:o,visibleColumns:i},s){const r={"box-object":!0};let n=null,a=-1;for(let o=0;o<i.length;o++)if(i[o].name===t.column){a=o;break}a>=0?(n=i[a],i.splice(a,1)):s&&(n=this.data.columns.find((o=>o.name===t.column)));const l=o.cells[t.column];let h;return l&&!this.kupManager.objects.isEmptyKupObj(l.obj)&&(r["is-obj"]=!0,this.kupManager.debug.isDebug()&&(h=l.obj.t+"; "+l.obj.p+"; "+l.obj.k+";")),e("div",{"data-cell":l,"data-row":o,"data-column":t.column,class:r,style:{},title:h},l&&n?e(I,Object.assign({},{cell:l,column:n,component:this,editable:this.editableData,renderKup:!0,row:o,setSizes:!0,shape:t.shape})):e("span",null,t.value))}kanbanMode(){if(!this.kanban.columns||0===this.kanban.columns.length)return this.kupManager.debug.logMessage(this,"No columns to group by detected.",d.ERROR),{jsx:e("div",{id:"empty-data-message",class:"box-wrapper"},e("div",{ref:t=>this.rowsRefs.push(t)}),this.kupManager.language.translate(p.EMPTY_DATA)),style:{"grid-template-columns":"repeat(1, 1fr)"}};const t=[];if(this.kanban.labels)for(let o=0;o<this.kanban.labels.length;o++)t.push({labels:this.kanban.labels[o],nodes:[]});for(let o=0;o<this.rows.length;o++){let i=[];for(let t=0;t<this.kanban.columns.length;t++)try{i.push(this.rows[o].cells[this.kanban.columns[t]].value)}catch(t){this.kupManager.debug.logMessage(this,t,d.WARNING)}const e={found:!1,index:null};for(let o=0;o<t.length;o++){let s=t[o].labels,r=!0;for(let t=0;t<s.length;t++)if(i[t]!==s[t]){r=!1;break}if(r){e.found=!0,e.index=o;break}}e.found?t[e.index].nodes.push(this.renderRow(this.rows[o])):t.push({labels:i,nodes:[this.renderRow(this.rows[o])]})}const o=[];for(let i=0;i<t.length;i++){const s=t[i].labels,r={data:[]};for(let t=0;t<s.length;t++)r.data.push({value:s[t],id:s[t]});o.push(e("div",{class:"kanban-section"},e(z,Object.assign({},r)),t[i].nodes))}return{jsx:o,style:{"grid-template-columns":this.kanban.isStacked?"repeat(1fr)":this.kanban.size?`repeat(${Object.keys(t).length}, ${this.kanban.size})`:`repeat(${Object.keys(t).length}, 1fr)`}}}didLoadInteractables(){this.interactableTouch.push(this.boxContainer),this.kupManager.interact.on(this.boxContainer,u.TAP,(t=>{if(this.hold)this.hold=!1;else switch(t.button){case 2:this.kupBoxContextMenu.emit({comp:this,id:this.rootElement.id,details:this.contextMenuHandler(t)})}})),this.kupManager.interact.on(this.boxContainer,u.HOLD,(t=>{"pen"!==t.pointerType&&"touch"!==t.pointerType||(this.hold=!0,this.kupBoxContextMenu.emit({comp:this,id:this.rootElement.id,details:this.contextMenuHandler(t)}))}))}didRenderInteractables(){if(this.dragEnabled)for(let t=0;t<this.rowsRefs.length;t++){const o=this.rowsRefs[t],i=()=>{const t=this.rootElement.shadowRoot.querySelector(".box-object:hover");return{cell:t["data-cell"],column:c(this.visibleColumns,t.dataset.column),id:this.rootElement.id,multiple:this.multiSelection,row:t["data-row"],selectedRows:this.selectedRows}};o&&!this.interactableDrag.includes(o)&&(this.interactableDrag.push(o),this.kupManager.interact.draggable(o,{allowFrom:".box-object",cursorChecker:()=>null},{callback:i},x.BADGE))}if(this.dropEnabled){const t=()=>{const t=this.getEventDetails(this.rootElement.shadowRoot.querySelector(".box:hover"));return{cell:t.cell,column:t.column,id:this.rootElement.id,row:t.row}};this.interactableDrop.includes(this.sectionRef)||(this.interactableDrop.push(this.sectionRef),this.kupManager.interact.dropzone(this.sectionRef,{accept:`[${g}]`},{dispatcher:this.rootElement,type:f.BOX}));for(let o=0;o<this.rowsRefs.length;o++){const i=this.rowsRefs[o];i&&!this.interactableDrop.includes(i)&&(this.interactableDrop.push(i),this.kupManager.interact.dropzone(i,{accept:`[${g}]`},{callback:t,dispatcher:this.rootElement,type:f.BOX}))}}}componentWillLoad(){this.kupManager.debug.logLoad(this,!1),this.rowsPerPage?this.currentRowsPerPage=this.rowsPerPage:this.pageSize&&(this.currentRowsPerPage=this.pageSize),this.data&&this.data.rows&&this.currentRowsPerPage>this.data.rows.length&&(this.currentRowsPerPage=this.data.rows.length),this.kupManager.language.register(this),this.kupManager.theme.register(this),this.onDataChanged(),this.adjustPaginator()}componentDidLoad(){if(this.handleAutomaticBoxSelection(),document.addEventListener("click",this.clickFunction.bind(this)),this.currentPage=this.pageSelected,this.multiSelection&&this.selectedRowsState){this.selectedRows=[];let t=this.selectedRowsState.split(";");this.selectedRows=this.data.rows.filter((o=>t.indexOf(o.id)>=0))}this.didLoadInteractables(),this.kupDidLoad.emit({comp:this,id:this.rootElement.id}),this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){const t=this.rootElement.shadowRoot;if(t){const o=t.querySelectorAll(".f-text-field");for(let t=0;t<o.length;t++)O(o[t])}this.checkScrollOnHover(),this.persistState(),this.didRenderInteractables(),this.kupManager.debug.logRender(this,!0)}render(){const t=!("object"!=typeof this.kanban||null===this.kanban);let o=null;if(this.sortEnabled){const t=[{value:"",id:""},...this.visibleColumns.map((t=>({value:t.title,id:t.name,selected:t.name===this.sortBy})))];let i={label:this.kupManager.language.translate(p.SORT_BY),trailingIcon:!0};o=e("div",{id:"sort-panel"},e("kup-combobox",{data:{"kup-text-field":i,"kup-list":{data:t,selectable:!0}},initialValue:this.sortBy,"onkup-combobox-itemclick":t=>this.onSortChange(t)}))}let i=null;this.globalFilter&&(i=e("div",{id:"global-filter"},e("kup-text-field",{fullWidth:!0,label:this.kupManager.language.translate(m.SEARCH),icon:b.SEARCH,initialValue:this.globalFilterValue,"onkup-textfield-input":t=>{window.clearTimeout(this.globalFilterTimeout),this.globalFilterTimeout=window.setTimeout((()=>this.onGlobalFilterChange(t)),600)}})));let r=null;this.pagination&&(r=e(R,{id:top?"top-paginator":"bottom-paginator",currentPage:this.currentPage,max:this.filteredRows.length,mode:C.SIMPLE,perPage:this.currentRowsPerPage?this.currentRowsPerPage:this.pageSize,onPageChange:t=>this.handlePageChange(t.detail.value),onRowsChange:t=>this.handleRowsPerPageChange(t.detail.value)}));let n=null,a={};if(0===this.rows.length)n=e("div",{id:"empty-data-message",class:"box-wrapper"},e("div",{class:"box",ref:t=>this.rowsRefs.push(t)},this.kupManager.language.translate(p.EMPTY_DATA))),a={"grid-template-columns":"repeat(1, 1fr)"};else if(t){const t=this.kanbanMode();n=t.jsx,a=t.style}else{a={"grid-template-columns":`repeat(${this.columns}, 1fr)`};const t=this.rows;let o=t.length,i=0;for(n=[];o-- >0;)n.push(this.renderRow(t[i++]))}return e(s,null,e("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),e("div",{id:P},e("div",{class:"box-component",ref:t=>this.sectionRef=t},o,i,r,e("div",{class:t?"is-kanban":"",id:"box-container",style:a,onContextMenu:t=>{t.preventDefault()},ref:t=>this.boxContainer=t},n))))}disconnectedCallback(){this.kupManager.interact.unregister(this.interactableDrag.concat(this.interactableDrop)),this.kupManager.language.unregister(this),this.kupManager.theme.unregister(this),this.scrollOnHover&&this.kupManager.scrollOnHover.unregister(this.boxContainer),document.removeEventListener("click",this.clickFunction.bind(this)),this.kupDidUnload.emit({comp:this,id:this.rootElement.id})}get rootElement(){return r(this)}static get watchers(){return{pageSize:["rowsPerPageHandler","recalculateRows"],globalFilterValue:["recalculateRows"],sortBy:["recalculateRows"],pagination:["recalculateRows"],currentPage:["recalculateRows"],currentRowsPerPage:["recalculateRows"],data:["onDataChanged"],layout:["onLayoutChanged"],selectBox:["onSelectBoxChanged"]}}};B.style=":host{--kup_box_background_color:var(\n    --kup-box-background-color,\n    var(--kup-background-color)\n  );--kup_box_color:var(--kup-box-color, var(--kup-text-color));--kup_box_font_family:var(--kup-box-font-family, var(--kup-font-family));--kup_box_font_size:var(--kup-box-font-size, var(--kup-font-size));--kup_box_grid_gap:var(--kup-box-grid-gap, 1em);--kup_box_hover_box_shadow:var(\n    --kup-box-hover-box-shadow,\n    0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)\n  );--kup_box_primary_color_rgb:var(\n    --kup-box-primary-color-rgb,\n    var(--kup-primary-color-rgb)\n  );--kup_box_transition:var(--kup-box-transition, 0.25s);display:block;font-family:var(--kup_box_font_family);font-size:var(--kup_box_font_size)}.box-component{background:var(--kup_box_background_color);transition:border var(--kup_box_transition) ease}.box-component[kup-drag-over]{position:relative;border:3px dashed var(--kup-border-color)}#box-container{display:grid;grid-gap:var(--kup_box_grid_gap);color:var(--kup_box_color);overflow:auto}#box-container.is-kanban .kanban-section{overflow:auto}#box-container.is-kanban .box-wrapper{padding-top:1em}#box-container.is-kanban .box-wrapper .box{overflow:auto}#box-container *{box-sizing:border-box}#box-container .box-wrapper{display:flex;align-items:center}#box-container .box-wrapper .box{flex-grow:1;cursor:pointer;position:relative;display:flex;transition:background-color var(--kup_box_transition) ease, box-shadow var(--kup_box_transition) ease, border var(--kup_box_transition) ease}#box-container .box-wrapper .box.draggable{touch-action:none;user-select:none}#box-container .box-wrapper .box.column{flex-direction:column}#box-container .box-wrapper .box:hover{box-shadow:var(--kup_box_hover_box_shadow)}#box-container .box-wrapper .box.selected{background-color:rgba(var(--kup_box_primary_color_rgb), 0.175)}#box-container .box-wrapper .box.selected .box-section.titled>h3{background-color:transparent}#box-container .box-wrapper .box[kup-draggable]{opacity:0.5}#box-container .box-wrapper .box[kup-drag-over]{border:3px dashed var(--kup-border-color);position:relative;z-index:2}#box-container .box-wrapper .box .box-section{display:flex;flex-direction:row;flex:1 1 1%;flex-wrap:wrap}#box-container .box-wrapper .box .box-section.column{flex-direction:column;justify-content:center;flex-wrap:unset}#box-container .box-wrapper .box .box-section.column>.box-section{flex:0 0 auto}#box-container .box-wrapper .box .box-section.grid{display:grid}#box-container .box-wrapper .box .box-section .box-object{min-height:16px}#box-container .box-wrapper .box .box-section .box-object img{height:auto}#box-container .box-wrapper .box .box-section.collapse-section .header{border-top:1px solid var(--kup-border-color);color:rgba(var(--kup-text-color-rgb), 0.75);display:flex;justify-content:space-around;width:100%}#box-container .box-wrapper .box .box-section.collapse-section .header .header-content{margin:0.5em;display:flex;align-items:center}#box-container .box-wrapper .box .box-section.collapse-section .header .header-content .f-image{transition:transform 0.15s}#box-container .box-wrapper .box .box-section.collapse-section .header .header-content .f-image.toggled{transform:rotate(-180deg)}#box-container .box-wrapper .box .box-section.collapse-section .header .header-content .kup-icon.kup-dropdown-icon{margin:0;-webkit-mask:var(--kup-dropdown-icon);mask:var(--kup-dropdown-icon)}#box-container .box-wrapper .box .box-section.collapse-section .content{display:none;width:100%}#box-container .box-wrapper .box .box-section.collapse-section.open .content{display:block}#box-container .box-wrapper .box .box-section.titled{border:1px solid var(--kup-border-color);padding-top:5px;position:relative;margin:10px}#box-container .box-wrapper .box .box-section.titled>h3{background:var(--kup-background-color);font-size:calc(var(--kup-font-size) * 1.15);position:absolute;margin:0px;padding:0 8px;top:-11px;left:5px;transition:background-color 0.25s ease}#box-container .box-wrapper .box .box-selection{position:absolute;top:0.5em;right:0.5em;z-index:1}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler{position:relative;width:24px;height:24px;margin-left:3px}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler svg{cursor:pointer;opacity:0;fill:var(--kup-text-color);transition:opacity 500ms ease-out}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler .row-action-menu{background:var(--kup-background-color);border:1px solid var(--kup-border-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);position:absolute;top:0;right:24px;display:none;z-index:10}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler .row-action-menu ul{list-style-type:none;margin:0;padding:0}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler .row-action-menu ul>li{cursor:pointer;white-space:nowrap;padding:0 12px;display:flex;align-items:center;line-height:30px}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler .row-action-menu ul>li:not(:last-child){border-bottom:1px solid var(--kup-border-color)}#box-container .box-wrapper .row-actions-wrapper .row-actions-toggler .row-action-menu.open{display:block}#box-container .box-wrapper:hover .row-actions-wrapper .row-actions-toggler svg{opacity:1}#sort-panel,#global-filter{margin-bottom:1em}:host(.kup-center-aligned) #kup-component .box-section{text-align:center}:host(.kup-center-aligned) #kup-component .box-section .f-cell{justify-content:center;margin:auto;text-align:center}:host(.kup-center-aligned) #kup-component .box-section .f-cell .f-cell__content{justify-content:center;margin:auto;text-align:center}:host(.kup-center-aligned) #kup-component .box-section .f-cell img{margin:auto}:host(.kup-right-aligned) #kup-component .box-section{text-align:right}:host(.kup-right-aligned) #kup-component .box-section .f-cell{justify-content:flex-end;margin-left:auto;margin-right:0;text-align:right}:host(.kup-right-aligned) #kup-component .box-section .f-cell .f-cell__content{justify-content:flex-end;margin-left:auto;margin-right:0;text-align:right}:host(.kup-right-aligned) #kup-component .box-section .f-cell img{margin-left:auto;margin-right:0}:host(.kup-top-aligned) #box-container .box-wrapper .box .box-section .column{justify-content:flex-start}:host(.kup-bottom-aligned) #box-container .box-wrapper .box .box-section .column{justify-content:flex-end}:host(:not(.kup-borderless)) .box{border:1px solid var(--kup-border-color)}:host(.kup-flat-on-hover) #box-container .box-wrapper .box:hover{box-shadow:none}:host(.kup-shaped) .box{border-radius:10px}:host(.kup-round) .box{border-radius:25px}:host(.kup-dashed-sections) .box-section{border:2px dashed var(--kup-text-color)}:host(:not(.kup-paddingless)) #box-container .box{padding:3px}:host(:not(.kup-paddingless)) #box-container .box .box-section .box-object{padding:1px 4px}:host(:not(.kup-paddingless)) #box-container .box .box-section.last-child{margin:3px 4px}:host(.kup-danger){--kup-box-primary-color-rgb:var(--kup-danger-color-rgb)}:host(.kup-info){--kup-box-primary-color-rgb:var(--kup-info-color-rgb)}:host(.kup-secondary){--kup-box-primary-color-rgb:var(--kup-secondary-color-rgb)}:host(.kup-success){--kup-box-primary-color-rgb:var(--kup-success-color-rgb)}:host(.kup-warning){--kup-box-primary-color-rgb:var(--kup-warning-color-rgb)}";export{B as kup_box}

package/dist/ketchup/{p-725c6268.entry.js → p-fa37e92e.entry.js}

@@ -1 +1 @@
-import{r as t,c as i,f as s,h as e,H as h,g as o}from"./p-b0b3989b.js";import{k as r,a as l,r as n}from"./p-c05f2638.js";import{c as u}from"./p-97e8ea42.js";import{F as c}from"./p-6f3040fb.js";import{F as a}from"./p-a203f78b.js";import"./p-79b0730b.js";import"./p-81605f08.js";var p;!function(t){t.customStyle="Custom style of the component.",t.data="Props of the sub-components.",t.decimals="Defaults at false. When set to true, the component has decimals.",t.disabled="Defaults at false. When set to true, the component is disabled.",t.initialValue="Sets the initial value of the component",t.maxDecimals="when set, the component allows you to enter decimals with a maximum of characters.",t.maxIntegers="When set, the component allows you to enter integer numbers with a maximum of characters.",t.maxLength="When set, the component allows you to enter numbers with a maximum of characters, including decimals.",t.negative="Defaults at false. When set to true, the component has negative number."}(p||(p={}));const m=class{constructor(s){t(this,s),this.kupBlur=i(this,"kup-numericpicker-blur",6),this.kupChange=i(this,"kup-numericpicker-change",6),this.kupClick=i(this,"kup-numericpicker-click",6),this.kupFocus=i(this,"kup-numericpicker-focus",6),this.kupInput=i(this,"kup-numericpicker-input",6),this.kupIconClick=i(this,"kup-numericpicker-iconclick",6),this.kupItemClick=i(this,"kup-numericpicker-itemclick",6),this.kupTextFieldSubmit=i(this,"kup-numericpicker-textfieldsubmit",6),this.kupClearIconClick=i(this,"kup-numericpicker-cleariconclick",6),this.stateSwitcher=!1,this.value="",this.customStyle="",this.data=null,this.decimals=!1,this.disabled=!1,this.initialValue="",this.maxDecimals=null,this.maxIntegers=null,this.maxLength=null,this.negative=!1,this.kupManager=r(),this.textfieldEl=null,this.pickerContainerEl=null,this.pickerEl={value:(new Date).toISOString(),date:new Date},this.clickCb=null}onKupPickerItemClick(t){this.setPickerValueSelected(t),this.kupChange.emit({comp:this,id:this.rootElement.id,value:this.value}),this.kupItemClick.emit({comp:this,id:this.rootElement.id,value:this.value}),this.setFocus()}onKupClearIconClick(){this.setPickerValueSelected(""),this.kupChange.emit({comp:this,id:this.rootElement.id,value:this.value}),this.kupClearIconClick.emit({comp:this,id:this.rootElement.id})}onKupBlur(){this.kupBlur.emit({id:this.rootElement.id,value:this.value,comp:this})}onKupChange(t){this.refreshPickerValue(t.target.value,this.kupChange)}onKupClick(){this.kupClick.emit({comp:this,id:this.rootElement.id,value:this.value})}onKupFocus(){this.kupFocus.emit({comp:this,id:this.rootElement.id,value:this.value})}onKupInput(t){this.refreshPickerValue(t.target.value,this.kupInput,!0)}onkupTextFieldSubmit(t){"Enter"===t.key&&this.refreshPickerValue(t.target.value,this.kupTextFieldSubmit)}onKupIconClick(){this.isPickerOpened()?this.closePicker():this.openPicker(),this.kupIconClick.emit({comp:this,id:this.rootElement.id,value:this.value})}listenKeyup(t){this.isPickerOpened()&&("Escape"===t.key&&this.closePicker(),"Enter"===t.key&&this.setPickerValueSelected())}async getValue(){return this.value}async getProps(t){let i={};if(t)i=p;else for(const t in p)Object.prototype.hasOwnProperty.call(p,t)&&(i[t]=this[t]);return i}async refresh(){s(this)}async setFocus(){null!=this.textfieldEl&&this.textfieldEl.focus()}async setValue(t){this.value=t}refreshPickerValue(t,i,s){let e=this.kupManager.math.numberify(t,!0);if(e){let t=e.toString();const h=t.indexOf(".");let o=h>-1?t.substring(0,h):t,r=h>-1?t.substring(h+1):"";for(this.maxIntegers&&o.length>this.maxIntegers&&(o=o.substring(o.length-this.maxIntegers)),this.maxDecimals&&r.length>this.maxDecimals&&(r=r.substring(0,this.maxDecimals));this.maxLength&&o.length+r.length>this.maxLength;)r.length>1?r=r.substring(0,r.length-1):o.length>1&&(o=o.substring(1));t=h>-1?`${o}.${r}`:o,1!=s&&this.setValue(t),null!=i&&i.emit({id:this.rootElement.id,value:t})}}setPickerValueSelected(t){1!=this.disabled&&(null==t&&(t=this.getPickerValueSelected()),this.closePicker(),null!=t&&this.setValue(t))}getPickerValueSelected(){return this.pickerEl.value}getValueForPickerComponent(){return this.value}openPicker(){const t=this.textfieldEl;this.pickerContainerEl.menuVisible=!0;const i=this.pickerContainerEl.style;i.height="auto",i.minWidth=this.textfieldEl.parentElement.clientWidth+"px",null!=t&&t.classList.add("toggled"),this.kupManager.dynamicPosition.isRegistered(this.pickerContainerEl)?this.kupManager.dynamicPosition.changeAnchor(this.pickerContainerEl,this.textfieldEl.parentElement):this.kupManager.dynamicPosition.register(this.pickerContainerEl,this.textfieldEl.parentElement,0,l.AUTO,!0),this.kupManager.dynamicPosition.start(this.pickerContainerEl),this.clickCb||(this.clickCb={cb:()=>{this.closePicker()},el:this.pickerContainerEl}),this.kupManager.addClickCallback(this.clickCb,!0)}closePicker(){if(this.kupManager.removeClickCallback(this.clickCb),!this.isPickerOpened())return;let t=this.textfieldEl;null!=t&&t.classList.remove("toggled"),this.pickerContainerEl.menuVisible=!1,this.kupManager.dynamicPosition.stop(this.pickerContainerEl)}isPickerOpened(){return 1==this.pickerContainerEl.menuVisible}getTextFieldId(){return this.textfieldEl.id}prepTextfield(){this.decimals||this.maxIntegers||(this.maxIntegers=17),!this.decimals||this.maxIntegers||this.maxDecimals||(this.maxIntegers=15,this.maxDecimals=2);const t=this.rootElement.classList.contains("kup-full-height"),i=this.rootElement.classList.contains("kup-full-width"),s=Object.assign({},this.data["kup-text-field"]);return s.icon||(s.icon="calculator"),s.icon&&(s.trailingIcon=!0),e(c,Object.assign({},s,{disabled:this.disabled,fullHeight:t,fullWidth:i,id:this.rootElement.id+"_text-field",value:this.kupManager.math.numbers.toLocaleString(this.value),onBlur:()=>this.onKupBlur(),onChange:t=>this.onKupChange(t),onClearIconClick:()=>this.onKupClearIconClick(),onClick:()=>this.onKupClick(),onFocus:()=>this.onKupFocus(),onIconClick:()=>this.onKupIconClick(),onKeyDown:t=>this.onkupTextFieldSubmit(t),onInput:t=>this.onKupInput(t)}),this.prepPicker())}prepPicker(){return e("kup-card",{ref:t=>this.pickerContainerEl=t,data:{options:{decimals:this.decimals,initialValue:this.value,maxDecimals:this.maxDecimals,maxIntegers:this.maxIntegers,maxLength:this.maxLength,negative:this.negative,resetStatus:!0}},layoutFamily:n.BUILT_IN,layoutNumber:5,sizeX:"300px",sizeY:"auto",isMenu:!0,"onkup-card-click":t=>{null!=t.detail.value&&this.onKupPickerItemClick(t.detail.value)}})}componentWillLoad(){this.kupManager.dates.register(this),this.kupManager.debug.logLoad(this,!1),this.kupManager.theme.register(this),this.value=this.initialValue,this.data||(this.data={"kup-text-field":{}})}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){const t=this.rootElement.shadowRoot;if(t){const i=t.querySelector(".f-text-field");i&&(this.textfieldEl=i.querySelector("input"),a(i))}this.kupManager.debug.logRender(this,!0)}render(){return e(h,null,e("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),e("div",{id:u},this.prepTextfield()))}disconnectedCallback(){this.kupManager.dates.unregister(this),this.kupManager.theme.unregister(this),this.pickerContainerEl&&this.pickerContainerEl.remove()}get rootElement(){return o(this)}};m.style=":host{display:block;font-size:var(--kup-font-size)}.f-text-field{position:relative}:host(.kup-full-height){height:100%}:host(.kup-full-height) #kup-component{height:100%}:host(.kup-full-width){width:100%}:host(.kup-full-width) #kup-component{width:100%}:host(.kup-danger){--kup-textfield-primary-color:var(--kup-danger-color);--kup-textfield-primary-color-rgb:var(--kup-danger-color-rgb)}:host(.kup-info){--kup-textfield-primary-color:var(--kup-info-color);--kup-textfield-primary-color-rgb:var(--kup-info-color-rgb)}:host(.kup-secondary){--kup-textfield-primary-color:var(--kup-secondary-color);--kup-textfield-primary-color-rgb:var(--kup-secondary-color-rgb)}:host(.kup-success){--kup-textfield-primary-color:var(--kup-success-color);--kup-textfield-primary-color-rgb:var(--kup-success-color-rgb)}:host(.kup-warning){--kup-textfield-primary-color:var(--kup-warning-color);--kup-textfield-primary-color-rgb:var(--kup-warning-color-rgb)}";export{m as kup_numeric_picker}
+import{r as t,c as i,f as s,h as e,H as h,g as o}from"./p-4fdb684f.js";import{k as r,a as l,r as n}from"./p-a740352c.js";import{c as u}from"./p-97e8ea42.js";import{F as c}from"./p-61ff1761.js";import{F as a}from"./p-a203f78b.js";import"./p-79b0730b.js";import"./p-81605f08.js";var p;!function(t){t.customStyle="Custom style of the component.",t.data="Props of the sub-components.",t.decimals="Defaults at false. When set to true, the component has decimals.",t.disabled="Defaults at false. When set to true, the component is disabled.",t.initialValue="Sets the initial value of the component",t.maxDecimals="when set, the component allows you to enter decimals with a maximum of characters.",t.maxIntegers="When set, the component allows you to enter integer numbers with a maximum of characters.",t.maxLength="When set, the component allows you to enter numbers with a maximum of characters, including decimals.",t.negative="Defaults at false. When set to true, the component has negative number."}(p||(p={}));const m=class{constructor(s){t(this,s),this.kupBlur=i(this,"kup-numericpicker-blur",6),this.kupChange=i(this,"kup-numericpicker-change",6),this.kupClick=i(this,"kup-numericpicker-click",6),this.kupFocus=i(this,"kup-numericpicker-focus",6),this.kupInput=i(this,"kup-numericpicker-input",6),this.kupIconClick=i(this,"kup-numericpicker-iconclick",6),this.kupItemClick=i(this,"kup-numericpicker-itemclick",6),this.kupTextFieldSubmit=i(this,"kup-numericpicker-textfieldsubmit",6),this.kupClearIconClick=i(this,"kup-numericpicker-cleariconclick",6),this.kupManager=r(),this.textfieldEl=null,this.pickerContainerEl=null,this.pickerEl={value:(new Date).toISOString(),date:new Date},this.clickCb=null,this.stateSwitcher=!1,this.value="",this.customStyle="",this.data=null,this.decimals=!1,this.disabled=!1,this.initialValue="",this.maxDecimals=null,this.maxIntegers=null,this.maxLength=null,this.negative=!1}onKupPickerItemClick(t){this.setPickerValueSelected(t),this.kupChange.emit({comp:this,id:this.rootElement.id,value:this.value}),this.kupItemClick.emit({comp:this,id:this.rootElement.id,value:this.value}),this.setFocus()}onKupClearIconClick(){this.setPickerValueSelected(""),this.kupChange.emit({comp:this,id:this.rootElement.id,value:this.value}),this.kupClearIconClick.emit({comp:this,id:this.rootElement.id})}onKupBlur(){this.kupBlur.emit({id:this.rootElement.id,value:this.value,comp:this})}onKupChange(t){this.refreshPickerValue(t.target.value,this.kupChange)}onKupClick(){this.kupClick.emit({comp:this,id:this.rootElement.id,value:this.value})}onKupFocus(){this.kupFocus.emit({comp:this,id:this.rootElement.id,value:this.value})}onKupInput(t){this.refreshPickerValue(t.target.value,this.kupInput,!0)}onkupTextFieldSubmit(t){"Enter"===t.key&&this.refreshPickerValue(t.target.value,this.kupTextFieldSubmit)}onKupIconClick(){this.isPickerOpened()?this.closePicker():this.openPicker(),this.kupIconClick.emit({comp:this,id:this.rootElement.id,value:this.value})}listenKeyup(t){this.isPickerOpened()&&("Escape"===t.key&&this.closePicker(),"Enter"===t.key&&this.setPickerValueSelected())}async getValue(){return this.value}async getProps(t){let i={};if(t)i=p;else for(const t in p)Object.prototype.hasOwnProperty.call(p,t)&&(i[t]=this[t]);return i}async refresh(){s(this)}async setFocus(){null!=this.textfieldEl&&this.textfieldEl.focus()}async setValue(t){this.value=t}refreshPickerValue(t,i,s){let e=this.kupManager.math.numberify(t,!0);if(e){let t=e.toString();const h=t.indexOf(".");let o=h>-1?t.substring(0,h):t,r=h>-1?t.substring(h+1):"";for(this.maxIntegers&&o.length>this.maxIntegers&&(o=o.substring(o.length-this.maxIntegers)),this.maxDecimals&&r.length>this.maxDecimals&&(r=r.substring(0,this.maxDecimals));this.maxLength&&o.length+r.length>this.maxLength;)r.length>1?r=r.substring(0,r.length-1):o.length>1&&(o=o.substring(1));t=h>-1?`${o}.${r}`:o,1!=s&&this.setValue(t),null!=i&&i.emit({id:this.rootElement.id,value:t})}}setPickerValueSelected(t){1!=this.disabled&&(null==t&&(t=this.getPickerValueSelected()),this.closePicker(),null!=t&&this.setValue(t))}getPickerValueSelected(){return this.pickerEl.value}getValueForPickerComponent(){return this.value}openPicker(){const t=this.textfieldEl;this.pickerContainerEl.menuVisible=!0;const i=this.pickerContainerEl.style;i.height="auto",i.minWidth=this.textfieldEl.parentElement.clientWidth+"px",null!=t&&t.classList.add("toggled"),this.kupManager.dynamicPosition.isRegistered(this.pickerContainerEl)?this.kupManager.dynamicPosition.changeAnchor(this.pickerContainerEl,this.textfieldEl.parentElement):this.kupManager.dynamicPosition.register(this.pickerContainerEl,this.textfieldEl.parentElement,0,l.AUTO,!0),this.kupManager.dynamicPosition.start(this.pickerContainerEl),this.clickCb||(this.clickCb={cb:()=>{this.closePicker()},el:this.pickerContainerEl}),this.kupManager.addClickCallback(this.clickCb,!0)}closePicker(){if(this.kupManager.removeClickCallback(this.clickCb),!this.isPickerOpened())return;let t=this.textfieldEl;null!=t&&t.classList.remove("toggled"),this.pickerContainerEl.menuVisible=!1,this.kupManager.dynamicPosition.stop(this.pickerContainerEl)}isPickerOpened(){return 1==this.pickerContainerEl.menuVisible}getTextFieldId(){return this.textfieldEl.id}prepTextfield(){this.decimals||this.maxIntegers||(this.maxIntegers=17),!this.decimals||this.maxIntegers||this.maxDecimals||(this.maxIntegers=15,this.maxDecimals=2);const t=this.rootElement.classList.contains("kup-full-height"),i=this.rootElement.classList.contains("kup-full-width"),s=Object.assign({},this.data["kup-text-field"]);return s.icon||(s.icon="calculator"),s.icon&&(s.trailingIcon=!0),e(c,Object.assign({},s,{disabled:this.disabled,fullHeight:t,fullWidth:i,id:this.rootElement.id+"_text-field",value:this.kupManager.math.numbers.toLocaleString(this.value),onBlur:()=>this.onKupBlur(),onChange:t=>this.onKupChange(t),onClearIconClick:()=>this.onKupClearIconClick(),onClick:()=>this.onKupClick(),onFocus:()=>this.onKupFocus(),onIconClick:()=>this.onKupIconClick(),onKeyDown:t=>this.onkupTextFieldSubmit(t),onInput:t=>this.onKupInput(t)}),this.prepPicker())}prepPicker(){return e("kup-card",{ref:t=>this.pickerContainerEl=t,data:{options:{decimals:this.decimals,initialValue:this.value,maxDecimals:this.maxDecimals,maxIntegers:this.maxIntegers,maxLength:this.maxLength,negative:this.negative,resetStatus:!0}},layoutFamily:n.BUILT_IN,layoutNumber:5,sizeX:"300px",sizeY:"auto",isMenu:!0,"onkup-card-click":t=>{null!=t.detail.value&&this.onKupPickerItemClick(t.detail.value)}})}componentWillLoad(){this.kupManager.dates.register(this),this.kupManager.debug.logLoad(this,!1),this.kupManager.theme.register(this),this.value=this.initialValue,this.data||(this.data={"kup-text-field":{}})}componentDidLoad(){this.kupManager.debug.logLoad(this,!0)}componentWillRender(){this.kupManager.debug.logRender(this,!1)}componentDidRender(){const t=this.rootElement.shadowRoot;if(t){const i=t.querySelector(".f-text-field");i&&(this.textfieldEl=i.querySelector("input"),a(i))}this.kupManager.debug.logRender(this,!0)}render(){return e(h,null,e("style",null,this.kupManager.theme.setKupStyle(this.rootElement)),e("div",{id:u},this.prepTextfield()))}disconnectedCallback(){this.kupManager.dates.unregister(this),this.kupManager.theme.unregister(this),this.pickerContainerEl&&this.pickerContainerEl.remove()}get rootElement(){return o(this)}};m.style=":host{display:block;font-size:var(--kup-font-size)}.f-text-field{position:relative}:host(.kup-full-height){height:100%}:host(.kup-full-height) #kup-component{height:100%}:host(.kup-full-width){width:100%}:host(.kup-full-width) #kup-component{width:100%}:host(.kup-danger){--kup-textfield-primary-color:var(--kup-danger-color);--kup-textfield-primary-color-rgb:var(--kup-danger-color-rgb)}:host(.kup-info){--kup-textfield-primary-color:var(--kup-info-color);--kup-textfield-primary-color-rgb:var(--kup-info-color-rgb)}:host(.kup-secondary){--kup-textfield-primary-color:var(--kup-secondary-color);--kup-textfield-primary-color-rgb:var(--kup-secondary-color-rgb)}:host(.kup-success){--kup-textfield-primary-color:var(--kup-success-color);--kup-textfield-primary-color-rgb:var(--kup-success-color-rgb)}:host(.kup-warning){--kup-textfield-primary-color:var(--kup-warning-color);--kup-textfield-primary-color-rgb:var(--kup-warning-color-rgb)}";export{m as kup_numeric_picker}

package/dist/loader/package.json

@@ -1,5 +1,6 @@
 {
   "name": "ketchup-loader",
+  "private": true,
   "typings": "./index.d.ts",
   "module": "./index.js",
   "main": "./index.cjs.js",

package/dist/types/components/kup-box/kup-box-declarations.d.ts

@@ -42,6 +42,9 @@ export interface KupBoxData {
 export interface KupBoxRow extends KupDataRow {
   layout?: KupBoxLayout;
   badgeData?: KupBadge[];
+  style?: {
+    [index: string]: string;
+  };
 }
 export interface KupBoxLayout {
   horizontal?: boolean;

package/dist/types/components/kup-card/built-in/kup-card-built-in.d.ts

@@ -27,8 +27,13 @@ export declare function create3(component: KupCard): VNode;
 export declare function create4(component: KupCard): VNode;
 /**
  * 5th built-in layout, numeric picker.
- * This layout is rendered after the render cycle completes.
  * @param {KupCard} component - Card component.
- * @returns {VNode} 4th built-in layout virtual node.
+ * @returns {VNode} 5th built-in layout virtual node.
  */
 export declare function create5(component: KupCard): VNode;
+/**
+ * 6th built-in layout, form with submit button.
+ * @param {KupCard} component - Card component.
+ * @returns {VNode} 6th built-in layout virtual node.
+ */
+export declare function create6(component: KupCard): VNode;

package/dist/types/components/kup-card/built-in/kup-card-form.d.ts

@@ -0,0 +1,3 @@
+import { VNode } from '../../../stencil-public-runtime';
+import { KupCard } from '../kup-card';
+export declare function prepareForm(component: KupCard): VNode[];

package/dist/types/components/kup-card/kup-card-declarations.d.ts

@@ -3,6 +3,7 @@ import { KupObj } from '../../managers/kup-objects/kup-objects-declarations';
 import { SourceEvent } from '../kup-date-picker/kup-date-picker-declarations';
 import Picker from 'vanilla-picker';
 import { KupDataColumn, KupDataDataset } from '../../managers/kup-data/kup-data-declarations';
+import { KupFormData } from '../kup-form/kup-form-declarations';
 /**
  * Props of the kup-card component.
  * Used to export every prop in an object.
@@ -52,6 +53,15 @@ export interface KupCardBuiltInClockOptions {
   minutesActive?: boolean;
   secondsActive?: boolean;
 }
+/**
+ * Options of the built-in form.
+ */
+export interface KupCardFormOptions {
+  form: KupFormData;
+  errors: boolean;
+  cancelCb?: () => void;
+  submitCb?: () => void;
+}
 /**
  * Options of the built-in column drop menu.
  */
@@ -145,7 +155,7 @@ export interface KupCardData {
   image?: GenericObject[];
   list?: GenericObject[];
   object?: KupObj[];
-  options?: KupCardBuiltInCalendarOptions | KupCardBuiltInClockOptions | KupCardColumnDropMenuOptions | KupCardColorPickerOptions | KupCardBuiltInNumericOptions;
+  options?: KupCardBuiltInCalendarOptions | KupCardBuiltInClockOptions | KupCardColumnDropMenuOptions | KupCardColorPickerOptions | KupCardBuiltInNumericOptions | KupCardFormOptions;
   progressbar?: GenericObject[];
   switch?: GenericObject[];
   tabbar?: GenericObject[];

package/dist/types/components/kup-card/kup-card.d.ts

@@ -39,6 +39,11 @@ export declare class KupCard {
    * @default false
    */
   menuVisible: boolean;
+  /**
+   * Sets the card as modal window
+   * @default false
+   */
+  showModal: boolean;
   /**
    * The width of the card, defaults to 100%. Accepts any valid CSS format (px, %, vw, etc.).
    * @default "100%"

package/dist/types/components/kup-card/scalable/kup-card-scalable.d.ts

@@ -48,3 +48,9 @@ export declare function create7(component: KupCard): VNode;
  * @returns {VNode} 8th scalable layout virtual node.
  */
 export declare function create8(component: KupCard): VNode;
+/**
+ * 9th scalable card layout, tile view.
+ * @param {KupCard} component - Card component.
+ * @returns {VNode} 8th scalable layout virtual node.
+ */
+export declare function create9(component: KupCard): VNode;

package/dist/types/components/kup-data-table/kup-data-table-declarations.d.ts

@@ -30,6 +30,7 @@ export declare enum KupDataTableProps {
   groupLabelDisplay = "How the label of a group must be displayed. For available values",
   groups = "The list of groups.",
   headerIsPersistent = "When set to true the header will stick on top of the table when scrolling.",
+  insertMode = "Enables insert mode.",
   isFocusable = "When set to true, clicked-on rows will have a visual feedback.",
   lazyLoadRows = "When set to true, extra rows will be automatically loaded once the last row enters the viewport. When groups are present, the number of rows is referred to groups and not to their content. Paginator is disabled.",
   lineBreakCharacter = "Defines the placeholder character which will be replaced by a line break inside table header cells, normal or sticky.",
@@ -45,6 +46,7 @@ export declare enum KupDataTableProps {
   rowsPerPage = "Sets the number of rows per page to display.",
   scrollOnHover = "Activates the scroll on hover function.",
   showCustomization = "If set to true, displays the button to open the customization panel.",
+  showDeleteButton = "Enables the delete row button.",
   showFilters = "When set to true enables the column filters.",
   showFooter = "When set to true shows the footer.",
   showGrid = "Can be used to customize the grid view of the table.",
@@ -99,6 +101,7 @@ export declare enum SortMode {
   A = "A",
   D = "D"
 }
+export declare type KupDataTableInsertMode = 'form' | 'row' | '';
 export interface TotalsMap {
   [index: string]: TotalMode;
 }
@@ -241,3 +244,9 @@ export interface KupDataTableCellButtonClickEventPayload extends KupEventPayload
 export interface KupDatatableLoadMoreClickEventPayload extends KupEventPayload {
   loadItems: number;
 }
+export interface KupDatatableDeleteRowEventPayload extends KupEventPayload {
+  selectedRows: KupDataTableRow[];
+}
+export interface KupDatatableInsertRowEventPayload extends KupEventPayload {
+  row: KupDataTableRow;
+}

package/dist/types/components/kup-data-table/kup-data-table.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import { GroupLabelDisplayMode, GroupObject, LoadMoreMode, PaginatorPos, ShowGrid, SortObject, TotalsMap, SelectionMode, KupDatatableRowSelectedEventPayload, KupDatatableClickEventPayload, KupDatatableColumnMenuEventPayload, KupDatatableRowActionClickEventPayload, KupDatatableLoadMoreClickEventPayload, KupDatatableColumnRemoveEventPayload, KupDatatableColumnMoveEventPayload, KupDataTableDataset, KupDataTableRow } from './kup-data-table-declarations';
+import { GroupLabelDisplayMode, GroupObject, LoadMoreMode, PaginatorPos, ShowGrid, SortObject, TotalsMap, SelectionMode, KupDatatableRowSelectedEventPayload, KupDatatableClickEventPayload, KupDatatableColumnMenuEventPayload, KupDatatableRowActionClickEventPayload, KupDatatableLoadMoreClickEventPayload, KupDatatableColumnRemoveEventPayload, KupDatatableColumnMoveEventPayload, KupDataTableDataset, KupDataTableRow, KupDatatableDeleteRowEventPayload, KupDatatableInsertRowEventPayload, KupDataTableInsertMode } from './kup-data-table-declarations';
 import { GenericObject, KupEventPayload } from '../../types/GenericTypes';
 import { KupDataTableState } from './kup-data-table-state';
 import { KupStore } from '../kup-state/kup-store';
@@ -7,6 +7,7 @@ import { GenericFilter, ValueDisplayedValue } from '../../utils/filters/filters-
 import { FCellPadding } from '../../f-components/f-cell/f-cell-declarations';
 import { KupDataColumn, KupDataNewColumnOptions, KupDataNewColumnTypes, KupDataRowAction } from '../../managers/kup-data/kup-data-declarations';
 export declare class KupDataTable {
+  #private;
   stateId: string;
   store: KupStore;
   state: KupDataTableState;
@@ -113,6 +114,11 @@ export declare class KupDataTable {
    * When set to true the header will stick on top of the table when scrolling.
    */
   headerIsPersistent: boolean;
+  /**
+   * Enables insert mode.
+   * @default '''
+   */
+  insertMode: KupDataTableInsertMode;
   /**
    * When set to true, clicked-on rows will have a visual feedback.
    * @default false
@@ -183,13 +189,13 @@ export declare class KupDataTable {
    */
   showCustomization: boolean;
   /**
-   * When set to true enables the column filters.
+   * Enables the delete row button.
    */
-  showFilters: boolean;
+  showDeleteButton: boolean;
   /**
-   * When set to true enables the column grouping.
+   * When set to true enables the column filters.
    */
-  showGroups: boolean;
+  showFilters: boolean;
   /**
    * When set to true shows the footer.
    */
@@ -198,6 +204,10 @@ export declare class KupDataTable {
    * Can be used to customize the grid view of the table.
    */
   showGrid: ShowGrid;
+  /**
+   * When set to true enables the column grouping.
+   */
+  showGroups: boolean;
   /**
    * Enables rendering of the table header.
    * @namespace KupDataTable.showHeader
@@ -257,73 +267,7 @@ export declare class KupDataTable {
   recalculateRowsAndUndoSelections(): void;
   controlFixedRowsColumns(): void;
   recalculateData(): void;
-  private initialized;
-  private rows;
-  private rowsLength;
-  private paginatedRows;
-  private paginatedRowsLength;
-  private footer;
-  /**
-   * Instance of the KupManager class.
-   */
-  private kupManager;
-  private renderedRows;
-  private loadMoreEventCounter;
-  private loadMoreEventPreviousQuantity;
-  /**
-   * Reference for the thead element
-   * @private
-   */
-  private theadRef;
-  private tableRef;
-  /**
-   * contains the original data, used in transposed function
-   * @private
-   */
-  private originalData;
-  /**
-   * Reference to the working area of the table. This is the below-wrapper reference.
-   */
-  private tableAreaRef;
-  private stickyTheadRef;
-  private customizeTopButtonRef;
-  private customizeTopPanelRef;
-  private sizedColumns;
-  private intObserver;
-  private navBarHeight;
-  private theadIntersecting;
-  private tableIntersecting;
-  private isSafariBrowser;
-  private isRestoringState;
-  private globalFilterTimeout;
-  private totalMenuCoords;
   columnFilterTimeout: number;
-  private clickTimeout;
-  private thRefs;
-  private rowsRefs;
-  private oldWidth;
-  private hold;
-  private interactableDrag;
-  private interactableDrop;
-  private interactableResize;
-  private interactableTouch;
-  private dropareaRef;
-  private removeDropareaRef;
-  private groupsDropareaRef;
-  private clickCb;
-  private clickCbCustomPanel;
-  private clickCbDropCard;
-  /**
-   * Used to prevent too many resizes callbacks at once.
-   */
-  private resizeTimeout;
-  private columnMenuInstance;
-  private filtersColumnMenuInstance;
-  private filtersRowsInstance;
-  private detailCard;
-  private columnMenuCard;
-  private columnDropCard;
-  private columnDropCardAnchor;
   /**
    * When component unload is complete
    */
@@ -369,6 +313,14 @@ export declare class KupDataTable {
    * Event fired when columns are removed (set to hidden).
    */
   kupColumnRemove: EventEmitter<KupDatatableColumnRemoveEventPayload>;
+  /**
+   * Event fired when the delete row button is pressed.
+   */
+  kupDeleteRow: EventEmitter<KupDatatableDeleteRowEventPayload>;
+  /**
+   * Event fired when the insert row confirm button is pressed.
+   */
+  kupInsertRow: EventEmitter<KupDatatableInsertRowEventPayload>;
   /**
    * Closes any opened column menu.
    */
@@ -377,6 +329,29 @@ export declare class KupDataTable {
    * Collapses all groups.
    */
   collapseAll(): Promise<void>;
+  /**
+   * This method will delete rows by id from the data table dataset.
+   * @param {string[]} ids - Array of row ids to delete.
+   * @returns {Promise<Array<KupDataTableRow>>} Deleted rows.
+   */
+  deleteRows(ids?: string[]): Promise<Array<KupDataTableRow>>;
+  /**
+   * Closes the insert new record card (called by backend, on success)
+   */
+  closeInsertCard(): Promise<void>;
+  /**
+   * Closes the delete confirm card (called by backend, on success)
+   */
+  closeConfirmDeleteCard(): Promise<void>;
+  /**
+   * Returns cards and sub components
+   */
+  getCards(): Promise<any>;
+  /**
+   * Adds a new row to the list data
+   * @param row new row
+   */
+  insertNewRow(row: KupDataTableRow): Promise<void>;
   /**
    * Expands all groups.
    */
@@ -411,11 +386,18 @@ export declare class KupDataTable {
   /**
    * This method is used to trigger a new render of the component.
    */
-  refresh(): Promise<void>;
+  refresh(recalcRows?: boolean): Promise<void>;
   /**
    * This method is invoked by KupManager whenever the component changes size.
    */
   resizeCallback(): Promise<void>;
+  /**
+   * Sets the cell value in a table cell.
+   * @param {string} columnName - Name of the column.
+   * @param {string} rowId - Id of the row.
+   * @param {string} value - Value to set.
+   */
+  setCellValue(columnName: string, rowId: string, value: string): Promise<void>;
   /**
    * Sets the focus on an editable table cell.
    * @param {string} column - Name of the column.
@@ -433,155 +415,26 @@ export declare class KupDataTable {
    * @param {boolean} emitEvent - The event will always be emitted unless emitEvent is set to false.
    */
   setSelectedRows(rowsIdentifiers: string[] | number[], emitEvent?: boolean): Promise<void>;
-  private closeDropCard;
-  private createDropCard;
-  private calculateData;
-  private setTransposedData;
-  private switchToTotalsMatrix;
-  private setObjForTotalsMatrix;
-  private getTransposedData;
-  private stickyHeaderPosition;
-  private updateStickyHeaderSize;
-  private setObserver;
-  private didLoadInteractables;
-  private didRenderInteractables;
-  private didLoadObservers;
-  private didRenderObservers;
-  private didLoadEventHandling;
-  private scrollStickyHeader;
-  private checkScrollOnHover;
-  private customizePanelPosition;
-  private rowsPointLength;
-  private paginatedRowsPointLength;
-  private _rowsLength;
-  private setDynPosElements;
   componentWillLoad(): void;
   componentWillRender(): void;
   componentDidRender(): void;
   componentDidLoad(): void;
-  private getEventPath;
-  private resetSelectedRows;
   resetCurrentPage(): void;
   getColumns(): Array<KupDataColumn>;
-  private getSizedColumns;
-  /**
-   * Opens a card containing the detail of the given row.
-   * @param {KupDataTableRow} row - Row for which the detail was requested.
-   * @param {number} x - Initial x coordinates of the card.
-   * @param {number} y - Initial y coordinates of the card.
-   * @private
-   * @memberof KupDataTable
-   */
-  private rowDetail;
-  private getEventDetails;
-  private clickHandler;
-  private contextMenuHandler;
-  private dblClickHandler;
   getVisibleColumns(): Array<KupDataColumn>;
   getGroupByName(column: string): GroupObject;
   getColumnValues(column: KupDataColumn): ValueDisplayedValue[];
   getRows(): Array<KupDataTableRow>;
-  private initRows;
-  private filterRows;
-  private isGrouping;
-  private hasRowActions;
-  private removeGroup;
-  private hasTotals;
-  /**
-   * Returns if the current data table must have the with set to auto to make table as large as the sum
-   * of the table columns fixed width.
-   * Table margin gets set to auto to center it.
-   */
-  private tableHasAutoWidth;
-  private forceGroupExpansion;
-  private forceRowGroupExpansion;
-  private adjustPaginator;
-  private composeFixedCellStyleAndClass;
-  private updateFixedRowsAndColumnsCssVariables;
-  private onColumnSort;
-  private onRemoveFilter;
-  private getFilterValueForTooltip;
-  private onGlobalFilterChange;
-  private handlePageChange;
-  private handleRowsPerPageChange;
-  private onRowClick;
-  private selectColumn;
-  private deselectColumn;
-  private onDefaultRowActionClick;
-  private onRowActionExpanderClick;
-  private handleRowSelect;
-  private onRowExpand;
-  private onSelectAll;
-  private openTotalMenu;
-  private closeTotalMenu;
-  private isOpenedTotalMenuForColumn;
-  private groupRows;
   getInternalState(): Promise<{
     groups: GroupObject[];
     filters: GenericFilter;
     data: KupDataTableDataset;
   }>;
-  private onLoadMoreClick;
-  private adjustGroupState;
-  private adjustGroupStateFromRow;
-  private sortRows;
-  private getSortIcon;
-  private getSortDecode;
-  private calculateColspan;
-  private isGroupExpanded;
-  private handleColumnSort;
-  /**
-   * After a drop of a column header, if the table can update its own data, does so and triggers rerender.
-   * @param columns - The columns to sort
-   * @param receivingColumnIndex - The index where the column will be inserted
-   * @param sortedColumnIndex - The index where the column will be removed
-   */
-  private moveSortedColumns;
   defaultSortingFunction(columns: KupDataColumn[], receivingColumnIndex: number, sortedColumnIndex: number, useNewObject?: boolean): Promise<KupDataColumn[]>;
-  private applyLineBreaks;
-  /**
-   * Given the parameters return the classes and style for each table header cell
-   * @param columnName - The name of the columns currently being examinated
-   * @param columnIndex - The index of the current column
-   * @param extraCells - the extra cells rendered into the table
-   */
-  private composeHeaderCellClassAndStyle;
-  private renderHeader;
-  private renderStickyHeader;
   areTotalsSelected(column: KupDataColumn): boolean;
   onTotalsChange(event: any, column: any): void;
-  private totalMenuPosition;
-  private onTotalMenuOpen;
   renderFooter(): any;
-  private renderRow;
-  private renderActions;
-  private onCustomSettingsClick;
-  private openCustomSettings;
-  private closeCustomSettings;
-  private renderPaginator;
   renderCustomizePanel(): any;
-  private columnRemoveArea;
-  private columnGroupArea;
-  private hideShowColumnDropArea;
-  private handleColumnGroup;
-  private transcodeItem;
-  private createListData;
-  private FONTSIZE_CODES;
-  private FONTSIZE_DECODES;
-  private FONTSIZE_ICONS;
-  private getFontSizeCodeFromDecode;
-  private renderFontSizePanel;
-  private DENSITY_DECODES;
-  private DENSITY_ICONS;
-  private getDensityCodeFromDecode;
-  private renderDensityPanel;
-  private GRID_CODES;
-  private GRID_DECODES;
-  private GRID_ICONS;
-  private getGridCodeFromDecode;
-  private renderTransposeSwitch;
-  private renderTotalsMatrix;
-  private renderGridPanel;
   render(): any;
   disconnectedCallback(): void;
 }