@sme.up/ketchup 6.7.0 → 6.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{f-button-bf76ab95.js → f-button-229c63fd.js} +1 -1
- package/dist/cjs/{f-cell-b7a1524a.js → f-cell-dd006395.js} +5 -5
- package/dist/cjs/{f-chip-a5e100b1.js → f-chip-f2c369fd.js} +2 -2
- package/dist/cjs/{f-image-d80a2749.js → f-image-847a6ddf.js} +1 -1
- package/dist/cjs/{f-paginator-utils-c70812fe.js → f-paginator-utils-cedc4b3e.js} +2 -2
- package/dist/cjs/{f-text-field-48b8bb16.js → f-text-field-fe85187d.js} +1 -1
- package/dist/cjs/ketchup.cjs.js +2 -2
- package/dist/cjs/kup-accordion.cjs.entry.js +6 -29
- package/dist/cjs/{kup-autocomplete_25.cjs.entry.js → kup-autocomplete_26.cjs.entry.js} +3811 -4323
- package/dist/cjs/kup-box.cjs.entry.js +29 -110
- package/dist/cjs/kup-calendar.cjs.entry.js +9 -33
- package/dist/cjs/kup-cell.cjs.entry.js +8 -27
- package/dist/cjs/kup-dash-list.cjs.entry.js +9 -8
- package/dist/cjs/kup-dash_2.cjs.entry.js +6 -34
- package/dist/cjs/kup-dashboard.cjs.entry.js +8 -30
- package/dist/cjs/kup-drawer.cjs.entry.js +3 -18
- package/dist/cjs/kup-echart.cjs.entry.js +15 -76
- package/dist/cjs/kup-family-tree.cjs.entry.js +11 -47
- package/dist/cjs/kup-iframe.cjs.entry.js +4 -16
- package/dist/cjs/kup-image-list.cjs.entry.js +14 -32
- package/dist/cjs/kup-lazy.cjs.entry.js +9 -36
- package/dist/cjs/kup-magic-box.cjs.entry.js +5 -24
- package/dist/cjs/{kup-manager-0e38bf48.js → kup-manager-c53468cd.js} +66 -1
- package/dist/cjs/kup-nav-bar.cjs.entry.js +3 -15
- package/dist/cjs/kup-numeric-picker.cjs.entry.js +13 -56
- package/dist/cjs/kup-photo-frame.cjs.entry.js +8 -30
- package/dist/cjs/kup-probe.cjs.entry.js +12 -32
- package/dist/cjs/kup-qlik.cjs.entry.js +5 -59
- package/dist/cjs/kup-snackbar.cjs.entry.js +6 -37
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/kup-accordion/kup-accordion.js +4 -27
- package/dist/collection/components/kup-autocomplete/kup-autocomplete.js +15 -64
- package/dist/collection/components/kup-badge/kup-badge.js +3 -19
- package/dist/collection/components/kup-box/kup-box.js +22 -103
- package/dist/collection/components/kup-button/kup-button.js +3 -58
- package/dist/collection/components/kup-button-list/kup-button-list.js +3 -38
- package/dist/collection/components/kup-calendar/kup-calendar.js +5 -29
- package/dist/collection/components/kup-card/box/kup-card-box.js +5 -2
- package/dist/collection/components/kup-card/built-in/kup-card-built-in.js +10 -2
- package/dist/collection/components/kup-card/built-in/kup-card-form.js +11 -0
- package/dist/collection/components/kup-card/kup-card.css +78 -12
- package/dist/collection/components/kup-card/kup-card.js +48 -47
- package/dist/collection/components/kup-cell/kup-cell.js +3 -22
- package/dist/collection/components/kup-chart/kup-chart.js +15 -49
- package/dist/collection/components/kup-checkbox/kup-checkbox.js +3 -38
- package/dist/collection/components/kup-chip/kup-chip.js +3 -19
- package/dist/collection/components/kup-color-picker/kup-color-picker.js +4 -35
- package/dist/collection/components/kup-combobox/kup-combobox.js +10 -42
- package/dist/collection/components/kup-dash/kup-dash.js +2 -14
- package/dist/collection/components/kup-dash-list/kup-dash-list.js +8 -7
- package/dist/collection/components/kup-dashboard/kup-dashboard.js +4 -26
- package/dist/collection/components/kup-data-table/kup-data-table-declarations.js +2 -0
- package/dist/collection/components/kup-data-table/kup-data-table.css +9 -0
- package/dist/collection/components/kup-data-table/kup-data-table.js +3546 -3385
- package/dist/collection/components/kup-date-picker/kup-date-picker.js +7 -35
- package/dist/collection/components/kup-drawer/kup-drawer.js +2 -17
- package/dist/collection/components/kup-dropdown-button/kup-dropdown-button.js +12 -63
- package/dist/collection/components/kup-echart/kup-echart.js +14 -75
- package/dist/collection/components/kup-family-tree/kup-family-tree.js +8 -44
- package/dist/collection/components/kup-form/kup-form.js +4 -24
- package/dist/collection/components/kup-gauge/kup-gauge.js +15 -76
- package/dist/collection/components/kup-grid/kup-grid.js +3 -19
- package/dist/collection/components/kup-iframe/kup-iframe.js +3 -15
- package/dist/collection/components/kup-image/kup-image.js +5 -45
- package/dist/collection/components/kup-image-list/kup-image-list.js +8 -26
- package/dist/collection/components/kup-lazy/kup-lazy.js +8 -35
- package/dist/collection/components/kup-list/kup-list.js +5 -68
- package/dist/collection/components/kup-magic-box/kup-magic-box.js +3 -22
- package/dist/collection/components/kup-nav-bar/kup-nav-bar.js +2 -14
- package/dist/collection/components/kup-numeric-picker/kup-numeric-picker.js +11 -54
- package/dist/collection/components/kup-photo-frame/kup-photo-frame.js +7 -29
- package/dist/collection/components/kup-probe/kup-probe.js +11 -31
- package/dist/collection/components/kup-progress-bar/kup-progress-bar.js +3 -35
- package/dist/collection/components/kup-qlik/kup-qlik.js +4 -58
- package/dist/collection/components/kup-radio/kup-radio.js +3 -34
- package/dist/collection/components/kup-rating/kup-rating.js +4 -27
- package/dist/collection/components/kup-snackbar/kup-snackbar.js +3 -34
- package/dist/collection/components/kup-spinner/kup-spinner.js +3 -39
- package/dist/collection/components/kup-switch/kup-switch.js +3 -34
- package/dist/collection/components/kup-tab-bar/kup-tab-bar.js +4 -24
- package/dist/collection/components/kup-text-field/kup-text-field.js +2 -115
- package/dist/collection/components/kup-time-picker/kup-time-picker.js +8 -43
- package/dist/collection/components/kup-tree/kup-tree.js +39 -129
- package/dist/collection/f-components/f-cell/f-cell.js +1 -1
- package/dist/collection/managers/kup-language/kup-language-declarations.js +6 -0
- package/dist/esm/{f-button-e79f7594.js → f-button-d1aba968.js} +1 -1
- package/dist/esm/{f-cell-9400374e.js → f-cell-646406bb.js} +5 -5
- package/dist/esm/{f-chip-bf740287.js → f-chip-d94e9e81.js} +2 -2
- package/dist/esm/{f-image-ab3dc8cb.js → f-image-57c88302.js} +1 -1
- package/dist/esm/{f-paginator-utils-6909e43b.js → f-paginator-utils-2c865e9a.js} +2 -2
- package/dist/esm/{f-text-field-4841dfea.js → f-text-field-b0a1fea6.js} +1 -1
- package/dist/esm/ketchup.js +2 -2
- package/dist/esm/kup-accordion.entry.js +6 -29
- package/dist/esm/{kup-autocomplete_25.entry.js → kup-autocomplete_26.entry.js} +3811 -4324
- package/dist/esm/kup-box.entry.js +29 -110
- package/dist/esm/kup-calendar.entry.js +9 -33
- package/dist/esm/kup-cell.entry.js +8 -27
- package/dist/esm/kup-dash-list.entry.js +9 -8
- package/dist/esm/kup-dash_2.entry.js +6 -34
- package/dist/esm/kup-dashboard.entry.js +8 -30
- package/dist/esm/kup-drawer.entry.js +3 -18
- package/dist/esm/kup-echart.entry.js +15 -76
- package/dist/esm/kup-family-tree.entry.js +11 -47
- package/dist/esm/kup-iframe.entry.js +4 -16
- package/dist/esm/kup-image-list.entry.js +14 -32
- package/dist/esm/kup-lazy.entry.js +9 -36
- package/dist/esm/kup-magic-box.entry.js +5 -24
- package/dist/esm/{kup-manager-c54e6df5.js → kup-manager-c0fbb180.js} +67 -2
- package/dist/esm/kup-nav-bar.entry.js +3 -15
- package/dist/esm/kup-numeric-picker.entry.js +13 -56
- package/dist/esm/kup-photo-frame.entry.js +8 -30
- package/dist/esm/kup-probe.entry.js +12 -32
- package/dist/esm/kup-qlik.entry.js +5 -59
- package/dist/esm/kup-snackbar.entry.js +6 -37
- package/dist/esm/loader.js +2 -2
- package/dist/ketchup/ketchup.esm.js +1 -1
- package/dist/ketchup/{p-30a63b85.entry.js → p-1914969e.entry.js} +1 -1
- package/dist/ketchup/{p-859163c2.entry.js → p-250118e3.entry.js} +1 -1
- package/dist/ketchup/{p-2e184b57.entry.js → p-30766296.entry.js} +1 -1
- package/dist/ketchup/{p-182b869e.entry.js → p-351cecba.entry.js} +1 -1
- package/dist/ketchup/{p-758d03f4.entry.js → p-35e16ea2.entry.js} +1 -1
- package/dist/ketchup/{p-e1d0ea71.js → p-395675b8.js} +1 -1
- package/dist/ketchup/p-3cf97e3a.js +1 -0
- package/dist/ketchup/{p-7e7b6127.entry.js → p-596bdc10.entry.js} +1 -1
- package/dist/ketchup/{p-4f0d3062.js → p-61ff1761.js} +1 -1
- package/dist/ketchup/p-72d4fa26.entry.js +1 -0
- package/dist/ketchup/{p-f9d5e553.entry.js → p-738685f9.entry.js} +1 -1
- package/dist/ketchup/{p-fb4d772a.entry.js → p-7c8c5444.entry.js} +1 -1
- package/dist/ketchup/p-86154e2b.js +1 -0
- package/dist/ketchup/{p-41620707.entry.js → p-9214ef33.entry.js} +1 -1
- package/dist/ketchup/{p-1f5c7f21.entry.js → p-980ed953.entry.js} +1 -1
- package/dist/ketchup/p-991bd70d.entry.js +1 -0
- package/dist/ketchup/{p-bffaef6e.entry.js → p-a1fe329f.entry.js} +1 -1
- package/dist/ketchup/p-a740352c.js +30 -0
- package/dist/ketchup/{p-25bf0cb6.js → p-a992cf87.js} +1 -1
- package/dist/ketchup/{p-313e376b.entry.js → p-b1da1ba7.entry.js} +2 -2
- package/dist/ketchup/{p-4a0ccf18.entry.js → p-cee3635a.entry.js} +1 -1
- package/dist/ketchup/p-d05ed931.entry.js +9 -0
- package/dist/ketchup/{p-8e1fa7a8.entry.js → p-d422151a.entry.js} +2 -2
- package/dist/ketchup/p-e6f19333.entry.js +1 -0
- package/dist/ketchup/p-eb10958a.entry.js +1 -0
- package/dist/ketchup/{p-5bea2971.js → p-ecac6269.js} +1 -1
- package/dist/ketchup/p-f43b445e.entry.js +1 -0
- package/dist/ketchup/{p-6bd57787.entry.js → p-fa37e92e.entry.js} +1 -1
- package/dist/types/components/kup-card/built-in/kup-card-built-in.d.ts +7 -2
- package/dist/types/components/kup-card/built-in/kup-card-form.d.ts +3 -0
- package/dist/types/components/kup-card/kup-card-declarations.d.ts +11 -1
- package/dist/types/components/kup-card/kup-card.d.ts +5 -0
- package/dist/types/components/kup-data-table/kup-data-table-declarations.d.ts +9 -0
- package/dist/types/components/kup-data-table/kup-data-table.d.ts +41 -202
- package/dist/types/components/kup-tree/kup-tree.d.ts +0 -1
- package/dist/types/components.d.ts +55 -2
- package/dist/types/managers/kup-data/kup-data-declarations.d.ts +1 -0
- package/dist/types/managers/kup-language/kup-language-declarations.d.ts +7 -1
- package/dist/types/managers/kup-theme/kup-theme-declarations.d.ts +1 -0
- package/dist/types/stencil-public-runtime.d.ts +5 -0
- package/package.json +2 -2
- package/dist/cjs/kup-form.cjs.entry.js +0 -486
- package/dist/esm/kup-form.entry.js +0 -482
- package/dist/ketchup/p-1dfd2a51.js +0 -30
- package/dist/ketchup/p-22ec1ba0.entry.js +0 -9
- package/dist/ketchup/p-260ff835.entry.js +0 -1
- package/dist/ketchup/p-53d3ae80.entry.js +0 -1
- package/dist/ketchup/p-60fa0ccf.entry.js +0 -1
- package/dist/ketchup/p-6333388c.js +0 -1
- package/dist/ketchup/p-8386e3db.entry.js +0 -1
- package/dist/ketchup/p-90860d9e.entry.js +0 -1
- package/dist/ketchup/p-b7fdc7aa.entry.js +0 -1
- package/dist/ketchup/p-c35c5e05.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
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}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{h as t,a as e}from"./p-4fdb684f.js";import{b as s}from"./p-
|
|
1
|
+
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}
|
|
@@ -0,0 +1 @@
|
|
|
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}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
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-
|
|
1
|
+
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}
|
|
@@ -27,8 +27,13 @@ export declare function create3(component: KupCard): VNode;
|
|
|
27
27
|
export declare function create4(component: KupCard): VNode;
|
|
28
28
|
/**
|
|
29
29
|
* 5th built-in layout, numeric picker.
|
|
30
|
-
* This layout is rendered after the render cycle completes.
|
|
31
30
|
* @param {KupCard} component - Card component.
|
|
32
|
-
* @returns {VNode}
|
|
31
|
+
* @returns {VNode} 5th built-in layout virtual node.
|
|
33
32
|
*/
|
|
34
33
|
export declare function create5(component: KupCard): VNode;
|
|
34
|
+
/**
|
|
35
|
+
* 6th built-in layout, form with submit button.
|
|
36
|
+
* @param {KupCard} component - Card component.
|
|
37
|
+
* @returns {VNode} 6th built-in layout virtual node.
|
|
38
|
+
*/
|
|
39
|
+
export declare function create6(component: KupCard): VNode;
|
|
@@ -3,6 +3,7 @@ import { KupObj } from '../../managers/kup-objects/kup-objects-declarations';
|
|
|
3
3
|
import { SourceEvent } from '../kup-date-picker/kup-date-picker-declarations';
|
|
4
4
|
import Picker from 'vanilla-picker';
|
|
5
5
|
import { KupDataColumn, KupDataDataset } from '../../managers/kup-data/kup-data-declarations';
|
|
6
|
+
import { KupFormData } from '../kup-form/kup-form-declarations';
|
|
6
7
|
/**
|
|
7
8
|
* Props of the kup-card component.
|
|
8
9
|
* Used to export every prop in an object.
|
|
@@ -52,6 +53,15 @@ export interface KupCardBuiltInClockOptions {
|
|
|
52
53
|
minutesActive?: boolean;
|
|
53
54
|
secondsActive?: boolean;
|
|
54
55
|
}
|
|
56
|
+
/**
|
|
57
|
+
* Options of the built-in form.
|
|
58
|
+
*/
|
|
59
|
+
export interface KupCardFormOptions {
|
|
60
|
+
form: KupFormData;
|
|
61
|
+
errors: boolean;
|
|
62
|
+
cancelCb?: () => void;
|
|
63
|
+
submitCb?: () => void;
|
|
64
|
+
}
|
|
55
65
|
/**
|
|
56
66
|
* Options of the built-in column drop menu.
|
|
57
67
|
*/
|
|
@@ -145,7 +155,7 @@ export interface KupCardData {
|
|
|
145
155
|
image?: GenericObject[];
|
|
146
156
|
list?: GenericObject[];
|
|
147
157
|
object?: KupObj[];
|
|
148
|
-
options?: KupCardBuiltInCalendarOptions | KupCardBuiltInClockOptions | KupCardColumnDropMenuOptions | KupCardColorPickerOptions | KupCardBuiltInNumericOptions;
|
|
158
|
+
options?: KupCardBuiltInCalendarOptions | KupCardBuiltInClockOptions | KupCardColumnDropMenuOptions | KupCardColorPickerOptions | KupCardBuiltInNumericOptions | KupCardFormOptions;
|
|
149
159
|
progressbar?: GenericObject[];
|
|
150
160
|
switch?: GenericObject[];
|
|
151
161
|
tabbar?: GenericObject[];
|
|
@@ -39,6 +39,11 @@ export declare class KupCard {
|
|
|
39
39
|
* @default false
|
|
40
40
|
*/
|
|
41
41
|
menuVisible: boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Sets the card as modal window
|
|
44
|
+
* @default false
|
|
45
|
+
*/
|
|
46
|
+
showModal: boolean;
|
|
42
47
|
/**
|
|
43
48
|
* The width of the card, defaults to 100%. Accepts any valid CSS format (px, %, vw, etc.).
|
|
44
49
|
* @default "100%"
|
|
@@ -30,6 +30,7 @@ export declare enum KupDataTableProps {
|
|
|
30
30
|
groupLabelDisplay = "How the label of a group must be displayed. For available values",
|
|
31
31
|
groups = "The list of groups.",
|
|
32
32
|
headerIsPersistent = "When set to true the header will stick on top of the table when scrolling.",
|
|
33
|
+
insertMode = "Enables insert mode.",
|
|
33
34
|
isFocusable = "When set to true, clicked-on rows will have a visual feedback.",
|
|
34
35
|
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.",
|
|
35
36
|
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 {
|
|
|
45
46
|
rowsPerPage = "Sets the number of rows per page to display.",
|
|
46
47
|
scrollOnHover = "Activates the scroll on hover function.",
|
|
47
48
|
showCustomization = "If set to true, displays the button to open the customization panel.",
|
|
49
|
+
showDeleteButton = "Enables the delete row button.",
|
|
48
50
|
showFilters = "When set to true enables the column filters.",
|
|
49
51
|
showFooter = "When set to true shows the footer.",
|
|
50
52
|
showGrid = "Can be used to customize the grid view of the table.",
|
|
@@ -99,6 +101,7 @@ export declare enum SortMode {
|
|
|
99
101
|
A = "A",
|
|
100
102
|
D = "D"
|
|
101
103
|
}
|
|
104
|
+
export declare type KupDataTableInsertMode = 'form' | 'row' | '';
|
|
102
105
|
export interface TotalsMap {
|
|
103
106
|
[index: string]: TotalMode;
|
|
104
107
|
}
|
|
@@ -241,3 +244,9 @@ export interface KupDataTableCellButtonClickEventPayload extends KupEventPayload
|
|
|
241
244
|
export interface KupDatatableLoadMoreClickEventPayload extends KupEventPayload {
|
|
242
245
|
loadItems: number;
|
|
243
246
|
}
|
|
247
|
+
export interface KupDatatableDeleteRowEventPayload extends KupEventPayload {
|
|
248
|
+
selectedRows: KupDataTableRow[];
|
|
249
|
+
}
|
|
250
|
+
export interface KupDatatableInsertRowEventPayload extends KupEventPayload {
|
|
251
|
+
row: KupDataTableRow;
|
|
252
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
-
import { GroupLabelDisplayMode, GroupObject, LoadMoreMode, PaginatorPos, ShowGrid, SortObject, TotalsMap, SelectionMode, KupDatatableRowSelectedEventPayload, KupDatatableClickEventPayload, KupDatatableColumnMenuEventPayload, KupDatatableRowActionClickEventPayload, KupDatatableLoadMoreClickEventPayload, KupDatatableColumnRemoveEventPayload, KupDatatableColumnMoveEventPayload, KupDataTableDataset, KupDataTableRow } from './kup-data-table-declarations';
|
|
2
|
+
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';
|
|
3
3
|
import { GenericObject, KupEventPayload } from '../../types/GenericTypes';
|
|
4
4
|
import { KupDataTableState } from './kup-data-table-state';
|
|
5
5
|
import { KupStore } from '../kup-state/kup-store';
|
|
@@ -7,6 +7,7 @@ import { GenericFilter, ValueDisplayedValue } from '../../utils/filters/filters-
|
|
|
7
7
|
import { FCellPadding } from '../../f-components/f-cell/f-cell-declarations';
|
|
8
8
|
import { KupDataColumn, KupDataNewColumnOptions, KupDataNewColumnTypes, KupDataRowAction } from '../../managers/kup-data/kup-data-declarations';
|
|
9
9
|
export declare class KupDataTable {
|
|
10
|
+
#private;
|
|
10
11
|
stateId: string;
|
|
11
12
|
store: KupStore;
|
|
12
13
|
state: KupDataTableState;
|
|
@@ -113,6 +114,11 @@ export declare class KupDataTable {
|
|
|
113
114
|
* When set to true the header will stick on top of the table when scrolling.
|
|
114
115
|
*/
|
|
115
116
|
headerIsPersistent: boolean;
|
|
117
|
+
/**
|
|
118
|
+
* Enables insert mode.
|
|
119
|
+
* @default '''
|
|
120
|
+
*/
|
|
121
|
+
insertMode: KupDataTableInsertMode;
|
|
116
122
|
/**
|
|
117
123
|
* When set to true, clicked-on rows will have a visual feedback.
|
|
118
124
|
* @default false
|
|
@@ -183,13 +189,13 @@ export declare class KupDataTable {
|
|
|
183
189
|
*/
|
|
184
190
|
showCustomization: boolean;
|
|
185
191
|
/**
|
|
186
|
-
*
|
|
192
|
+
* Enables the delete row button.
|
|
187
193
|
*/
|
|
188
|
-
|
|
194
|
+
showDeleteButton: boolean;
|
|
189
195
|
/**
|
|
190
|
-
* When set to true enables the column
|
|
196
|
+
* When set to true enables the column filters.
|
|
191
197
|
*/
|
|
192
|
-
|
|
198
|
+
showFilters: boolean;
|
|
193
199
|
/**
|
|
194
200
|
* When set to true shows the footer.
|
|
195
201
|
*/
|
|
@@ -198,6 +204,10 @@ export declare class KupDataTable {
|
|
|
198
204
|
* Can be used to customize the grid view of the table.
|
|
199
205
|
*/
|
|
200
206
|
showGrid: ShowGrid;
|
|
207
|
+
/**
|
|
208
|
+
* When set to true enables the column grouping.
|
|
209
|
+
*/
|
|
210
|
+
showGroups: boolean;
|
|
201
211
|
/**
|
|
202
212
|
* Enables rendering of the table header.
|
|
203
213
|
* @namespace KupDataTable.showHeader
|
|
@@ -257,73 +267,7 @@ export declare class KupDataTable {
|
|
|
257
267
|
recalculateRowsAndUndoSelections(): void;
|
|
258
268
|
controlFixedRowsColumns(): void;
|
|
259
269
|
recalculateData(): void;
|
|
260
|
-
private initialized;
|
|
261
|
-
private rows;
|
|
262
|
-
private rowsLength;
|
|
263
|
-
private paginatedRows;
|
|
264
|
-
private paginatedRowsLength;
|
|
265
|
-
private footer;
|
|
266
|
-
/**
|
|
267
|
-
* Instance of the KupManager class.
|
|
268
|
-
*/
|
|
269
|
-
private kupManager;
|
|
270
|
-
private renderedRows;
|
|
271
|
-
private loadMoreEventCounter;
|
|
272
|
-
private loadMoreEventPreviousQuantity;
|
|
273
|
-
/**
|
|
274
|
-
* Reference for the thead element
|
|
275
|
-
* @private
|
|
276
|
-
*/
|
|
277
|
-
private theadRef;
|
|
278
|
-
private tableRef;
|
|
279
|
-
/**
|
|
280
|
-
* contains the original data, used in transposed function
|
|
281
|
-
* @private
|
|
282
|
-
*/
|
|
283
|
-
private originalData;
|
|
284
|
-
/**
|
|
285
|
-
* Reference to the working area of the table. This is the below-wrapper reference.
|
|
286
|
-
*/
|
|
287
|
-
private tableAreaRef;
|
|
288
|
-
private stickyTheadRef;
|
|
289
|
-
private customizeTopButtonRef;
|
|
290
|
-
private customizeTopPanelRef;
|
|
291
|
-
private sizedColumns;
|
|
292
|
-
private intObserver;
|
|
293
|
-
private navBarHeight;
|
|
294
|
-
private theadIntersecting;
|
|
295
|
-
private tableIntersecting;
|
|
296
|
-
private isSafariBrowser;
|
|
297
|
-
private isRestoringState;
|
|
298
|
-
private globalFilterTimeout;
|
|
299
|
-
private totalMenuCoords;
|
|
300
270
|
columnFilterTimeout: number;
|
|
301
|
-
private clickTimeout;
|
|
302
|
-
private thRefs;
|
|
303
|
-
private rowsRefs;
|
|
304
|
-
private oldWidth;
|
|
305
|
-
private hold;
|
|
306
|
-
private interactableDrag;
|
|
307
|
-
private interactableDrop;
|
|
308
|
-
private interactableResize;
|
|
309
|
-
private interactableTouch;
|
|
310
|
-
private dropareaRef;
|
|
311
|
-
private removeDropareaRef;
|
|
312
|
-
private groupsDropareaRef;
|
|
313
|
-
private clickCb;
|
|
314
|
-
private clickCbCustomPanel;
|
|
315
|
-
private clickCbDropCard;
|
|
316
|
-
/**
|
|
317
|
-
* Used to prevent too many resizes callbacks at once.
|
|
318
|
-
*/
|
|
319
|
-
private resizeTimeout;
|
|
320
|
-
private columnMenuInstance;
|
|
321
|
-
private filtersColumnMenuInstance;
|
|
322
|
-
private filtersRowsInstance;
|
|
323
|
-
private detailCard;
|
|
324
|
-
private columnMenuCard;
|
|
325
|
-
private columnDropCard;
|
|
326
|
-
private columnDropCardAnchor;
|
|
327
271
|
/**
|
|
328
272
|
* When component unload is complete
|
|
329
273
|
*/
|
|
@@ -369,6 +313,14 @@ export declare class KupDataTable {
|
|
|
369
313
|
* Event fired when columns are removed (set to hidden).
|
|
370
314
|
*/
|
|
371
315
|
kupColumnRemove: EventEmitter<KupDatatableColumnRemoveEventPayload>;
|
|
316
|
+
/**
|
|
317
|
+
* Event fired when the delete row button is pressed.
|
|
318
|
+
*/
|
|
319
|
+
kupDeleteRow: EventEmitter<KupDatatableDeleteRowEventPayload>;
|
|
320
|
+
/**
|
|
321
|
+
* Event fired when the insert row confirm button is pressed.
|
|
322
|
+
*/
|
|
323
|
+
kupInsertRow: EventEmitter<KupDatatableInsertRowEventPayload>;
|
|
372
324
|
/**
|
|
373
325
|
* Closes any opened column menu.
|
|
374
326
|
*/
|
|
@@ -383,6 +335,23 @@ export declare class KupDataTable {
|
|
|
383
335
|
* @returns {Promise<Array<KupDataTableRow>>} Deleted rows.
|
|
384
336
|
*/
|
|
385
337
|
deleteRows(ids?: string[]): Promise<Array<KupDataTableRow>>;
|
|
338
|
+
/**
|
|
339
|
+
* Closes the insert new record card (called by backend, on success)
|
|
340
|
+
*/
|
|
341
|
+
closeInsertCard(): Promise<void>;
|
|
342
|
+
/**
|
|
343
|
+
* Closes the delete confirm card (called by backend, on success)
|
|
344
|
+
*/
|
|
345
|
+
closeConfirmDeleteCard(): Promise<void>;
|
|
346
|
+
/**
|
|
347
|
+
* Returns cards and sub components
|
|
348
|
+
*/
|
|
349
|
+
getCards(): Promise<any>;
|
|
350
|
+
/**
|
|
351
|
+
* Adds a new row to the list data
|
|
352
|
+
* @param row new row
|
|
353
|
+
*/
|
|
354
|
+
insertNewRow(row: KupDataTableRow): Promise<void>;
|
|
386
355
|
/**
|
|
387
356
|
* Expands all groups.
|
|
388
357
|
*/
|
|
@@ -417,7 +386,7 @@ export declare class KupDataTable {
|
|
|
417
386
|
/**
|
|
418
387
|
* This method is used to trigger a new render of the component.
|
|
419
388
|
*/
|
|
420
|
-
refresh(): Promise<void>;
|
|
389
|
+
refresh(recalcRows?: boolean): Promise<void>;
|
|
421
390
|
/**
|
|
422
391
|
* This method is invoked by KupManager whenever the component changes size.
|
|
423
392
|
*/
|
|
@@ -446,156 +415,26 @@ export declare class KupDataTable {
|
|
|
446
415
|
* @param {boolean} emitEvent - The event will always be emitted unless emitEvent is set to false.
|
|
447
416
|
*/
|
|
448
417
|
setSelectedRows(rowsIdentifiers: string[] | number[], emitEvent?: boolean): Promise<void>;
|
|
449
|
-
private closeDropCard;
|
|
450
|
-
private createDropCard;
|
|
451
|
-
private calculateData;
|
|
452
|
-
private getRow;
|
|
453
|
-
private getTransposedData;
|
|
454
|
-
private setTransposedData;
|
|
455
|
-
private switchToTotalsMatrix;
|
|
456
|
-
private setObjForTotalsMatrix;
|
|
457
|
-
private stickyHeaderPosition;
|
|
458
|
-
private updateStickyHeaderSize;
|
|
459
|
-
private setObserver;
|
|
460
|
-
private didLoadInteractables;
|
|
461
|
-
private didRenderInteractables;
|
|
462
|
-
private didLoadObservers;
|
|
463
|
-
private didRenderObservers;
|
|
464
|
-
private didLoadEventHandling;
|
|
465
|
-
private scrollStickyHeader;
|
|
466
|
-
private checkScrollOnHover;
|
|
467
|
-
private customizePanelPosition;
|
|
468
|
-
private rowsPointLength;
|
|
469
|
-
private paginatedRowsPointLength;
|
|
470
|
-
private _rowsLength;
|
|
471
|
-
private setDynPosElements;
|
|
472
418
|
componentWillLoad(): void;
|
|
473
419
|
componentWillRender(): void;
|
|
474
420
|
componentDidRender(): void;
|
|
475
421
|
componentDidLoad(): void;
|
|
476
|
-
private getEventPath;
|
|
477
|
-
private resetSelectedRows;
|
|
478
422
|
resetCurrentPage(): void;
|
|
479
423
|
getColumns(): Array<KupDataColumn>;
|
|
480
|
-
private getSizedColumns;
|
|
481
|
-
/**
|
|
482
|
-
* Opens a card containing the detail of the given row.
|
|
483
|
-
* @param {KupDataTableRow} row - Row for which the detail was requested.
|
|
484
|
-
* @param {number} x - Initial x coordinates of the card.
|
|
485
|
-
* @param {number} y - Initial y coordinates of the card.
|
|
486
|
-
* @private
|
|
487
|
-
* @memberof KupDataTable
|
|
488
|
-
*/
|
|
489
|
-
private rowDetail;
|
|
490
|
-
private getEventDetails;
|
|
491
|
-
private clickHandler;
|
|
492
|
-
private contextMenuHandler;
|
|
493
|
-
private dblClickHandler;
|
|
494
424
|
getVisibleColumns(): Array<KupDataColumn>;
|
|
495
425
|
getGroupByName(column: string): GroupObject;
|
|
496
426
|
getColumnValues(column: KupDataColumn): ValueDisplayedValue[];
|
|
497
427
|
getRows(): Array<KupDataTableRow>;
|
|
498
|
-
private initRows;
|
|
499
|
-
private filterRows;
|
|
500
|
-
private isGrouping;
|
|
501
|
-
private hasRowActions;
|
|
502
|
-
private removeGroup;
|
|
503
|
-
private hasTotals;
|
|
504
|
-
/**
|
|
505
|
-
* Returns if the current data table must have the with set to auto to make table as large as the sum
|
|
506
|
-
* of the table columns fixed width.
|
|
507
|
-
* Table margin gets set to auto to center it.
|
|
508
|
-
*/
|
|
509
|
-
private tableHasAutoWidth;
|
|
510
|
-
private forceGroupExpansion;
|
|
511
|
-
private forceRowGroupExpansion;
|
|
512
|
-
private adjustPaginator;
|
|
513
|
-
private composeFixedCellStyleAndClass;
|
|
514
|
-
private updateFixedRowsAndColumnsCssVariables;
|
|
515
|
-
private onColumnSort;
|
|
516
|
-
private onRemoveFilter;
|
|
517
|
-
private getFilterValueForTooltip;
|
|
518
|
-
private onGlobalFilterChange;
|
|
519
|
-
private handlePageChange;
|
|
520
|
-
private handleRowsPerPageChange;
|
|
521
|
-
private onRowClick;
|
|
522
|
-
private selectColumn;
|
|
523
|
-
private deselectColumn;
|
|
524
|
-
private onDefaultRowActionClick;
|
|
525
|
-
private onRowActionExpanderClick;
|
|
526
|
-
private handleRowSelect;
|
|
527
|
-
private onRowExpand;
|
|
528
|
-
private onSelectAll;
|
|
529
|
-
private openTotalMenu;
|
|
530
|
-
private closeTotalMenu;
|
|
531
|
-
private isOpenedTotalMenuForColumn;
|
|
532
|
-
private groupRows;
|
|
533
428
|
getInternalState(): Promise<{
|
|
534
429
|
groups: GroupObject[];
|
|
535
430
|
filters: GenericFilter;
|
|
536
431
|
data: KupDataTableDataset;
|
|
537
432
|
}>;
|
|
538
|
-
private onLoadMoreClick;
|
|
539
|
-
private adjustGroupState;
|
|
540
|
-
private adjustGroupStateFromRow;
|
|
541
|
-
private sortRows;
|
|
542
|
-
private getSortIcon;
|
|
543
|
-
private getSortDecode;
|
|
544
|
-
private calculateColspan;
|
|
545
|
-
private isGroupExpanded;
|
|
546
|
-
private handleColumnSort;
|
|
547
|
-
/**
|
|
548
|
-
* After a drop of a column header, if the table can update its own data, does so and triggers rerender.
|
|
549
|
-
* @param columns - The columns to sort
|
|
550
|
-
* @param receivingColumnIndex - The index where the column will be inserted
|
|
551
|
-
* @param sortedColumnIndex - The index where the column will be removed
|
|
552
|
-
*/
|
|
553
|
-
private moveSortedColumns;
|
|
554
433
|
defaultSortingFunction(columns: KupDataColumn[], receivingColumnIndex: number, sortedColumnIndex: number, useNewObject?: boolean): Promise<KupDataColumn[]>;
|
|
555
|
-
private applyLineBreaks;
|
|
556
|
-
/**
|
|
557
|
-
* Given the parameters return the classes and style for each table header cell
|
|
558
|
-
* @param columnName - The name of the columns currently being examinated
|
|
559
|
-
* @param columnIndex - The index of the current column
|
|
560
|
-
* @param extraCells - the extra cells rendered into the table
|
|
561
|
-
*/
|
|
562
|
-
private composeHeaderCellClassAndStyle;
|
|
563
|
-
private renderHeader;
|
|
564
|
-
private renderStickyHeader;
|
|
565
434
|
areTotalsSelected(column: KupDataColumn): boolean;
|
|
566
435
|
onTotalsChange(event: any, column: any): void;
|
|
567
|
-
private totalMenuPosition;
|
|
568
|
-
private onTotalMenuOpen;
|
|
569
436
|
renderFooter(): any;
|
|
570
|
-
private renderRow;
|
|
571
|
-
private renderActions;
|
|
572
|
-
private onCustomSettingsClick;
|
|
573
|
-
private openCustomSettings;
|
|
574
|
-
private closeCustomSettings;
|
|
575
|
-
private renderPaginator;
|
|
576
437
|
renderCustomizePanel(): any;
|
|
577
|
-
private columnRemoveArea;
|
|
578
|
-
private columnGroupArea;
|
|
579
|
-
private hideShowColumnDropArea;
|
|
580
|
-
private handleColumnGroup;
|
|
581
|
-
private transcodeItem;
|
|
582
|
-
private createListData;
|
|
583
|
-
private FONTSIZE_CODES;
|
|
584
|
-
private FONTSIZE_DECODES;
|
|
585
|
-
private FONTSIZE_ICONS;
|
|
586
|
-
private getFontSizeCodeFromDecode;
|
|
587
|
-
private renderFontSizePanel;
|
|
588
|
-
private DENSITY_DECODES;
|
|
589
|
-
private DENSITY_ICONS;
|
|
590
|
-
private getDensityCodeFromDecode;
|
|
591
|
-
private renderDensityPanel;
|
|
592
|
-
private GRID_CODES;
|
|
593
|
-
private GRID_DECODES;
|
|
594
|
-
private GRID_ICONS;
|
|
595
|
-
private getGridCodeFromDecode;
|
|
596
|
-
private renderTransposeSwitch;
|
|
597
|
-
private renderTotalsMatrix;
|
|
598
|
-
private renderGridPanel;
|
|
599
438
|
render(): any;
|
|
600
439
|
disconnectedCallback(): void;
|
|
601
440
|
}
|