@iamproperty/components 3.7.2 → 3.7.4
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/assets/css/components/card.css +1 -1
- package/assets/css/components/card.css.map +1 -1
- package/assets/css/components/dialog.css +1 -1
- package/assets/css/components/dialog.css.map +1 -1
- package/assets/css/components/pagination.css +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/components/table.css +1 -1
- package/assets/css/components/table.css.map +1 -1
- package/assets/css/components/tooltips.css +1 -1
- package/assets/css/components/tooltips.css.map +1 -1
- package/assets/css/core.min.css +1 -1
- package/assets/css/core.min.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.js +5 -5
- package/assets/js/components/accordion/accordion.component.min.js +6 -5
- package/assets/js/components/accordion/accordion.component.min.js.map +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.js +10 -3
- package/assets/js/components/applied-filters/applied-filters.component.min.js +14 -0
- package/assets/js/components/applied-filters/applied-filters.component.min.js.map +1 -0
- package/assets/js/components/card/card.component.js +11 -3
- package/assets/js/components/card/card.component.min.js +6 -6
- package/assets/js/components/card/card.component.min.js.map +1 -1
- package/assets/js/components/filterlist/filterlist.component.js +2 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +4 -4
- package/assets/js/components/filterlist/filterlist.component.min.js.map +1 -1
- package/assets/js/components/header/header.component.js +3 -5
- package/assets/js/components/header/header.component.min.js +4 -8
- package/assets/js/components/header/header.component.min.js.map +1 -1
- package/assets/js/components/pagination/pagination.component.js +4 -1
- package/assets/js/components/pagination/pagination.component.min.js +20 -0
- package/assets/js/components/pagination/pagination.component.min.js.map +1 -0
- package/assets/js/components/table/table.component.js +5 -1
- package/assets/js/components/table/table.component.min.js +14 -12
- package/assets/js/components/table/table.component.min.js.map +1 -1
- package/assets/js/components/tabs/tabs.component.js +2 -1
- package/assets/js/components/tabs/tabs.component.min.js +3 -3
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/dynamic.min.js +2 -2
- package/assets/js/dynamic.min.js.map +1 -1
- package/assets/js/modules/dialogs.js +8 -1
- package/assets/js/modules/table.js +19 -6
- package/assets/js/scripts.bundle.js +37 -37
- package/assets/js/scripts.bundle.js.map +1 -1
- package/assets/js/scripts.bundle.min.js +2 -2
- package/assets/js/scripts.bundle.min.js.map +1 -1
- package/assets/sass/_corefiles.scss +1 -0
- package/assets/sass/components/card.scss +2 -3
- package/assets/sass/components/dialog.scss +49 -4
- package/assets/sass/components/pagination.scss +2 -1
- package/assets/sass/components/table.scss +26 -12
- package/assets/sass/components/tooltips.scss +137 -49
- package/assets/sass/foundations/buttons.scss +1 -1
- package/assets/sass/foundations/reboot.scss +32 -2
- package/assets/ts/components/accordion/accordion.component.ts +6 -8
- package/assets/ts/components/applied-filters/applied-filters.component.ts +12 -3
- package/assets/ts/components/card/card.component.ts +16 -4
- package/assets/ts/components/filterlist/filterlist.component.ts +4 -2
- package/assets/ts/components/header/header.component.ts +4 -5
- package/assets/ts/components/pagination/pagination.component.ts +4 -1
- package/assets/ts/components/table/table.component.ts +5 -1
- package/assets/ts/components/tabs/tabs.component.ts +3 -1
- package/assets/ts/modules/dialogs.ts +11 -4
- package/assets/ts/modules/table.ts +25 -8
- package/dist/components.es.js +1179 -1148
- package/dist/components.umd.js +55 -36
- package/package.json +1 -1
- package/src/components/Accordion/Accordion.vue +1 -1
- package/src/components/AppliedFilters/AppliedFilters.vue +1 -1
- package/src/components/Filterlist/Filterlist.vue +1 -1
- package/src/components/Header/Header.vue +9 -5
- package/src/components/Pagination/Pagination.vue +1 -1
- package/src/components/Table/Table.vue +1 -1
- package/src/components/Tabs/Tabs.vue +1 -1
- package/src/components/Header/Header.spec.js +0 -34
|
@@ -10,17 +10,14 @@ class iamHeader extends HTMLElement {
|
|
|
10
10
|
super();
|
|
11
11
|
this.attachShadow({ mode: 'open' });
|
|
12
12
|
const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';
|
|
13
|
+
const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;
|
|
13
14
|
const loadCSS = `@import "${assetLocation}/css/components/header.css";`;
|
|
14
15
|
const template = document.createElement('template');
|
|
15
16
|
template.innerHTML = `
|
|
16
17
|
<style>
|
|
17
|
-
@import "${
|
|
18
|
+
@import "${coreCSS}";
|
|
18
19
|
${loadCSS}
|
|
19
20
|
${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
|
|
20
|
-
:host {
|
|
21
|
-
max-width:100%!important;
|
|
22
|
-
padding:0!important;
|
|
23
|
-
}
|
|
24
21
|
</style>
|
|
25
22
|
<div class="header-banner">
|
|
26
23
|
<div class="container" part="container">
|
|
@@ -40,6 +37,7 @@ class iamHeader extends HTMLElement {
|
|
|
40
37
|
this.shadowRoot.appendChild(template.content.cloneNode(true));
|
|
41
38
|
}
|
|
42
39
|
connectedCallback() {
|
|
40
|
+
this.classList.add('loaded');
|
|
43
41
|
const picture = this.shadowRoot.querySelector('picture');
|
|
44
42
|
const source = this.shadowRoot.querySelector('picture source');
|
|
45
43
|
if (this.hasAttribute('image'))
|
|
@@ -1,16 +1,12 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v3.7.
|
|
2
|
+
* iamKey v3.7.4
|
|
3
3
|
* Copyright 2022-2023 iamproperty
|
|
4
|
-
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class
|
|
4
|
+
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class t extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",r=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,o=document.createElement("template");o.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
@import "${r}
|
|
6
|
+
@import "${r}";
|
|
7
7
|
.header-banner{background:linear-gradient(180deg, var(--colour-secondary) 0, var(--colour-info) 100%);margin-bottom:2rem;position:relative;overflow:hidden;max-width:100% !important}@media screen and (min-width: 62em){.header-banner{min-height:29.375rem}}.header-banner>.container{padding-bottom:0;position:relative}.header-banner .breadcrumb{margin-top:1.5rem;margin-bottom:-0.5rem}@media screen and (min-width: 62em){.header-banner .breadcrumb{position:absolute;top:0;left:3.75rem}}.header-banner__inner{--colour-muted: #9d9d9d;--colour-body: #595959;--colour-border: #D8D8D8;--colour-link: var(--colour-primary-theme);--colour-brand: var(--colour-primary);--colour-underline: var(--colour-secondary);--colour-heading: var(--colour-primary);--colour-focus: var(--colour-primary-theme);--colour-hover: var(--colour-primary-theme);--colour-active: var(--colour-primary-theme);--colour-selected: var(--colour-info);--colour-inverted: #FCFCFC;--colour-btn: var(--colour-primary-theme);--colour-btn-bg: var(--colour-warning);--colour-btn-border: var(--colour-warning);--colour-btn-bg-hover: transparent;--colour-btn-hover: var(--colour-primary-theme);--colour-btn-secondary: var(--colour-primary-theme);--colour-btn-secondary-border: var(--colour-primary-theme);--colour-btn-secondary-bg: transparent;--colour-btn-secondary-bg-hover: var(--colour-primary-theme);--colour-btn-secondary-hover: var(--colour-inverted);--colour-canvas-2: var(--colour-canvas);color:var(--colour-body);background:#fff;padding:2rem;margin:1.875rem 0;position:relative;z-index:var(--index-above)}.header-banner__inner .text-primary{color:var(--colour-primary) !important}@media screen and (min-width: 62em){.header-banner__inner{max-width:37.5rem;margin:7rem 0 5rem 0;padding:3.5rem 4rem}}.header-banner__inner>*:last-child{padding-bottom:0;margin-bottom:0}.header-banner picture img{display:none}@media screen and (min-width: 62em){.header-banner picture img{display:block;position:absolute;top:-0.5%;left:40%;height:101%;object-fit:cover;width:60%;pointer-events:none}}::slotted(.breadcrumb){margin-top:1.5rem !important;margin-bottom:-0.5rem !important}@media screen and (min-width: 62em){::slotted(.breadcrumb){position:absolute !important;top:0 !important;left:5.25rem !important}}::slotted(*:last-child){padding-bottom:0 !important;margin-bottom:0 !important}/*# sourceMappingURL=assets/css/components/header.css.map */
|
|
8
8
|
|
|
9
9
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
10
|
-
:host {
|
|
11
|
-
max-width:100%!important;
|
|
12
|
-
padding:0!important;
|
|
13
|
-
}
|
|
14
10
|
</style>
|
|
15
11
|
<div class="header-banner">
|
|
16
12
|
<div class="container" part="container">
|
|
@@ -26,5 +22,5 @@
|
|
|
26
22
|
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" alt="" lazy="" />
|
|
27
23
|
</picture>
|
|
28
24
|
</div>
|
|
29
|
-
`,this.shadowRoot.appendChild(
|
|
25
|
+
`,this.shadowRoot.appendChild(o.content.cloneNode(!0))}connectedCallback(){this.classList.add("loaded");const e=this.shadowRoot.querySelector("picture"),r=this.shadowRoot.querySelector("picture source");this.hasAttribute("image")?r.setAttribute("srcset",this.getAttribute("image")):e.remove()}}export{t as default};
|
|
30
26
|
//# sourceMappingURL=header.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.component.min.js","sources":["header.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"header\"\n});\nclass iamHeader extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/header.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${
|
|
1
|
+
{"version":3,"file":"header.component.min.js","sources":["header.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"header\"\n});\nclass iamHeader extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/header.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"header-banner\">\n <div class=\"container\" part=\"container\">\n <slot name=\"breadcrumb\"></slot>\n <div class=\"header-banner__inner\">\n <slot></slot>\n </div>\n </div>\n <picture>\n <!-- Actual image only loaded on desktops -->\n <source srcset=\"\" media=\"(min-width: 62em)\">\n <!-- Placeholder image -->\n <img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" alt=\"\" lazy=\"\" />\n </picture>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('loaded');\n const picture = this.shadowRoot.querySelector('picture');\n const source = this.shadowRoot.querySelector('picture source');\n if (this.hasAttribute('image'))\n source.setAttribute('srcset', this.getAttribute('image'));\n else\n picture.remove();\n }\n}\nexport default iamHeader;\n"],"names":["iamHeader","assetLocation","coreCSS","template","picture","source"],"mappings":";;;IAEA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,QACf,CAAC,EACD,MAAMA,UAAkB,WAAY,CAChC,aAAc,CACV,QACA,KAAK,aAAa,CAAE,KAAM,MAAQ,CAAA,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBAEzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA;AAAA;AAAA,MAET,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,MAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiBpE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/D,CACD,mBAAoB,CAChB,KAAK,UAAU,IAAI,QAAQ,EAC3B,MAAMC,EAAU,KAAK,WAAW,cAAc,SAAS,EACjDC,EAAS,KAAK,WAAW,cAAc,gBAAgB,EACzD,KAAK,aAAa,OAAO,EACzBA,EAAO,aAAa,SAAU,KAAK,aAAa,OAAO,CAAC,EAExDD,EAAQ,OAAM,CACrB,CACL"}
|
|
@@ -5,10 +5,13 @@ class iamPagination extends HTMLElement {
|
|
|
5
5
|
super();
|
|
6
6
|
this.attachShadow({ mode: 'open' });
|
|
7
7
|
const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';
|
|
8
|
+
const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;
|
|
8
9
|
const template = document.createElement('template');
|
|
9
10
|
template.innerHTML = `
|
|
10
11
|
<style>
|
|
11
|
-
@import "${
|
|
12
|
+
@import "${coreCSS}";
|
|
13
|
+
|
|
14
|
+
${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
|
|
12
15
|
</style>
|
|
13
16
|
<div class="pagination__wrapper d-none">
|
|
14
17
|
</div>
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* iamKey v3.7.4
|
|
3
|
+
* Copyright 2022-2023 iamproperty
|
|
4
|
+
*/const l=function(t,n){if(!t.getAttribute("data-pages"))return!1;t.getAttribute("data-page")||t.setAttribute("data-page",1);let e=t.getAttribute("data-page"),s=t.getAttribute("data-pages"),i=t.getAttribute("data-total"),r=t.getAttribute("data-show"),d=t.getAttribute("data-increment");if(s<=1)return n.innerHTML="",!1;let o="";for(let a=1;a<=s;a++)a==e?o+=`<li class="page-item active" aria-current="page"><span class="page-link">${a}</span></li>`:o+=`<li class="page-item"><a href="?page=${a}" class="page-link" data-page="${a}">${a}</a></li>`;return n.innerHTML=`<ul class="pagination mb-0 d-none d-sm-flex">
|
|
5
|
+
${e==1?'<li class="page-item disabled"><span class="page-link">Previous</span></li>':`<li class="page-item"><a href="?page=${parseInt(e)-1}" class="page-link" data-page="${parseInt(e)-1}">Previous</a></li>`}
|
|
6
|
+
${o}
|
|
7
|
+
${e==s?'<li class="page-item disabled"><span class="page-link">Next</span></li>':`<li class="page-item"><a href="?page=${parseInt(e)+1}" class="page-link" data-page="${parseInt(e)+1}">Next</a></li>`}
|
|
8
|
+
</ul>`,n.innerHTML+=`<div class="d-sm-none text-center">
|
|
9
|
+
<span class="d-block pb-2">You've viewed ${r} of ${i} results</span>
|
|
10
|
+
<a href="?show=${parseInt(r)+parseInt(d)}" class="btn btn-primary w-100 m-0" data-show="${parseInt(r)+parseInt(d)}">Load more results</a>
|
|
11
|
+
</div>`,!0};class p extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const n=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${n}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
|
|
12
|
+
<style>
|
|
13
|
+
@import "${e}";
|
|
14
|
+
|
|
15
|
+
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
16
|
+
</style>
|
|
17
|
+
<div class="pagination__wrapper d-none">
|
|
18
|
+
</div>
|
|
19
|
+
`,this.shadowRoot.appendChild(s.content.cloneNode(!0));const i=new URLSearchParams(window.location.search);this.hasAttribute("data-total")||this.setAttribute("data-total",this.querySelectorAll("table tbody tr").length),this.hasAttribute("data-page")||this.setAttribute("data-page",i.has("page")?i.get("page"):1),this.hasAttribute("data-show")||this.setAttribute("data-show",i.has("show")?i.get("show"):15),this.hasAttribute("data-increment")||this.setAttribute("data-increment",15),this.setAttribute("data-pages",Math.ceil(this.getAttribute("data-total")/this.getAttribute("data-show"))),l(this,this.shadowRoot.querySelector(".pagination__wrapper"))}connectedCallback(){this.shadowRoot.querySelector(".pagination__wrapper").classList.remove("d-none")}}export{p as default};
|
|
20
|
+
//# sourceMappingURL=pagination.component.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pagination.component.min.js","sources":["../../modules/pagination.js","pagination.component.js"],"sourcesContent":["const createPaginationButttons = function (controller, pagination) {\n if (!controller.getAttribute('data-pages'))\n return false;\n if (!controller.getAttribute('data-page'))\n controller.setAttribute('data-page', 1);\n let currentPage = controller.getAttribute('data-page');\n let numberPages = controller.getAttribute('data-pages');\n let numberRows = controller.getAttribute('data-total');\n let showRows = controller.getAttribute('data-show');\n let addRows = controller.getAttribute('data-increment');\n if (numberPages <= 1) {\n pagination.innerHTML = '';\n return false;\n }\n let strButtons = '';\n for (let i = 1; i <= numberPages; i++) {\n if (i == currentPage)\n strButtons += `<li class=\"page-item active\" aria-current=\"page\"><span class=\"page-link\">${i}</span></li>`;\n else\n strButtons += `<li class=\"page-item\"><a href=\"?page=${i}\" class=\"page-link\" data-page=\"${i}\">${i}</a></li>`;\n }\n pagination.innerHTML = `<ul class=\"pagination mb-0 d-none d-sm-flex\">\n ${currentPage == 1 ? `<li class=\"page-item disabled\"><span class=\"page-link\">Previous</span></li>` : `<li class=\"page-item\"><a href=\"?page=${parseInt(currentPage) - 1}\" class=\"page-link\" data-page=\"${parseInt(currentPage) - 1}\">Previous</a></li>`}\n ${strButtons}\n ${currentPage == numberPages ? `<li class=\"page-item disabled\"><span class=\"page-link\">Next</span></li>` : `<li class=\"page-item\"><a href=\"?page=${parseInt(currentPage) + 1}\" class=\"page-link\" data-page=\"${parseInt(currentPage) + 1}\">Next</a></li>`}\n </ul>`;\n pagination.innerHTML += `<div class=\"d-sm-none text-center\">\n <span class=\"d-block pb-2\">You've viewed ${showRows} of ${numberRows} results</span>\n <a href=\"?show=${parseInt(showRows) + parseInt(addRows)}\" class=\"btn btn-primary w-100 m-0\" data-show=\"${parseInt(showRows) + parseInt(addRows)}\">Load more results</a>\n </div>`;\n return true;\n};\nexport default createPaginationButttons;\n","// @ts-nocheck\nimport createPaginationButttons from \"../../modules/pagination.js\";\nclass iamPagination extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n \n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"pagination__wrapper d-none\">\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n // Set default attributes\n const params = new URLSearchParams(window.location.search);\n if (!this.hasAttribute('data-total'))\n this.setAttribute('data-total', this.querySelectorAll('table tbody tr').length);\n if (!this.hasAttribute('data-page'))\n this.setAttribute('data-page', (params.has('page') ? params.get('page') : 1));\n if (!this.hasAttribute('data-show'))\n this.setAttribute('data-show', (params.has('show') ? params.get('show') : 15));\n if (!this.hasAttribute('data-increment'))\n this.setAttribute('data-increment', 15);\n this.setAttribute('data-pages', Math.ceil(this.getAttribute('data-total') / this.getAttribute('data-show')));\n createPaginationButttons(this, this.shadowRoot.querySelector('.pagination__wrapper'));\n }\n connectedCallback() {\n this.shadowRoot.querySelector('.pagination__wrapper').classList.remove('d-none');\n }\n}\nexport default iamPagination;\n"],"names":["createPaginationButttons","controller","pagination","currentPage","numberPages","numberRows","showRows","addRows","strButtons","i","iamPagination","assetLocation","coreCSS","template","params"],"mappings":";;;IAAA,MAAMA,EAA2B,SAAUC,EAAYC,EAAY,CAC/D,GAAI,CAACD,EAAW,aAAa,YAAY,EACrC,MAAO,GACNA,EAAW,aAAa,WAAW,GACpCA,EAAW,aAAa,YAAa,CAAC,EAC1C,IAAIE,EAAcF,EAAW,aAAa,WAAW,EACjDG,EAAcH,EAAW,aAAa,YAAY,EAClDI,EAAaJ,EAAW,aAAa,YAAY,EACjDK,EAAWL,EAAW,aAAa,WAAW,EAC9CM,EAAUN,EAAW,aAAa,gBAAgB,EACtD,GAAIG,GAAe,EACf,OAAAF,EAAW,UAAY,GAChB,GAEX,IAAIM,EAAa,GACjB,QAASC,EAAI,EAAGA,GAAKL,EAAaK,IAC1BA,GAAKN,EACLK,GAAc,4EAA4EC,gBAE1FD,GAAc,wCAAwCC,mCAAmCA,MAAMA,aAEvG,OAAAP,EAAW,UAAY;AAAA,MACrBC,GAAe,EAAI,8EAAgF,wCAAwC,SAASA,CAAW,EAAI,mCAAmC,SAASA,CAAW,EAAI;AAAA,MAC9NK;AAAA,MACAL,GAAeC,EAAc,0EAA4E,wCAAwC,SAASD,CAAW,EAAI,mCAAmC,SAASA,CAAW,EAAI;AAAA,SAEtOD,EAAW,WAAa;AAAA,6CACiBI,QAAeD;AAAA,mBACzC,SAASC,CAAQ,EAAI,SAASC,CAAO,mDAAmD,SAASD,CAAQ,EAAI,SAASC,CAAO;AAAA,UAErI,EACX,EC7BA,MAAMG,UAAsB,WAAY,CACpC,aAAc,CACV,QACA,KAAK,aAAa,CAAE,KAAM,MAAQ,CAAA,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBACzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA;AAAA,MAET,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,MAAQ;AAAA;AAAA;AAAA;AAAA,MAKpE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,EAE5D,MAAMC,EAAS,IAAI,gBAAgB,OAAO,SAAS,MAAM,EACpD,KAAK,aAAa,YAAY,GAC/B,KAAK,aAAa,aAAc,KAAK,iBAAiB,gBAAgB,EAAE,MAAM,EAC7E,KAAK,aAAa,WAAW,GAC9B,KAAK,aAAa,YAAcA,EAAO,IAAI,MAAM,EAAIA,EAAO,IAAI,MAAM,EAAI,CAAC,EAC1E,KAAK,aAAa,WAAW,GAC9B,KAAK,aAAa,YAAcA,EAAO,IAAI,MAAM,EAAIA,EAAO,IAAI,MAAM,EAAI,EAAE,EAC3E,KAAK,aAAa,gBAAgB,GACnC,KAAK,aAAa,iBAAkB,EAAE,EAC1C,KAAK,aAAa,aAAc,KAAK,KAAK,KAAK,aAAa,YAAY,EAAI,KAAK,aAAa,WAAW,CAAC,CAAC,EAC3Gd,EAAyB,KAAM,KAAK,WAAW,cAAc,sBAAsB,CAAC,CACvF,CACD,mBAAoB,CAChB,KAAK,WAAW,cAAc,sBAAsB,EAAE,UAAU,OAAO,QAAQ,CAClF,CACL"}
|
|
@@ -6,14 +6,16 @@ class iamTable extends HTMLElement {
|
|
|
6
6
|
super();
|
|
7
7
|
this.attachShadow({ mode: 'open' });
|
|
8
8
|
const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';
|
|
9
|
+
const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;
|
|
9
10
|
const isCTA = this.classList.contains('table--cta');
|
|
10
11
|
const isExportable = this.classList.contains('table--export');
|
|
11
12
|
let classList = this.classList.toString();
|
|
12
13
|
classList = classList.replace('table--cta', '');
|
|
14
|
+
classList = classList.replace('table--loading', '');
|
|
13
15
|
const template = document.createElement('template');
|
|
14
16
|
template.innerHTML = `
|
|
15
17
|
<style>
|
|
16
|
-
@import "${
|
|
18
|
+
@import "${coreCSS}";
|
|
17
19
|
|
|
18
20
|
:host(.mh-sm){
|
|
19
21
|
max-height: none!important;
|
|
@@ -24,6 +26,8 @@ class iamTable extends HTMLElement {
|
|
|
24
26
|
:host(.mh-lg){
|
|
25
27
|
max-height: none!important;
|
|
26
28
|
}
|
|
29
|
+
|
|
30
|
+
${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
|
|
27
31
|
</style>
|
|
28
32
|
${isCTA ? '<div class="table--cta">' : ''}
|
|
29
33
|
<div class="table__wrapper ${classList}">
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v3.7.
|
|
2
|
+
* iamKey v3.7.4
|
|
3
3
|
* Copyright 2022-2023 iamproperty
|
|
4
|
-
*/const
|
|
4
|
+
*/const B=function(a){return typeof a!="string"?!1:!isNaN(a)&&!isNaN(parseFloat(a))},F=(a,e)=>String(a).padStart(e,"0"),U=a=>a.charAt(0).toUpperCase()+a.slice(1),C=function(a,e){if(!a.getAttribute("data-pages"))return!1;a.getAttribute("data-page")||a.setAttribute("data-page",1);let n=a.getAttribute("data-page"),r=a.getAttribute("data-pages"),o=a.getAttribute("data-total"),i=a.getAttribute("data-show"),s=a.getAttribute("data-increment");if(r<=1)return e.innerHTML="",!1;let l="";for(let c=1;c<=r;c++)c==n?l+=`<li class="page-item active" aria-current="page"><span class="page-link">${c}</span></li>`:l+=`<li class="page-item"><a href="?page=${c}" class="page-link" data-page="${c}">${c}</a></li>`;return e.innerHTML=`<ul class="pagination mb-0 d-none d-sm-flex">
|
|
5
5
|
${n==1?'<li class="page-item disabled"><span class="page-link">Previous</span></li>':`<li class="page-item"><a href="?page=${parseInt(n)-1}" class="page-link" data-page="${parseInt(n)-1}">Previous</a></li>`}
|
|
6
|
-
${
|
|
6
|
+
${l}
|
|
7
7
|
${n==r?'<li class="page-item disabled"><span class="page-link">Next</span></li>':`<li class="page-item"><a href="?page=${parseInt(n)+1}" class="page-link" data-page="${parseInt(n)+1}">Next</a></li>`}
|
|
8
8
|
</ul>`,e.innerHTML+=`<div class="d-sm-none text-center">
|
|
9
|
-
<span class="d-block pb-2">You've viewed ${
|
|
10
|
-
<a href="?show=${parseInt(
|
|
11
|
-
</div>`,!0};var z=function(a,e,n,r){function i(d){return d instanceof n?d:new n(function(s){s(d)})}return new(n||(n=Promise))(function(d,s){function o(h){try{t(r.next(h))}catch(c){s(c)}}function u(h){try{t(r.throw(h))}catch(c){s(c)}}function t(h){h.done?d(h.value):i(h.value).then(o,u)}t((r=r.apply(a,e||[])).next())})};const _=a=>{const e=Array.from(a.querySelectorAll("thead th"));Array.from(a.querySelectorAll("tbody tr")).forEach((r,i)=>{const d=Array.from(r.querySelectorAll("th, td")),s=["0","low","medium","high","unknown","n/a","pending","verified","incomplete","completed","requires approval"];d.forEach((o,u)=>{const t=e[u];if(typeof t<"u"){let h=document.createElement("div");h.innerHTML=t.innerHTML;let c=h.textContent||h.innerText||"";o.setAttribute("data-label",c),t.hasAttribute("data-td-class")&&o.setAttribute("class",t.getAttribute("data-td-class")),t.hasAttribute("data-format")&&(o.setAttribute("data-format",t.getAttribute("data-format")),o.innerHTML=M(t.getAttribute("data-format"),o.textContent.trim())),s.includes(o.textContent.trim().toLowerCase())&&o.setAttribute("data-content",o.textContent.trim().toLowerCase())}})})},J=a=>{let e=0;return Array.from(a.querySelectorAll("tr")).forEach((n,r)=>{let i=window.getComputedStyle(document.querySelector("html")),d=n.querySelector(":scope > *:last-child > *:first-child");if(d){let o=d.offsetWidth/parseFloat(i.fontSize);o+=1.5,e=e>o?e:o}let s=n.offsetHeight/parseFloat(i.fontSize);n.style.setProperty("--row-height",`${s}rem`)}),e},Q=a=>{if(a.closest(".table--fullwidth")||a.querySelectorAll("thead tr th").length<4)return!1;Array.from(a.querySelectorAll("tbody tr")).forEach((e,n)=>{let r=e.querySelector(":scope > :is(td,th):first-child"),i=r.textContent;if(i!="")r.innerHTML=`<span class="td__content">${i}</span><button type="button" class="d-none">${i}</button>`;else{let d=e.querySelector(":scope > :is(td,th):nth-child(2)"),s=d.textContent;d.innerHTML=`<span class="td__content">${s}</span><button type="button" class="d-none">${s}</button>`}})},X=a=>{a.addEventListener("click",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest("tr > :is(td,th):first-child button")){let n=e.target.closest("tr > :is(td,th):first-child button"),r=n.parentNode.closest("tr");r.getAttribute("data-view")=="full"?r.setAttribute("data-view","default"):r.setAttribute("data-view","full"),n.blur()}})},R=(a,e)=>{let n=e.querySelector("[data-search]");if(!n)return!1;const r=n.getAttribute("id"),i=n.getAttribute("data-search").split(",");let d=n.parentNode,s={};i.forEach((o,u)=>{Array.from(a.querySelectorAll('td[data-label="'+o.trim()+'"]')).forEach((t,h)=>{t.querySelector(".td__content")?s[t.querySelector(".td__content").textContent]=t.querySelector(".td__content").textContent:s[t.textContent]=t.textContent})}),n.setAttribute("list",`${r}_list`),n.setAttribute("autocomplete","off"),d.querySelector("datalist")||(d.innerHTML+=`<datalist id="${r}_list"></datalist>`),d.querySelector("datalist").innerHTML=`${Object.keys(s).map(o=>`<option value="${o}"></option>`).join("")}`},Y=(a,e,n,r,i)=>{var d;let s=function(t=!1){if(e.hasAttribute("data-ajax")){if(!t){let h=e.querySelector("[data-pagination]");h.value=1,r.setAttribute("data-page",1)}I(a,e,n,r)}else e.hasAttribute("data-submit")?e.submit():(N(a,e,r),C(r,n),H(a,e))};e.addEventListener("keyup",t=>{clearTimeout(d),t&&t.target instanceof HTMLElement&&t.target.closest("[data-search]")&&(d=setTimeout(function(){s()},500))}),e.addEventListener("change",t=>{clearTimeout(d),t&&t.target instanceof HTMLElement&&t.target.closest("[data-sort]")&&(e.hasAttribute("data-submit")||j(a,e,i),s()),t&&t.target instanceof HTMLElement&&t.target.closest("[data-search]")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-filter]")&&t.target.closest("form .dialog__wrapper > dialog")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-filter]")&&!t.target.closest("form dialog")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-show]")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-mimic]")&&s()}),e.addEventListener("click",t=>{clearTimeout(d),t&&t.target instanceof HTMLElement&&t.target.closest('dialog button:not([type="button"])')&&t.target.closest('dialog button:not([type="button"])').closest("dialog").close(),t&&t.target instanceof HTMLElement&&t.target.closest(".dialog__close")&&(t.preventDefault(),t.stopPropagation()),t&&t.target instanceof HTMLElement&&t.target.closest("[data-clear]")&&(e.reset(),e.hasAttribute("data-submit")||j(a,e,i),s())}),e.addEventListener("submit",t=>{clearTimeout(d),e.hasAttribute("data-submit")||t.preventDefault(),s()}),e.addEventListener("force",t=>{s()}),e.addEventListener("paginate",t=>{s(!0)});let o=[],u=[];Array.from(e.querySelectorAll("[data-mimic]")).forEach((t,h)=>{let c=t.getAttribute("data-mimic");Array.from(document.querySelectorAll(`[name="${c}"]`)).forEach((f,b)=>{let l=f.closest("form");o.includes(l)||o.push(l),u.includes(c)||u.push(c)})}),o.forEach((t,h)=>{const c=function(){let f=[],b=new FormData(t);for(const[l,y]of b)document.querySelector(`[data-mimic="${l}"]`)&&!f.includes(l)?(f.push(l),document.querySelector(`[data-mimic="${l}"]`).value=y):document.querySelector(`[data-mimic="${l}"]`)&&(document.querySelector(`[data-mimic="${l}"]`).value+=","+y);for(const l of f){const y=new Event("force");e.dispatchEvent(y)}for(const l of u)if(!b.has(l)&&t.querySelector(`[name="${l}"]`)){document.querySelector(`[data-mimic="${l}"]`).value="";const y=new Event("force");e.dispatchEvent(y)}};t.addEventListener("force",f=>{c()}),t.addEventListener("change",f=>{c()})})},j=(a,e,n)=>{if(e.getAttribute("data-ajax"))return!1;let r=a.querySelector("tbody"),i=e.querySelector("[data-sort]"),d=i.querySelector(`option:nth-child(${i.selectedIndex+1})`),s=d.getAttribute("data-sort"),o=d.getAttribute("data-order"),u=d.getAttribute("data-format");if(!s)return r.innerHTML=n.innerHTML,_(a),!1;let t=[];["asc","desc","descending"].includes(o)||(t=o.split(","));let h=[];Array.from(r.querySelectorAll("tr")).forEach((f,b)=>{let l=f.querySelector('td[data-label="'+s+'"], th[data-label="'+s+'"]').textContent.trim();t.length&&t.includes(l)&&(l=t.indexOf(l)),O(l)&&(l=B(l,10)),u&&u=="date"&&(l=new Date(l));const y={index:l,row:f};h.push(y)}),h.sort((f,b)=>f.index>b.index?1:-1),(o=="descending"||o=="desc")&&(h=h.reverse());let c="";h.forEach((f,b)=>{c+=f.row.outerHTML}),r.innerHTML=c},N=(a,e,n)=>{a.classList.remove("table--filtered");let r=[],i=[],d=0,s=e.querySelector("[data-pagination]")?parseInt(e.querySelector("[data-pagination]").value):1,o=e.querySelector("[data-show]")?parseInt(e.querySelector("[data-show]").value):15;if(Array.from(a.querySelectorAll("tbody tr")).forEach((t,h)=>{t.classList.remove("filtered"),t.classList.remove("filtered--matched"),t.classList.remove("filtered--show"),t.removeAttribute("data-filtered-by")}),Array.from(e.querySelectorAll("[data-filter]")).forEach((t,h)=>{if(!(t.type=="radio"&&!t.checked)&&!(t.type=="checkbox"&&!t.checked)){if(t.getAttribute("data-filter")=="multi")for(const[c,f]of Object.entries(JSON.parse(t.value)))r[t.getAttribute("data-filter")].push(f);else if(t&&t.value){let c=t.getAttribute("data-filter");r[c]||(r[c]=new Array),r[c].push(t.value)}}}),e.querySelector("[data-search]")){let t=e.querySelector("[data-search]");e.querySelector("[data-search]").getAttribute("data-search").split(",").forEach((c,f)=>{i.push({column:`${c.trim()}`,value:`${t.value}`})})}Array.from(e.querySelectorAll("[data-filter-count]")).forEach((t,h)=>{t.innerHTML=""}),r.length&&Array.from(e.querySelectorAll("[data-filter-count]")).forEach((t,h)=>{t.innerHTML+=`(${r.length})`}),a.classList.add("table--filtered");for(const[t,h]of Object.entries(r))Array.from(a.querySelectorAll("tbody tr:not(.filtered)")).forEach((c,f)=>{let b=!1;h.forEach((l,y)=>{let L=c.querySelector(`[data-label="${t}"]`);if(l&&l=="$today")l=M("date",new Date);else if(l&&l=="$yesterday"){let m=new Date;m.setDate(m.getDate()-1),l=M("date",m)}else if(l&&(l=="$thisWeek"||l=="$lastWeek")){let m=new Date,g=new Date(m.setDate(m.getDate()-(m.getDay()-1))),A=new Date(m.setDate(m.getDate()-m.getDay()+7)),p=new Date(L.textContent.toLowerCase());if(m.setHours(0,0,0,0),g.setHours(0,0,0,0),A.setHours(0,0,0,0),p.setHours(0,0,0,0),l=="$thisWeek")b=p>=g&&p<=A;else{let S=new Date(g.setDate(g.getDate()-7)),x=new Date(A.setDate(A.getDate()-7));S.setHours(0,0,0,0),x.setHours(0,0,0,0),b=p>=S&&p<=x}}else if(l&&l=="$thisMonth"){let m=new Date,g=m.getFullYear(),A=m.getMonth();var q=new Date(g,A,1),E=new Date(g,A+1,0);let p=new Date(L.textContent.toLowerCase());q.setHours(0,0,0,0),E.setHours(0,0,0,0),p.setHours(0,0,0,0),b=p>=q&&p<=E}else if(l&&l=="$lastMonth"){let m=new Date,g=m.getFullYear(),A=m.getMonth();var w=new Date(g,A-1,1),$=new Date(g,A,0);let p=new Date(L.textContent.toLowerCase());w.setHours(0,0,0,0),$.setHours(0,0,0,0),p.setHours(0,0,0,0),b=p>=w&&p<=$}L&&L.textContent.toLowerCase().includes(l.toLowerCase())&&(b=!0)}),b||(c.classList.add("filtered"),c.setAttribute("data-filtered-by",t))});Array.from(a.querySelectorAll("tbody tr:not(.filtered)")).forEach((t,h)=>{let c=!(i.length>0&&i[0].value.length>=3);i.forEach((f,b)=>{let l=t.querySelector(`[data-label="${f.column}"]`);l&&f.value.length>=3&&l.textContent.toLowerCase().includes(f.value.toLowerCase())&&(c=!0)}),c||t.classList.add("filtered")}),Array.from(a.querySelectorAll("tbody tr:not(.filtered")).forEach((t,h)=>{d++,t.classList.add("filtered--matched"),Math.ceil(d/o)==parseInt(s)&&t.classList.add("filtered--show")}),n&&(n.setAttribute("data-page",s),n.setAttribute("data-pages",Math.ceil(d/o)),n.setAttribute("data-total",d),n.setAttribute("data-show",o))},H=(a,e,n)=>{Array.from(e.querySelectorAll("[data-query]")).forEach((i,d)=>{let s=i.getAttribute("data-query"),o;if(s=="total")n.hasAttribute("data-total")?o=n.getAttribute("data-total"):o=(a.classList.contains("table--filtered"),a.querySelectorAll("tbody tr").length);else if(!s.includes(" == ")&&s.includes(" & ")){let u=s.split(" & "),t="";u.forEach(h=>{t+=`:not([data-filtered-by="${h}"])`}),o=Array.from(a.querySelectorAll(`tbody tr${t}`)).length}else if(!s.includes(" == "))o=Array.from(a.querySelectorAll(`tbody tr:not([data-filtered-by="${s}"])`)).length;else if(s.includes(" && ")){let u=s.split(" && ");o=Array.from(a.querySelectorAll("tbody tr:not(.filtered)")).filter(function(t){let h=!0;for(const[c,f]of Object.entries(u)){let b=f.split(" == ");(!t.querySelector(`td[data-label="${b[0]}"]`)||t.querySelector(`td[data-label="${b[0]}"]`).textContent!=`${b[1]}`)&&(h=!1)}return h}).length}else{let u=s.split(" == ");o=Array.from(a.querySelectorAll(`tbody tr.filtered--matched td[data-label="${u[0]}"], tbody tr[data-filtered-by="${u[0]}"] td[data-label="${u[0]}"]`)).filter(function(t){return t.textContent===u[1]}).length}i.hasAttribute("data-total")?i.setAttribute("data-total",o):i.innerHTML=o})},G=function(a,e,n,r){n.addEventListener("click",i=>{if(i&&i.target instanceof HTMLElement&&i.target.closest("[data-page]")){i.preventDefault();let d=e.querySelector("[data-pagination]"),s=i.target.closest("[data-page]").getAttribute("data-page");if(d.value=s,r.setAttribute("data-page",s),e.dispatchEvent(new Event("paginate")),a.hasAttribute("data-show-history")){const o=new URL(location);o.searchParams.set("page",s),history.pushState({type:"pagination",form:e.getAttribute("id"),page:s},"",o)}}if(i&&i.target instanceof HTMLElement&&i.target.closest("[data-show]")){i.preventDefault();let d=e.querySelector("[data-show]"),s=i.target.closest("[data-show]").getAttribute("data-show");d.value=s,r.setAttribute("data-show",s),e.dispatchEvent(new Event("submit"))}})},K=(a,e)=>{if(!a)return!1;a.addEventListener("click",n=>{Z(e)})},Z=function(a){for(var e=[],n=a.getElementsByTagName("tr"),r=0;r<n.length;r++){for(var i=n[r].querySelectorAll("td,th"),d=[],s=0;s<i.length;s++)d.push(`"${i[s].textContent}"`);e.push(d.join(","))}e=e.join(`
|
|
12
|
-
`);let
|
|
9
|
+
<span class="d-block pb-2">You've viewed ${i} of ${o} results</span>
|
|
10
|
+
<a href="?show=${parseInt(i)+parseInt(s)}" class="btn btn-primary w-100 m-0" data-show="${parseInt(i)+parseInt(s)}">Load more results</a>
|
|
11
|
+
</div>`,!0};var z=function(a,e,n,r){function o(i){return i instanceof n?i:new n(function(s){s(i)})}return new(n||(n=Promise))(function(i,s){function l(h){try{t(r.next(h))}catch(u){s(u)}}function c(h){try{t(r.throw(h))}catch(u){s(u)}}function t(h){h.done?i(h.value):o(h.value).then(l,c)}t((r=r.apply(a,e||[])).next())})};const _=a=>{const e=Array.from(a.querySelectorAll("thead th"));Array.from(a.querySelectorAll("tbody tr")).forEach((r,o)=>{const i=Array.from(r.querySelectorAll("th, td")),s=["0","low","medium","high","unknown","n/a","pending","verified","incomplete","completed","requires approval"];i.forEach((l,c)=>{const t=e[c];if(typeof t<"u"){let h=document.createElement("div");h.innerHTML=t.innerHTML;let u=h.textContent||h.innerText||"";l.setAttribute("data-label",u),t.hasAttribute("data-td-class")&&l.setAttribute("class",t.getAttribute("data-td-class")),t.hasAttribute("data-format")&&(l.setAttribute("data-format",t.getAttribute("data-format")),l.innerHTML=M(t.getAttribute("data-format"),l.textContent.trim())),s.includes(l.textContent.trim().toLowerCase())&&l.setAttribute("data-content",l.textContent.trim().toLowerCase())}})})},Y=a=>{let e=0;return Array.from(a.querySelectorAll("tbody tr")).forEach((n,r)=>{let o=window.getComputedStyle(document.querySelector("html")),i=n.querySelector(":scope > *:last-child > *:first-child");if(i){i.classList.add("text-nowrap");let s=i.offsetWidth/parseFloat(o.fontSize);s+=1.7,e=e>s?e:s}}),e},J=a=>{if(a.closest(".table--fullwidth")||a.querySelectorAll("thead tr th").length<4)return!1;Array.from(a.querySelectorAll("tbody tr")).forEach((e,n)=>{let r=e.querySelector(":scope > :is(td,th):first-child"),o=r.textContent;if(o!="")r.innerHTML=`<span class="td__content">${o}</span><button type="button" class="d-none">${o}</button>`;else{let i=e.querySelector(":scope > :is(td,th):nth-child(2)"),s=i.textContent;i.innerHTML=`<span class="td__content">${s}</span><button type="button" class="d-none">${s}</button>`}})},Q=a=>{a.addEventListener("click",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest("tr > :is(td,th):first-child button")){let n=e.target.closest("tr > :is(td,th):first-child button"),r=n.parentNode.closest("tr");r.getAttribute("data-view")=="full"?r.setAttribute("data-view","default"):r.setAttribute("data-view","full"),n.blur()}})},R=(a,e)=>{let n=e.querySelector("[data-search]");if(!n)return!1;const r=n.getAttribute("id"),o=n.getAttribute("data-search").split(",");let i=n.parentNode,s={};o.forEach((l,c)=>{Array.from(a.querySelectorAll('td[data-label="'+l.trim()+'"]')).forEach((t,h)=>{t.querySelector(".td__content")?s[t.querySelector(".td__content").textContent]=t.querySelector(".td__content").textContent:s[t.textContent]=t.textContent})}),n.setAttribute("list",`${r}_list`),n.setAttribute("autocomplete","off"),i.querySelector("datalist")||(i.innerHTML+=`<datalist id="${r}_list"></datalist>`),i.querySelector("datalist").innerHTML=`${Object.keys(s).map(l=>`<option value="${l}"></option>`).join("")}`},X=(a,e,n,r,o)=>{var i;let s=function(t=!1){if(e.hasAttribute("data-ajax")){if(!t){let h=e.querySelector("[data-pagination]");h.value=1,r.setAttribute("data-page",1)}I(a,e,n,r)}else e.hasAttribute("data-submit")?e.submit():(N(a,e,r),C(r,n),H(a,e))};e.addEventListener("keyup",t=>{clearTimeout(i),t&&t.target instanceof HTMLElement&&t.target.closest("[data-search]")&&(i=setTimeout(function(){s()},500))}),e.addEventListener("change",t=>{clearTimeout(i),t&&t.target instanceof HTMLElement&&t.target.closest("[data-sort]")&&(e.hasAttribute("data-submit")||j(a,e,o),s()),t&&t.target instanceof HTMLElement&&t.target.closest("[data-search]")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-filter]")&&t.target.closest("form .dialog__wrapper > dialog")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-filter]")&&!t.target.closest("form dialog")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-show]")&&s(),t&&t.target instanceof HTMLElement&&t.target.closest("[data-mimic]")&&s()}),e.addEventListener("click",t=>{clearTimeout(i),t&&t.target instanceof HTMLElement&&t.target.closest('dialog button:not([type="button"])')&&t.target.closest('dialog button:not([type="button"])').closest("dialog").close(),t&&t.target instanceof HTMLElement&&t.target.closest(".dialog__close")&&(t.preventDefault(),t.stopPropagation()),t&&t.target instanceof HTMLElement&&t.target.closest("[data-clear]")&&(e.reset(),e.hasAttribute("data-submit")||j(a,e,o),s())}),e.addEventListener("submit",t=>{clearTimeout(i),e.hasAttribute("data-submit")||t.preventDefault(),s()}),e.addEventListener("force",t=>{s()}),e.addEventListener("paginate",t=>{s(!0)});let l=[],c=[];Array.from(e.querySelectorAll("[data-mimic]")).forEach((t,h)=>{let u=t.getAttribute("data-mimic");Array.from(document.querySelectorAll(`[name="${u}"]`)).forEach((f,b)=>{let d=f.closest("form");l.includes(d)||l.push(d),c.includes(u)||c.push(u)})}),l.forEach((t,h)=>{const u=function(){let f=[],b=new FormData(t);for(const[d,y]of b)document.querySelector(`[data-mimic="${d}"]`)&&!f.includes(d)?(f.push(d),document.querySelector(`[data-mimic="${d}"]`).value=y):document.querySelector(`[data-mimic="${d}"]`)&&(document.querySelector(`[data-mimic="${d}"]`).value+=","+y);for(const d of f){const y=new Event("force");e.dispatchEvent(y)}for(const d of c)if(!b.has(d)&&t.querySelector(`[name="${d}"]`)){document.querySelector(`[data-mimic="${d}"]`).value="";const y=new Event("force");e.dispatchEvent(y)}};t.addEventListener("force",f=>{u()}),t.addEventListener("change",f=>{u()})})},j=(a,e,n)=>{if(e.getAttribute("data-ajax"))return!1;let r=a.querySelector("tbody"),o=e.querySelector("[data-sort]"),i=o.querySelector(`option:nth-child(${o.selectedIndex+1})`),s=i.getAttribute("data-sort"),l=i.getAttribute("data-order"),c=i.getAttribute("data-format");if(!s)return r.innerHTML=n.innerHTML,_(a),!1;let t=[];["asc","desc","descending"].includes(l)||(t=l.split(","));let h=[];Array.from(r.querySelectorAll("tr")).forEach((f,b)=>{let d=f.querySelector('td[data-label="'+s+'"], th[data-label="'+s+'"]').textContent.trim();t.length&&t.includes(d)&&(d=t.indexOf(d)),B(d)&&(d=F(d,10)),c&&c=="date"&&(d=new Date(d));const y={index:d,row:f};h.push(y)}),h.sort((f,b)=>f.index>b.index?1:-1),(l=="descending"||l=="desc")&&(h=h.reverse());let u="";h.forEach((f,b)=>{u+=f.row.outerHTML}),r.innerHTML=u},N=(a,e,n)=>{a.classList.remove("table--filtered");let r=[],o=[],i=0,s=e.querySelector("[data-pagination]")?parseInt(e.querySelector("[data-pagination]").value):1,l=e.querySelector("[data-show]")?parseInt(e.querySelector("[data-show]").value):15;if(Array.from(a.querySelectorAll("tbody tr")).forEach((t,h)=>{t.classList.remove("filtered"),t.classList.remove("filtered--matched"),t.classList.remove("filtered--show"),t.removeAttribute("data-filtered-by")}),Array.from(e.querySelectorAll("[data-filter]")).forEach((t,h)=>{if(!(t.type=="radio"&&!t.checked)&&!(t.type=="checkbox"&&!t.checked)){if(t.getAttribute("data-filter")=="multi")for(const[u,f]of Object.entries(JSON.parse(t.value)))r[t.getAttribute("data-filter")].push(f);else if(t&&t.value){let u=t.getAttribute("data-filter");r[u]||(r[u]=new Array),r[u].push(t.value)}}}),e.querySelector("[data-search]")){let t=e.querySelector("[data-search]");e.querySelector("[data-search]").getAttribute("data-search").split(",").forEach((u,f)=>{o.push({column:`${u.trim()}`,value:`${t.value}`})})}Array.from(e.querySelectorAll("[data-filter-count]")).forEach((t,h)=>{t.innerHTML=""}),r.length&&Array.from(e.querySelectorAll("[data-filter-count]")).forEach((t,h)=>{t.innerHTML+=`(${r.length})`}),a.classList.add("table--filtered");for(const[t,h]of Object.entries(r))Array.from(a.querySelectorAll("tbody tr:not(.filtered)")).forEach((u,f)=>{let b=!1;h.forEach((d,y)=>{let L=u.querySelector(`[data-label="${t}"]`);if(d&&d=="$today")d=M("date",new Date);else if(d&&d=="$yesterday"){let p=new Date;p.setDate(p.getDate()-1),d=M("date",p)}else if(d&&(d=="$thisWeek"||d=="$lastWeek")){let p=new Date,g=new Date(p.setDate(p.getDate()-(p.getDay()-1))),A=new Date(p.setDate(p.getDate()-p.getDay()+7)),m=new Date(L.textContent.toLowerCase());if(p.setHours(0,0,0,0),g.setHours(0,0,0,0),A.setHours(0,0,0,0),m.setHours(0,0,0,0),d=="$thisWeek")b=m>=g&&m<=A;else{let S=new Date(g.setDate(g.getDate()-7)),x=new Date(A.setDate(A.getDate()-7));S.setHours(0,0,0,0),x.setHours(0,0,0,0),b=m>=S&&m<=x}}else if(d&&d=="$thisMonth"){let p=new Date,g=p.getFullYear(),A=p.getMonth();var q=new Date(g,A,1),v=new Date(g,A+1,0);let m=new Date(L.textContent.toLowerCase());q.setHours(0,0,0,0),v.setHours(0,0,0,0),m.setHours(0,0,0,0),b=m>=q&&m<=v}else if(d&&d=="$lastMonth"){let p=new Date,g=p.getFullYear(),A=p.getMonth();var w=new Date(g,A-1,1),$=new Date(g,A,0);let m=new Date(L.textContent.toLowerCase());w.setHours(0,0,0,0),$.setHours(0,0,0,0),m.setHours(0,0,0,0),b=m>=w&&m<=$}L&&L.textContent.toLowerCase().includes(d.toLowerCase())&&(b=!0)}),b||(u.classList.add("filtered"),u.setAttribute("data-filtered-by",t))});Array.from(a.querySelectorAll("tbody tr:not(.filtered)")).forEach((t,h)=>{let u=!(o.length>0&&o[0].value.length>=3);o.forEach((f,b)=>{let d=t.querySelector(`[data-label="${f.column}"]`);d&&f.value.length>=3&&d.textContent.toLowerCase().includes(f.value.toLowerCase())&&(u=!0)}),u||t.classList.add("filtered")}),Array.from(a.querySelectorAll("tbody tr:not(.filtered")).forEach((t,h)=>{i++,t.classList.add("filtered--matched"),Math.ceil(i/l)==parseInt(s)&&t.classList.add("filtered--show")}),n&&(n.setAttribute("data-page",s),n.setAttribute("data-pages",Math.ceil(i/l)),n.setAttribute("data-total",i),n.setAttribute("data-show",l))},H=(a,e,n)=>{Array.from(e.querySelectorAll("[data-query]")).forEach((o,i)=>{let s=o.getAttribute("data-query"),l;if(s=="total")n.hasAttribute("data-total")?l=n.getAttribute("data-total"):l=(a.classList.contains("table--filtered"),a.querySelectorAll("tbody tr").length);else if(!s.includes(" == ")&&s.includes(" & ")){let c=s.split(" & "),t="";c.forEach(h=>{t+=`:not([data-filtered-by="${h}"])`}),l=Array.from(a.querySelectorAll(`tbody tr${t}`)).length}else if(!s.includes(" == "))l=Array.from(a.querySelectorAll(`tbody tr:not([data-filtered-by="${s}"])`)).length;else if(s.includes(" && ")){let c=s.split(" && ");l=Array.from(a.querySelectorAll("tbody tr:not(.filtered)")).filter(function(t){let h=!0;for(const[u,f]of Object.entries(c)){let b=f.split(" == ");(!t.querySelector(`td[data-label="${b[0]}"]`)||t.querySelector(`td[data-label="${b[0]}"]`).textContent!=`${b[1]}`)&&(h=!1)}return h}).length}else{let c=s.split(" == ");l=Array.from(a.querySelectorAll(`tbody tr.filtered--matched td[data-label="${c[0]}"], tbody tr[data-filtered-by="${c[0]}"] td[data-label="${c[0]}"]`)).filter(function(t){return t.textContent===c[1]}).length}o.hasAttribute("data-total")?o.setAttribute("data-total",l):o.innerHTML=l})},G=function(a,e,n,r){n.addEventListener("click",o=>{if(o&&o.target instanceof HTMLElement&&o.target.closest("[data-page]")){o.preventDefault();let i=e.querySelector("[data-pagination]"),s=o.target.closest("[data-page]").getAttribute("data-page");if(i.value=s,r.setAttribute("data-page",s),e.dispatchEvent(new Event("paginate")),a.hasAttribute("data-show-history")){const t=new URL(location);t.searchParams.set("page",s),history.pushState({type:"pagination",form:e.getAttribute("id"),page:s},"",t)}const l=-250,c=a.getBoundingClientRect().top+window.pageYOffset+l;window.scrollTo({top:c,behavior:"smooth"})}if(o&&o.target instanceof HTMLElement&&o.target.closest("[data-show]")){o.preventDefault();let i=e.querySelector("[data-show]"),s=o.target.closest("[data-show]").getAttribute("data-show");i.value=s,r.setAttribute("data-show",s),e.dispatchEvent(new Event("submit"))}})},K=(a,e)=>{if(!a)return!1;a.addEventListener("click",n=>{Z(e)})},Z=function(a){for(var e=[],n=a.getElementsByTagName("tr"),r=0;r<n.length;r++){for(var o=n[r].querySelectorAll("td,th"),i=[],s=0;s<o.length;s++)i.push(`"${o[s].textContent}"`);e.push(i.join(","))}e=e.join(`
|
|
12
|
+
`);let l=new Blob([e],{type:"text/csv"});var c=document.createElement("a");c.download="export.csv";var t=window.URL.createObjectURL(l);c.href=t,c.style.display="none",document.body.appendChild(c),c.click(),document.body.removeChild(c)},P=function(a,e,n,r){if(_(a),J(a),H(a,e,r),r&&r.classList.contains("table--cta")){let o=function(){Array.from(a.querySelectorAll("tr")).forEach((i,s)=>{let l=i.offsetHeight;i.style.setProperty("--row-height",`${l}px`)})};if(!r.hasAttribute("data-cta-width")){const i=Y(a);r.style.setProperty("--cta-width",`${i}rem`),r.setAttribute("data-cta-width",`${i}rem`)}new ResizeObserver(o).observe(a)}},I=function(a,e,n,r){return z(this,void 0,void 0,function*(){const o=(u,f,b)=>f.split(/[\.\[\]\'\"]/).filter(d=>d).reduce((d,y)=>d?d[y]:b,u);let i=new FormData(e),s=new URLSearchParams(i).toString(),l=a.querySelectorAll("thead tr th"),c=a.querySelector("tbody"),t=e.getAttribute("data-ajax");r.classList.add("table--loading"),window.controller||(window.controller=[]),window.controller[t]&&window.controller[t].abort(),window.controller[t]=new AbortController;const{signal:h}=controller[t];try{yield fetch(t+"?"+s,{signal:h,method:"get",credentials:"same-origin",headers:new Headers({"Content-Type":"application/json",Accept:"application/json","X-Requested-With":"XMLHttpRequest"})}).then(u=>u.json()).then(u=>{let f=e.hasAttribute("data-schema")?e.getAttribute("data-schema"):"data",b=e.hasAttribute("data-schema-total")?e.getAttribute("data-schema-total"):"meta.total",d=e.hasAttribute("data-schema-page")?e.getAttribute("data-schema-page"):"meta.current_page",y=o(u,b,1),L=o(u,d,1),q=o(u,f),v=r.hasAttribute("data-empty-msg")?r.getAttribute("data-empty-msg"):"No results found";if(q?(c.innerHTML="",q.forEach((w,$)=>{var p=document.createElement("tr");l.forEach((g,A)=>{let m="";var S=document.createElement("td");if(S.setAttribute("data-label",g.innerText),g.getAttribute("data-output")){var x=g.getAttribute("data-output");m=x.replace(new RegExp(/{(.*?)}/,"gm"),function(D){return o(w,D.replace("{","").replace("}",""))})}if(g.hasAttribute("data-output-array")){var x=g.getAttribute("data-output");let W=o(w,x.replace("{","").replace("}",""));m="",W.forEach((k,et)=>{let O=g.getAttribute("data-output-array"),E="";if(g.hasAttribute("data-output-array-property")&&g.hasAttribute("data-output-array-transform")){const T=o(k,g.getAttribute("data-output-array-property")),V=JSON.parse(g.getAttribute("data-output-array-transform"))[T];E=O.replace(`{${g.getAttribute("data-output-array-property")}}`,V)}E=E.replace(new RegExp(/{(.*?)}/,"gm"),function(T){return o(k,T.replace("{","").replace("}",""))}),m+=E})}g.hasAttribute("data-transform")&&(m=JSON.parse(g.getAttribute("data-transform"))[m],!m&&g.hasAttribute("data-default")&&(m=g.getAttribute("data-default"))),S.innerHTML=m,p.appendChild(S)}),c.appendChild(p)}),R(a,e),r.setAttribute("data-total",parseInt(y)),r.setAttribute("data-page",parseInt(L)),r.setAttribute("data-pages",Math.ceil(r.getAttribute("data-total")/r.getAttribute("data-show"))),P(a,e,n,r),C(r,n),parseInt(y)==0&&(c.innerHTML=`<tr><td colspan="100%"><span>${v}</span></td></tr>`),r.classList.remove("table--loading"),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Ajax table loaded",url:t,formData:s})):c.innerHTML='<tr><td colspan="100%"><span>Error loading table</span></td></tr>',e.hasAttribute("data-ajax-post")){const w=new XMLHttpRequest;w.open("GET",`${window.location.href}?ajax=true&${s}`),w.send()}})}catch(u){console.log(u)}})},M=(a,e)=>{switch(a){case"datetime":return new Date(e).toLocaleDateString("en-gb",{weekday:"short",year:"2-digit",month:"long",day:"numeric"})+" "+new Date(e).toLocaleTimeString("en-gb",{hour:"2-digit",minute:"2-digit"});case"date":return new Date(e).toLocaleDateString("en-gb",{year:"2-digit",month:"long",day:"numeric"});case"capitalise":return e=U(e)}};class tt extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",n=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,r=this.classList.contains("table--cta"),o=this.classList.contains("table--export");let i=this.classList.toString();i=i.replace("table--cta",""),i=i.replace("table--loading","");const s=document.createElement("template");s.innerHTML=`
|
|
13
13
|
<style>
|
|
14
|
-
@import "${
|
|
14
|
+
@import "${n}";
|
|
15
15
|
|
|
16
16
|
:host(.mh-sm){
|
|
17
17
|
max-height: none!important;
|
|
@@ -22,13 +22,15 @@
|
|
|
22
22
|
:host(.mh-lg){
|
|
23
23
|
max-height: none!important;
|
|
24
24
|
}
|
|
25
|
+
|
|
26
|
+
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
25
27
|
</style>
|
|
26
|
-
${
|
|
28
|
+
${r?'<div class="table--cta">':""}
|
|
27
29
|
<div class="table__wrapper ${i}">
|
|
28
30
|
<slot></slot>
|
|
29
31
|
</div>
|
|
30
|
-
${
|
|
31
|
-
${
|
|
32
|
+
${r?"</div>":""}
|
|
33
|
+
${o?'<button class="link" type="button" data-export>Export table as CSV</button>':""}
|
|
32
34
|
<div class="table__pagination"></div>
|
|
33
|
-
`,this.shadowRoot.appendChild(
|
|
35
|
+
`,this.shadowRoot.appendChild(s.content.cloneNode(!0));const l=new URLSearchParams(window.location.search);this.hasAttribute("data-total")||this.setAttribute("data-total",this.querySelectorAll("table tbody tr").length),this.hasAttribute("data-page")||this.setAttribute("data-page",l.has("page")?l.get("page"):1),this.hasAttribute("data-show")||this.setAttribute("data-show",15),this.hasAttribute("data-increment")||this.setAttribute("data-increment",15),this.setAttribute("data-pages",Math.ceil(this.getAttribute("data-total")/this.getAttribute("data-show")))}connectedCallback(){this.table=this.querySelector("table"),this.savedTableBody=this.table.querySelector("tbody").cloneNode(!0),this.pagination=this.shadowRoot.querySelector(".table__pagination"),this.form=document.createElement("form"),this.hasAttribute("data-filterby")?this.form=document.querySelector(`#${this.getAttribute("data-filterby")}`):this.table.parentNode.insertBefore(this.form,this.table.nextSibling),this.form.hasAttribute("data-ajax")&&this.table.classList.add("table--ajax"),R(this.table,this.form),this.form.querySelector("[data-page]")||(this.form.innerHTML+=`<input name="page" type="hidden" value="${this.getAttribute("data-page")}" data-pagination="true" />`),this.form.querySelector("[data-show]")||(this.form.innerHTML+=`<input name="show" type="hidden" value="${this.getAttribute("data-show")}" data-show="true" />`),Q(this.table),X(this.table,this.form,this.pagination,this,this.savedTableBody),G(this.table,this.form,this.pagination,this),K(this.shadowRoot.querySelector("[data-export]"),this.table),this.form.getAttribute("data-ajax")?I(this.table,this.form,this.pagination,this):(P(this.table,this.form,this.pagination,this),N(this.table,this.form,this),C(this,this.pagination),H(this.table,this.form)),this.shadowRoot.querySelector(".table__wrapper").addEventListener("scroll",e=>{this.table.querySelector("dialog[open]")&&(this.table.querySelector("dialog[open]").close(),this.table.querySelector(".dialog__wrapper > button.active").classList.remove("active"))})}static get observedAttributes(){return["data-total","data-pages","data-page","data-show"]}attributeChangedCallback(e,n,r){}}export{tt as default};
|
|
34
36
|
//# sourceMappingURL=table.component.min.js.map
|