@iamproperty/components 6.0.0 → 6.1.0--beta

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.
Files changed (207) hide show
  1. package/assets/bootstrap/README.md +8 -7
  2. package/assets/bootstrap/js/index.esm.js +19 -0
  3. package/assets/bootstrap/js/index.umd.js +34 -0
  4. package/assets/bootstrap/js/src/alert.js +1 -1
  5. package/assets/bootstrap/js/src/base-component.js +2 -2
  6. package/assets/bootstrap/js/src/button.js +1 -1
  7. package/assets/bootstrap/js/src/carousel.js +1 -1
  8. package/assets/bootstrap/js/src/collapse.js +1 -1
  9. package/assets/bootstrap/js/src/dom/data.js +1 -1
  10. package/assets/bootstrap/js/src/dom/event-handler.js +1 -1
  11. package/assets/bootstrap/js/src/dom/manipulator.js +1 -1
  12. package/assets/bootstrap/js/src/dom/selector-engine.js +1 -1
  13. package/assets/bootstrap/js/src/dropdown.js +3 -12
  14. package/assets/bootstrap/js/src/modal.js +13 -17
  15. package/assets/bootstrap/js/src/offcanvas.js +1 -1
  16. package/assets/bootstrap/js/src/popover.js +1 -1
  17. package/assets/bootstrap/js/src/scrollspy.js +10 -14
  18. package/assets/bootstrap/js/src/tab.js +4 -2
  19. package/assets/bootstrap/js/src/toast.js +4 -9
  20. package/assets/bootstrap/js/src/tooltip.js +50 -32
  21. package/assets/bootstrap/js/src/util/backdrop.js +1 -1
  22. package/assets/bootstrap/js/src/util/component-functions.js +1 -1
  23. package/assets/bootstrap/js/src/util/config.js +1 -1
  24. package/assets/bootstrap/js/src/util/focustrap.js +1 -1
  25. package/assets/bootstrap/js/src/util/index.js +1 -1
  26. package/assets/bootstrap/js/src/util/sanitizer.js +1 -1
  27. package/assets/bootstrap/js/src/util/scrollbar.js +1 -1
  28. package/assets/bootstrap/js/src/util/swipe.js +1 -1
  29. package/assets/bootstrap/js/src/util/template-factory.js +1 -1
  30. package/assets/bootstrap/package.json +27 -28
  31. package/assets/bootstrap/scss/_accordion.scss +4 -7
  32. package/assets/bootstrap/scss/_button-group.scss +1 -1
  33. package/assets/bootstrap/scss/_buttons.scss +7 -28
  34. package/assets/bootstrap/scss/_carousel.scss +3 -0
  35. package/assets/bootstrap/scss/_dropdown.scss +1 -2
  36. package/assets/bootstrap/scss/_functions.scss +2 -2
  37. package/assets/bootstrap/scss/_list-group.scss +5 -6
  38. package/assets/bootstrap/scss/_modal.scss +1 -1
  39. package/assets/bootstrap/scss/_nav.scss +2 -2
  40. package/assets/bootstrap/scss/_navbar.scss +0 -2
  41. package/assets/bootstrap/scss/_offcanvas.scss +4 -5
  42. package/assets/bootstrap/scss/_pagination.scss +1 -1
  43. package/assets/bootstrap/scss/_popover.scss +5 -5
  44. package/assets/bootstrap/scss/_toasts.scss +2 -5
  45. package/assets/bootstrap/scss/_variables-dark.scss +87 -0
  46. package/assets/bootstrap/scss/_variables.scss +17 -18
  47. package/assets/bootstrap/scss/bootstrap-utilities.scss +0 -3
  48. package/assets/bootstrap/scss/forms/_floating-labels.scss +0 -1
  49. package/assets/bootstrap/scss/forms/_input-group.scss +4 -7
  50. package/assets/bootstrap/scss/helpers/_focus-ring.scss +5 -0
  51. package/assets/bootstrap/scss/helpers/_icon-link.scss +25 -0
  52. package/assets/bootstrap/scss/mixins/_banner.scss +2 -2
  53. package/assets/bootstrap/scss/mixins/_color-mode.scss +21 -0
  54. package/assets/bootstrap/scss/mixins/_forms.scss +10 -10
  55. package/assets/bootstrap/scss/mixins/_table-variants.scss +2 -2
  56. package/assets/bootstrap/scss/mixins/_utilities.scss +1 -1
  57. package/assets/css/components/barchart.component.css +1 -1
  58. package/assets/css/components/barchart.component.css.map +1 -1
  59. package/assets/css/components/card.component.css +1 -0
  60. package/assets/css/components/card.component.css.map +1 -0
  61. package/assets/css/components/card.module.css +1 -0
  62. package/assets/css/components/card.module.css.map +1 -0
  63. package/assets/css/components/charts.config.css +1 -1
  64. package/assets/css/components/charts.config.css.map +1 -1
  65. package/assets/css/components/charts.css +1 -1
  66. package/assets/css/components/charts.css.map +1 -1
  67. package/assets/css/components/charts.module.css +1 -1
  68. package/assets/css/components/charts.module.css.map +1 -1
  69. package/assets/css/components/filter-card.component.css +1 -0
  70. package/assets/css/components/filter-card.component.css.map +1 -0
  71. package/assets/css/components/multiselect.preload.css +1 -1
  72. package/assets/css/components/multiselect.preload.css.map +1 -1
  73. package/assets/css/components/record-card.component.css +1 -0
  74. package/assets/css/components/record-card.component.css.map +1 -0
  75. package/assets/css/components/timeline.css +1 -1
  76. package/assets/css/components/timeline.css.map +1 -1
  77. package/assets/css/components/video-card.component.css +1 -0
  78. package/assets/css/components/video-card.component.css.map +1 -0
  79. package/assets/css/core.min.css +1 -1
  80. package/assets/css/core.min.css.map +1 -1
  81. package/assets/css/style.min.css +1 -1
  82. package/assets/css/style.min.css.map +1 -1
  83. package/assets/js/components/accordion/accordion.component.min.js +1 -1
  84. package/assets/js/components/actionbar/actionbar.component.min.js +5 -5
  85. package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
  86. package/assets/js/components/address-lookup/address-lookup.component.min.js +1 -1
  87. package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
  88. package/assets/js/components/applied-filters/applied-filters.component.min.js +1 -1
  89. package/assets/js/components/applied-filters/applied-filters.component.min.js.map +1 -1
  90. package/assets/js/components/barchart/barchart.component.js +2 -0
  91. package/assets/js/components/barchart/barchart.component.min.js +4 -2
  92. package/assets/js/components/barchart/barchart.component.min.js.map +1 -1
  93. package/assets/js/components/card/card.component.js +92 -154
  94. package/assets/js/components/card/card.component.min.js +26 -31
  95. package/assets/js/components/card/card.component.min.js.map +1 -1
  96. package/assets/js/components/carousel/carousel.component.min.js +1 -1
  97. package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
  98. package/assets/js/components/collapsible-side/collapsible-side.component.min.js +1 -1
  99. package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
  100. package/assets/js/components/fileupload/fileupload.component.min.js +1 -1
  101. package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -1
  102. package/assets/js/components/filter-card/filter-card.component.js +71 -0
  103. package/assets/js/components/filter-card/filter-card.component.min.js +27 -0
  104. package/assets/js/components/filter-card/filter-card.component.min.js.map +1 -0
  105. package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
  106. package/assets/js/components/header/header.component.min.js +1 -1
  107. package/assets/js/components/header/header.component.min.js.map +1 -1
  108. package/assets/js/components/inline-edit/inline-edit.component.min.js +1 -1
  109. package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
  110. package/assets/js/components/marketing/marketing.component.min.js +1 -1
  111. package/assets/js/components/marketing/marketing.component.min.js.map +1 -1
  112. package/assets/js/components/multiselect/multiselect.component.min.js +1 -1
  113. package/assets/js/components/multiselect/multiselect.component.min.js.map +1 -1
  114. package/assets/js/components/nav/nav.component.min.js +1 -1
  115. package/assets/js/components/nav/nav.component.min.js.map +1 -1
  116. package/assets/js/components/notification/notification.component.min.js +1 -1
  117. package/assets/js/components/notification/notification.component.min.js.map +1 -1
  118. package/assets/js/components/pagination/pagination.component.min.js +1 -1
  119. package/assets/js/components/pagination/pagination.component.min.js.map +1 -1
  120. package/assets/js/components/record-card/record-card.component.js +69 -0
  121. package/assets/js/components/record-card/record-card.component.min.js +27 -0
  122. package/assets/js/components/record-card/record-card.component.min.js.map +1 -0
  123. package/assets/js/components/search/search.component.min.js +1 -1
  124. package/assets/js/components/slider/slider.component.min.js +1 -1
  125. package/assets/js/components/slider/slider.component.min.js.map +1 -1
  126. package/assets/js/components/table/table.component.min.js +2 -2
  127. package/assets/js/components/table/table.component.min.js.map +1 -1
  128. package/assets/js/components/tabs/tabs.component.min.js +1 -1
  129. package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
  130. package/assets/js/components/video-card/video-card.component.js +176 -0
  131. package/assets/js/components/video-card/video-card.component.min.js +30 -0
  132. package/assets/js/components/video-card/video-card.component.min.js.map +1 -0
  133. package/assets/js/components.bundle.js +5 -0
  134. package/assets/js/components.bundle.js.map +1 -0
  135. package/assets/js/components.js +30 -0
  136. package/assets/js/modules/card.module.js +33 -0
  137. package/assets/js/modules/chart.js +2 -2
  138. package/assets/js/modules/dialogs.js +0 -6
  139. package/assets/js/modules/table.js +1 -1
  140. package/assets/js/scripts.bundle.js +3 -194
  141. package/assets/js/scripts.bundle.js.map +1 -1
  142. package/assets/js/scripts.bundle.min.js +2 -2
  143. package/assets/js/scripts.bundle.min.js.map +1 -1
  144. package/assets/js/scripts.js +17 -0
  145. package/assets/js/tests/filterlist.spec.js +1 -1
  146. package/assets/sass/_components.scss +81 -1
  147. package/assets/sass/_corefiles.scss +4 -10
  148. package/assets/sass/_elements.scss +2 -0
  149. package/assets/sass/components/card.component.scss +229 -0
  150. package/assets/sass/components/card.module.scss +154 -0
  151. package/assets/sass/components/charts.config.scss +3 -0
  152. package/assets/sass/components/charts.module.scss +5 -3
  153. package/assets/sass/components/filter-card.component.scss +106 -0
  154. package/assets/sass/components/multiselect.preload.scss +7 -0
  155. package/assets/sass/components/record-card.component.scss +204 -0
  156. package/assets/sass/components/video-card.component.scss +80 -0
  157. package/assets/sass/components.reset.scss +5 -43
  158. package/assets/sass/elements/badge-tag.scss +5 -1
  159. package/assets/sass/elements/buttons.scss +3 -0
  160. package/assets/sass/elements/dialog.scss +2 -744
  161. package/assets/sass/elements/forms.scss +5 -0
  162. package/assets/sass/elements/media.scss +0 -38
  163. package/assets/sass/elements/modal.scss +553 -0
  164. package/assets/sass/elements/popover.scss +207 -0
  165. package/assets/sass/foundations/reboot.scss +2 -2
  166. package/assets/sass/foundations/root.scss +0 -1
  167. package/assets/ts/components/barchart/barchart.component.ts +2 -0
  168. package/assets/ts/components/card/card.component.ts +94 -192
  169. package/assets/ts/components/filter-card/filter-card.component.ts +81 -0
  170. package/assets/ts/components/record-card/record-card.component.ts +82 -0
  171. package/assets/ts/components/video-card/video-card.component.ts +227 -0
  172. package/assets/ts/components.ts +38 -0
  173. package/assets/ts/modules/card.module.ts +43 -0
  174. package/assets/ts/modules/dialogs.ts +0 -8
  175. package/assets/ts/modules/table.ts +1 -1
  176. package/assets/ts/scripts.ts +22 -0
  177. package/assets/ts/tests/filterlist.spec.ts +1 -1
  178. package/dist/components.es.js +201 -201
  179. package/dist/components.umd.js +76 -81
  180. package/package.json +8 -7
  181. package/src/components/BarChart/BarChart.vue +2 -2
  182. package/src/components/FilterCard/FilterCard.vue +25 -0
  183. package/src/components/RecordCard/RecordCard.vue +25 -0
  184. package/src/components/VideoCard/VideoCard.vue +25 -0
  185. package/assets/css/components/card.css +0 -1
  186. package/assets/css/components/card.css.map +0 -1
  187. package/assets/css/components/card.global.css +0 -1
  188. package/assets/css/components/card.global.css.map +0 -1
  189. package/assets/css/components/card.preload.css +0 -1
  190. package/assets/css/components/card.preload.css.map +0 -1
  191. package/assets/js/bundle.js +0 -74
  192. package/assets/js/dynamic.js +0 -80
  193. package/assets/js/dynamic.min.js +0 -18
  194. package/assets/js/dynamic.min.js.map +0 -1
  195. package/assets/js/flat-components.js +0 -84
  196. package/assets/js/modules/youtubevideo.js +0 -106
  197. package/assets/sass/components/card.global.scss +0 -102
  198. package/assets/sass/components/card.preload.scss +0 -8
  199. package/assets/sass/components/card.scss +0 -606
  200. package/assets/ts/bundle.ts +0 -94
  201. package/assets/ts/components/barchart/README.md +0 -37
  202. package/assets/ts/components/card/README.md +0 -39
  203. package/assets/ts/dynamic.ts +0 -107
  204. package/assets/ts/flat-components.ts +0 -106
  205. package/assets/ts/modules/youtubevideo.ts +0 -141
  206. package/src/foundations/YoutubeVideo/README.md +0 -11
  207. package/src/foundations/YoutubeVideo/YoutubeVideo.vue +0 -24
@@ -1,38 +1,33 @@
1
1
  /*!
2
- * iamKey v6.0.0
2
+ * iamKey v6.1.0--beta
3
3
  * Copyright 2022-2024 iamproperty
4
- */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Card"});class g extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.querySelector('*:not(.badge):not(small):not(.btn):not(button) > [class*="fa-"]:not(.btn)')&&this.classList.add("card--has-icon");let i=this.classList.toString();const t=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"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
4
+ */const m=r=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:r})},g=(r,t,i)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:t}),i.forEach(e=>{r.addEventListener(e,function(n){let d={event:e,element:t,target:n.target};Object.keys(n.detail).forEach(o=>{const a=n.detail[o];d[o]=a}),window.dataLayer.push(d)})}),!0),b=`<div class="card__head" part="head">
5
+ <slot name="head"></slot>
6
+ </div>
7
+ <div class="card__badges"><slot name="badges"></slot></div>
8
+ <slot name="checkbox" class="activate-prevent-hover"></slot>
9
+ <div class="card__body" part="body">
10
+ <slot></slot>
11
+ <slot name="secondary" part="secondary"></slot>
12
+ </div>
13
+ <div class="card__details" part="details">
14
+ <slot name="details"></slot>
15
+ </div>
16
+ <div class="card__footer" part="footer">
17
+ <slot name="footer"></slot>
18
+ </div>`,h=r=>{r.classList.add("card");const t=r.shadowRoot.querySelector(".card__head"),i=r.shadowRoot.querySelector(".card__body");r.hasAttribute("data-image")&&(t.innerHTML+=`<img src="${r.getAttribute("data-image")}" alt="" loading="lazy" part="image" />`),r.hasAttribute("data-total")?i.insertAdjacentHTML("beforeend",`<div class="card__total">${r.getAttribute("data-total")}</div>`):r.querySelector('[slot="total-icon"]')&&i.insertAdjacentHTML("beforeend",'<div class="card__total"><slot name="total-icon"></slot></div>'),r.querySelector('[slot="badges"]')||r.shadowRoot.querySelector(".card__badges").remove()};var v=function(r,t,i,e){function n(d){return d instanceof i?d:new i(function(o){o(d)})}return new(i||(i=Promise))(function(d,o){function a(l){try{c(e.next(l))}catch(s){o(s)}}function p(l){try{c(e.throw(l))}catch(s){o(s)}}function c(l){l.done?d(l.value):n(l.value).then(a,p)}c((e=e.apply(r,t||[])).next())})};m("iam-card");class u extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
5
19
  <style>
6
- @import "${r}";
7
- .card{--card-icon-right: 1rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);min-height:100%;width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px}.card>*:not(.btn-compact){min-width:100%}.card.border-0{box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__body{position:relative;padding:var(--card-top-padding) var(--card-right-padding) 0 var(--card-left-padding);z-index:-1}.card__footer{margin-top:auto;padding:0 var(--card-right-padding) var(--card-bottom-padding) var(--card-left-padding)}.card:is(:hover,:focus) .link:after{width:50%}.card:has(.card__footer .link):before,.card:has(.card__footer .link):after{display:none}.card:not(:has(.dialog__wrapper)):before,.card:not(:has(.dialog__wrapper)):after{content:"";position:absolute;right:var(--card-icon-right);bottom:var(--card-bottom-padding);height:1.5rem;width:1.5rem;background:var(--colour-warning);border-radius:50%}.card:not(:has(.dialog__wrapper)):after{background:var(--colour-primary-theme);mask-image:var(--icon, var(--icon-arrow));mask-size:50%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon, var(--icon-arrow));-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;z-index:2}.card:not(:has(.dialog__wrapper)):is(:hover,:focus,.hover){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px}.card:not(:has(.dialog__wrapper)):not([class*=colour-]):is(:hover,:focus,.hover,:active,.active):before{background:var(--hover-icon-bg, var(--colour-primary-theme))}.card:not(:has(.dialog__wrapper)):not([class*=colour-]):is(:hover,:focus,.hover,:active,.active):after{background:var(--hover-icon-colour, #ffffff)}.card:not(:has(.dialog__wrapper)):is(:active,.active){--card-icon-right: var(--card-icon-right-overide,0.5rem);outline:none}.card:not(:has(.dialog__wrapper)):is(:active){background:#fcfcfc}.card span{display:block;font-weight:bold;padding-top:1.5rem;font-size:1rem}.card:has(.card__illustration) .card__body{align-items:center;display:flex}.card:has(.card__illustration) .card__body .card__illustration{height:4rem;width:4rem;margin-right:1.5rem;margin-top:-1.25rem;margin-bottom:-1.25rem;position:relative}.card:has(.card__illustration) .card__body .card__illustration img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}.card .card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card.card--has-icon:not(.card--secondary):not(.card--filter){display:flex;align-items:center}.card.card--has-icon:not(.card--secondary):not(.card--filter):before,.card.card--has-icon:not(.card--secondary):not(.card--filter):after{top:calc(50% - .75rem);bottom:auto}.card.card--has-icon:not(.card--secondary):not(.card--filter) .card__body{padding-left:4rem;margin-block:auto;padding-bottom:var(--card-bottom-padding)}.card.card--has-icon:not(.card--secondary):not(.card--filter) .card__footer{padding:0;display:none}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}.card__head .card__badges{position:absolute;top:1rem;text-align:left;left:1rem;z-index:9}.card__body .card__badges.card__badges--inline{margin-top:-1rem;min-height:1rem}.card__body .card__badges:not(.card__badges--inline){position:absolute;top:.5rem;text-align:left;right:.75rem;z-index:9}.card[class*=colour-],.card--filter{border-left:0.75rem solid var(--colour, var(--colour-primary))}.card--filter{--top-padding: 1.5rem;--right-padding: 1rem;--bottom-padding: 1.5rem;--left-padding: 1rem}.card--filter:has(.card__total) .card__body{align-items:center;display:flex}.card--filter:before,.card--filter:after{display:none}.card--filter:is(:hover,:focus,.hover){outline:none}.card--filter:is(:hover,:focus,.hover) :is(.card__body,.card__footer){background:#eee}.card--filter:is(:checked,.checked,:active,.active){outline:2px solid var(--colour, var(--colour-primary));outline-offset:-2px}.card--filter:is(:checked,.checked,:active,.active) .card__body{background:none}.card--filter:is(:checked,.checked,:active,.active) .card__footer{background:none}.card--filter.card--has-icon{--bottom-padding: 1rem;border:none}.card--filter .icon{font-size:1.125rem !important;height:1.125rem !important;margin:0 0 .5rem 0 !important;font-weight:400 !important;display:block !important}.card--filter .card__total{margin-top:0;order:-1}@media screen and (prefers-color-scheme: dark){.card--filter .card__body{background:none !important}.card--filter:is(:hover,:focus,.hover,:active,.active):not(:checked,.checked){outline:2px solid var(--colour, var(--colour-primary)) !important;outline-offset:-2px}}.card--filter ::slotted(i){display:block !important;font-size:1.125rem !important;margin:0 0 .5rem 0 !important}.card:has(.card__head) .card__head{padding-bottom:0;padding-top:var(--img-height, 27%);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card:has(.card__head) .card__head>img{position:absolute;top:0;left:0;width:102%;height:102%;object-fit:cover}.card.card--lg-image:has(.card__head) .card__head{padding-top:55%}:host([data-selected]) .card:before,:host([data-selected]) .card:after{display:none !important}:host(.card--flag){position:relative}:host(.card--flag):after{content:"\uF024";font-family:"Font Awesome 6 Pro";position:absolute;top:1rem;right:1rem;font-size:1rem;line-height:1;height:1rem;width:1rem;display:inline-block;font-weight:normal;color:var(--colour, var(--colour-primary))}.card--secondary{--card-top-padding: 1rem;--card-bottom-padding: 1.5rem}.card--secondary:before,.card--secondary:after{display:none}.card--secondary .btn-compact{position:absolute;top:0;right:0;margin:.5rem .5rem 0 0;z-index:99}.card--secondary.secondary-hover{outline:2px solid var(--colour, var(--colour-primary));outline-offset:-2px}.card--secondary.secondary-hover .btn-compact{background-color:var(--colour);color:var(--colour-primary-theme);border-color:rgba(0,0,0,0) !important}.card--secondary:has(.btn-compact:is(:hover,:focus,:active)) .btn-compact{pointer-events:all}.card--secondary ::slotted(i){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card--record:has(.card__head){--img-height: 40%}.card--record:has(.card__head):before,.card--record:has(.card__head):after{display:none}.card--record:has(.card__head) .card__head{background:rgba(0,0,0,0);position:relative}:host([data-record=business]){--record-icon: "\uF54F";--record-colour: var(--wider-colour-2)}:host([data-record=page]){--record-icon: "\uF15C";--record-colour: var(--wider-colour-3)}:host([data-record=contact]){--record-icon: "\uF2B9";--record-colour: var(--wider-colour-4)}:host([data-record=lettings]){--record-icon: "\uE003";--record-icon-font: Font Awesome Kit;--record-colour: var(--wider-colour-5)}:host([data-record=sales]){--record-icon: "\uE004";--record-icon-font: Font Awesome Kit;--record-colour: var(--wider-colour-7)}:host([data-record=landlord]){--record-icon: "\uE001";--record-icon-font: Font Awesome Kit;--record-colour: var(--wider-colour-8)}:host([data-record=contractor]){--record-icon: "\uF82C";--record-colour: var(--wider-colour-9)}:host([data-record=vendor]){--record-icon: "\uE002";--record-icon-font: Font Awesome Kit;--record-colour: var(--wider-colour-13)}:host([data-record=tenant]){--record-icon: "\uE1B0";--record-colour: var(--wider-colour-6)}:host([data-record=sales-applicant]){--record-icon: "\uE006";--record-icon-font: Font Awesome Kit;--record-colour: var(--wider-colour-10)}:host([data-record]) .card--record:has(.card__head) .card__head{background:rgba(0,0,0,0);position:relative}:host([data-record]) .card--record:has(.card__head) .card__head:before{font-family:var(--record-icon-font, "Font Awesome 6 Pro");font-weight:normal;font-size:1.5rem;content:var(--record-icon);display:block;position:absolute;top:auto;left:50%;bottom:0;background-color:var(--record-colour);border-radius:50%;height:4rem;line-height:4rem;width:4rem;text-align:center;transform:translate(-50%, 0)}slot[name=btns]{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;margin-right:calc(var(--card-right-padding)*-1);margin-bottom:calc(var(--card-bottom-padding)*-1);padding-right:1rem;padding-bottom:1rem;pointer-events:none}::slotted([slot=btns]){pointer-events:all;margin:0 !important}.dialog__wrapper{position:absolute;right:1rem;bottom:2rem;min-width:3rem !important;left:auto;z-index:999}.dialog__wrapper>dialog{display:var(--menu-display, none);position:fixed;top:anchor(top);position-anchor:--anchor-el;left:anchor(right);right:auto;margin:0 0 0 0.25rem;padding:1rem}.dialog__wrapper>dialog::backdrop{display:none}.dialog__wrapper>dialog:popover-open{display:block !important}.dialog__wrapper:has(dialog:popover-open)>button{background-color:var(--colour)}.dialog__wrapper>button{margin:0;anchor-name:--anchor-el}.dialog__wrapper>button:not(:hover,:focus,:focus-within,:active){background:var(--ellipsis-bg)}::slotted([slot=actions]){border:none !important;margin:0 !important;display:block !important;width:fit-content}::slotted([slot=primary-action]){overflow:hidden;background-color:rgba(0,0,0,0);text-indent:-300%;position:absolute !important;inset:0;margin:0 !important;z-index:99;border:none}::slotted([slot=primary-action]:is(:hover,:focus,.hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px;border-radius:var(--card-border-radius) !important}/*# sourceMappingURL=assets/css/components/card.css.map */
8
-
9
20
  ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
21
+
22
+ :host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 6 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges{padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}body:not(.js-enabled) dialog:not([open]):target{display:block}[popover],dialog{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:0.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}[popover]:popover-open,dialog[open]{display:flex;flex-direction:column}[popover]:popover-open>*:last-child,dialog[open]>*:last-child{margin-bottom:0}[popover]:popover-open>:is(p):last-child,dialog[open]>:is(p):last-child{padding-bottom:0}.dialog__wrapper{position:relative;display:inline-block;margin-bottom:calc(var(--btn-margin) - .25rem)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button{background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover);filter:brightness(85%);transition:background .1s,color .1s;border-radius:1.5rem}.dialog__wrapper>.btn:first-child{margin-bottom:.25rem}.dialog__wrapper>.btn:first-child:not(.btn-compact):not([class*=fa-]):after{content:"";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}.dialog__wrapper>.btn:first-child[aria-expanded]:not([data-number]):after{transform:rotate(270deg)}.dialog__wrapper>:is(dialog[open],dialog:popover-open){left:0;top:100%;z-index:var(--index-floating);min-width:20rem;border-radius:1rem;width:20rem;padding:1.5rem}@media screen and (min-width: 36em){.dialog__wrapper>:is(dialog[open],dialog:popover-open){width:20.9375rem}}@media screen and (min-width: 62em){.dialog__wrapper>:is(dialog[open],dialog:popover-open){width:22.5rem}}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list{width:fit-content !important;min-width:8.75rem !important;max-width:17.5rem !important;padding:1rem;margin:0}@media screen and (min-width: 36em){.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list{width:max-content !important}}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list hr{height:2px;background:var(--colour-border);margin-left:-1rem;margin-right:-1rem;margin-block:.25rem}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .radio--tick{margin-right:0;padding-left:1.5rem;margin-bottom:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .radio--tick:before{left:0;font-size:1em;top:.75rem}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a{padding:0.375rem;margin:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a:not(:hover,:focus,:active){border-color:rgba(0,0,0,0)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a:after{display:none}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action{margin:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:not(:hover,:focus,:active){border-color:rgba(0,0,0,0)}.dialog__wrapper>:is(dialog[open],dialog:popover-open) :is(dialog[open],dialog:popover-open){display:contents}.dialog__wrapper.dialog__wrapper--right>:is(dialog[open],dialog:popover-open){right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>:is(dialog[open],dialog:popover-open){width:14.9375rem}.dialog__wrapper.dialog__wrapper--lg>:is(dialog[open],dialog:popover-open){width:19.9375rem}@media screen and (min-width: 36em){.dialog__wrapper.dialog__wrapper--sm-left>dialog[open]{left:0;right:auto}.dialog__wrapper.dialog__wrapper--sm-right>dialog[open]{right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>dialog[open]{width:16.5625rem}.dialog__wrapper.dialog__wrapper--lg>dialog[open]{width:28.25rem}}@media screen and (min-width: 62em){.dialog__wrapper.dialog__wrapper--md-left>dialog[open]{left:0;right:auto}.dialog__wrapper.dialog__wrapper--md-right>dialog[open]{right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>dialog[open]{width:16.625rem}.dialog__wrapper.dialog__wrapper--lg>dialog[open]{width:28.375rem}}.dialog__wrapper :is(.empty,.individual){display:none}@supports selector(:has(*)){.dialog__wrapper :is(.empty,.individual){display:inline}}.dialog__wrapper:has(input:checked) .empty,.dialog__wrapper:not(:has(input:checked)) .individual,.dialog__wrapper:has(input:checked~input:checked) .individual,.dialog__wrapper:not(:has(input:checked~input:checked)) .multiple{display:none}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn);font-size:1.125rem;line-height:1.5rem;padding:calc(var(--btn-padding-block) - var(--btn-border-width)) calc(var(--btn-padding-inline) - var(--btn-border-width));border-radius:1.5rem;margin-bottom:var(--btn-margin);transition:background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #FCFCFC}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled{opacity:.4;cursor:not-allowed}.btn-secondary{background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border);color:var(--colour-btn-secondary)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.375rem;--btn-padding-inline: 0.375rem;background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted);border-radius:0.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;color:var(--colour-heading)}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}a:is(:active,.active):not([disabled]) .btn-action,.btn-action:is(:active,.active):not([disabled]){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 6 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:0.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{font-family:"Font Awesome 6 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem}.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:0.5rem;text-align:center;width:calc(var(--compact-size));min-width:calc(var(--compact-size));max-width:calc(var(--compact-size));height:calc(var(--compact-size)) !important;min-height:calc(var(--compact-size)) !important;max-height:calc(var(--compact-size)) !important;line-height:calc(var(--compact-size) - var(--btn-border-width) - var(--btn-border-width)) !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1.25rem}.btn-compact:not(:last-child){margin-right:0.5rem}.btn-compact:before{content:var(--fa);position:absolute;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - var(--btn-border-width) - var(--btn-border-width));font-weight:900}.btn-compact[class*=fa-]:before{line-height:calc(var(--compact-size) - var(--btn-border-width) - var(--btn-border-width)) !important}.btn-compact.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}.btn-compact.btn-action{--compact-size: 2rem;font-size:1rem}.btn-compact.btn-action:before{font-size:1em;font-weight:400}.btn-compact.btn-secondary{--colour-btn-border: transparent;border-color:rgba(0,0,0,0)}.btn-compact.btn-secondary:not([class*=colour-]){--colour: var(--colour-light) }.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:rgba(0,0,0,0) !important}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse):is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}.btn-compact[data-number]{position:relative}.btn-compact[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:#fff;letter-spacing:-0.1em;font-family:arial,sans-serif}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 6 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:1.5rem;vertical-align:bottom}.btn:has(select){position:relative;padding-right:3.5rem}.btn:has(select):not(.mw-100){max-width:13rem}.btn:has(select) select{all:unset !important;padding:calc(0.75rem - 2px) calc(2.5rem - 2px) !important;margin:calc(-0.75rem) calc(-2.5rem) !important;padding-right:3.5rem !important;margin-right:-3.5rem !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;max-width:100% !important;outline:none;font-weight:bold;font-size:1.125rem !important;line-height:1.5rem !important}.btn:has(select) select option{padding:0;text-align:left;color:var(--colour-primary)}.btn:has(select):after{position:absolute;top:0.625rem;right:2rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn:has(select).active:after{transform:rotate(-90deg)}.btn:has(select:focus):after{transform:rotate(-90deg)}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 6 Pro"}.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled]){color:var(--colour-active)}:host{--card-right-padding: 1rem;--card-icon-right: 1rem}:host(:is(:hover,:focus,.hover):not(.prevent-hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px}:host(:is(:active,.active):not(.prevent-hover)){--card-icon-right: var(--card-icon-right-overide,0.5rem);outline:none}:host(.prevent-hover){pointer-events:none}:host(.prevent-hover) *{pointer-events:all}:host(.show-icon) .card__body{--card-right-padding: 3.5rem}:host(.show-icon) .card__body:before,:host(.show-icon) .card__body:after{content:"";position:absolute;right:var(--card-icon-right);bottom:var(--card-bottom-padding);height:1.5rem;width:1.5rem;background:var(--colour-warning);border-radius:50%}:host(.show-icon) .card__body:after{background:var(--colour-primary-theme);mask-image:var(--icon, var(--icon-arrow));mask-size:50%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon, var(--icon-arrow));-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;z-index:2}:host(:is(:hover,:focus,.hover):not(.prevent-hover):not([class*=colour-])) .card__body:before{background:var(--hover-icon-bg, var(--colour-primary-theme))}:host(:is(:hover,:focus,.hover):not(.prevent-hover):not([class*=colour-])) .card__body:after{background:var(--hover-icon-colour, #ffffff)}:host(:is(:active,.active):not(.prevent-hover):not([class*=colour-])) .card__body:before{background:var(--hover-icon-bg, var(--colour-primary-theme))}:host(:is(:active,.active):not(.prevent-hover):not([class*=colour-])) .card__body:after{background:var(--hover-icon-colour, #ffffff)}.card__body:has(.card__illustration){align-items:center;display:flex}.card__body:has(.card__illustration) .card__illustration{height:4rem;width:4rem;margin-right:1.5rem;margin-top:-1.25rem;margin-bottom:-1.25rem;position:relative}.card__body:has(.card__illustration) .card__illustration img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}:host([class*=colour-]){border-left:0.75rem solid var(--colour, var(--colour-primary))}slot[name=secondary]{display:block;position:absolute;top:.5rem;right:0;margin:.5rem .5rem 0 0;z-index:999}::slotted([slot=secondary]:not(:hover,:focus,:active,.hover)){background:none !important;color:var(--colour-btn) !important}::slotted([slot=checkbox]){position:absolute !important;top:.5rem;right:.5rem;width:2rem;height:2rem;height:2.5rem;overflow:hidden}.dialog__wrapper{position:absolute;right:1rem;bottom:2rem;width:3rem !important;left:auto;z-index:999}.dialog__wrapper>.btn:before{content:"\uF142";font-family:"Font Awesome 6 Pro"}.dialog__wrapper>[popover]{display:var(--menu-display, none);position:fixed;top:anchor(top);position-anchor:--anchor-el;left:anchor(right);right:auto;margin:0 0 0 0.25rem;padding:1rem}.dialog__wrapper>[popover]::backdrop{display:none}.dialog__wrapper>[popover]:popover-open{display:block !important}.dialog__wrapper:has([popover]:popover-open)>button{background-color:var(--colour)}.dialog__wrapper>button[popovertarget]{margin:0;anchor-name:--anchor-el}.dialog__wrapper>button[popovertarget]:not(:hover,:focus,:focus-within,:active){background:var(--ellipsis-bg)}::slotted([slot=btns]){border:none !important;margin:0 !important;display:block !important;width:fit-content}::slotted([slot=primary-action]){overflow:hidden;background-color:rgba(0,0,0,0);text-indent:-300%;position:absolute !important;inset:0;margin:0 !important;z-index:99;border:none}:host(:not(.prevent-hover)) ::slotted([slot=primary-action]:is(:hover,:focus,.hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px;border-radius:var(--card-border-radius) !important}/*# sourceMappingURL=assets/css/components/card.component.css.map */
23
+
10
24
  </style>
11
- <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
12
- <div class="card ${i}" tabindex="0" part="card">
13
- ${this.createCardConent()}
14
- </div>
15
- `,this.shadowRoot.appendChild(a.content.cloneNode(!0)),document.getElementById("cardGlobal")||document.head.insertAdjacentHTML("beforeend",`<style id="cardGlobal">iam-card{margin-bottom:1.5rem;display:block}@supports not selector(:has(*)){iam-card{margin-bottom:2rem;display:block}}iam-card>div:has([type=checkbox]){display:contents}iam-card>div:has([type=checkbox])>input:is([type=radio],[type=checkbox])+label{position:absolute !important;top:.5rem;right:.5rem;width:2rem;padding-left:2rem;margin:0.25rem 0.5rem !important;height:2.5rem;overflow:hidden}iam-card:has([type=checkbox]:checked){--hover-outline-colour: var(--colour-info);--outline-colour: var(--colour-info)}iam-card:has([type=checkbox]+label:hover){--hover-outline-colour: transparent;--hover-icon-bg: var(--colour-warning);--hover-icon-colour: var(--colour-primary-theme);--card-icon-right-overide:1rem}iam-card:has([type=checkbox]:active){--hover-outline-colour: transparent;--hover-icon-bg: var(--colour-warning);--hover-icon-colour: var(--colour-primary-theme);--card-icon-right-overide:1rem}iam-card.card--has-icon:not(.card--filter):not(.card--secondary) i{position:absolute;top:calc(50% - .5rem - 2px);left:1rem}iam-card .badge i{position:static !important;margin-right:.25rem}:is(a,button,label) iam-card{margin-bottom:0 !important}[data-select-container]:has([type=checkbox]:checked) iam-card>div:has([type=checkbox])>input:is([type=radio],[type=checkbox]){width:100%;height:100%;max-height:100%;max-width:100%;cursor:pointer;pointer-events:all;inset:0;border-radius:0;z-index:10}a[target=_blank] iam-card::part(card){--icon: var(--icon-new-tab)}/*# sourceMappingURL=assets/css/components/card.global.css.map */
16
- </style>`)}createCardConent(){return`${this.hasAttribute("data-image")||this.hasAttribute("data-record")?`<div class="card__head" part="head">${this.hasAttribute("data-image")?`<img src="${this.getAttribute("data-image")}" alt="" loading="lazy" />`:""} <div class="card__badges"><slot name="badges"></slot></div></div>`:""}
17
- <div class="card__body" part="body">
18
- ${!this.hasAttribute("data-image")&&this.querySelector('[slot="badges"]')&&this.querySelector('[slot="checkbox"]')?'<div class="card__badges card__badges--inline"><slot name="badges"></slot></div>':""}
19
- ${!this.hasAttribute("data-image")&&!this.hasAttribute("data-record")&&this.querySelector('[slot="badges"]')?'<div class="card__badges"><slot name="badges"></slot></div>':""}
20
- ${this.hasAttribute("data-illustration")?`<div class="card__illustration"><img src="${this.getAttribute("data-illustration")}" alt="" loading="lazy" /></div>`:""}
21
- <slot></slot>
22
- ${this.hasAttribute("data-total")?`<div class="card__total">${this.getAttribute("data-total")}</div>`:""}
23
- </div>
24
- ${this.hasAttribute("data-add-link")?'<button class="btn btn-compact btn-secondary fa-plus">Add property</button>':""}
25
- <slot name="checkbox"></slot>
25
+ ${b}
26
26
  <slot name="primary-action"></slot>
27
- <div class="dialog__wrapper d-none">
28
- <button class="btn btn-secondary btn-compact fa-ellipsis-vertical" popovertarget="actions" title="${this.hasAttribute("data-menu-title")?this.getAttribute("data-menu-title"):"Further actions"}">Lorum ipsum</button>
29
- <dialog class="dialog--fix dialog--list" id="actions" popover>
30
- <slot name="actions"></slot>
31
- </dialog>
32
- </div>
33
- <div class="card__footer" part="footer">
34
- <slot name="footer"></slot>
35
- <slot name="btns"></slot>
36
- ${this.hasAttribute("data-cta")?`<span class="link d-inline-block pt-0 mb-0">${this.getAttribute("data-cta")}</span>`:""}
37
- </div>`}connectedCallback(){this.classList.add("loaded");const i=this,t=i.parentNode.closest("a, button, label, router-link"),r=this.shadowRoot.querySelector(".card"),a=this.shadowRoot.querySelector(".btn-compact");this.hasAttribute("data-record")&&this.getAttribute("data-record");const l=this.shadowRoot.querySelector(".dialog__wrapper");let s=i.querySelectorAll('button[slot="actions"],a[slot="actions"]');if(s.length){const e=this.shadowRoot.querySelector(".dialog__wrapper");this.shadowRoot.querySelector(".dialog__wrapper dialog"),e.querySelector("button"),e.classList.remove("d-none"),Array.from(s).forEach((o,d)=>{o.classList.add("btn"),o.classList.add("btn-action")})}else l.remove();if(!t)return!1;if(t&&t.setAttribute("tabindex","-1"),t.matches("label[for]")&&(document.getElementById(t.getAttribute("for")).checked?r.classList.add("checked"):r.classList.remove("checked")),this.addEventListener("click",e=>{let o=new Event("click");r.dispatchEvent(o)}),r.addEventListener("click",e=>{if(t.matches("label[for]")){e.stopPropagation(),e.preventDefault();const o=document.getElementById(t.getAttribute("for")),d=o.getAttribute("name"),c=o.getAttribute("id");Array.from(document.querySelectorAll(`[name="${d}"][type="radio"]:not([id="${c}"])`)).forEach((n,m)=>{document.querySelector(`[for="${n.getAttribute("id")}"] iam-card`).dispatchEvent(new Event("inactive"))}),t.click(),o.checked?r.classList.add("checked"):r.classList.remove("checked")}}),this.addEventListener("inactive",e=>{r.classList.remove("checked")}),r.addEventListener("keydown",e=>{switch(e.keyCode){case 32:case 13:if(t.matches("label[for]")){e.stopPropagation(),e.preventDefault();const o=document.getElementById(t.getAttribute("for")),d=o.getAttribute("name"),c=o.getAttribute("id");Array.from(document.querySelectorAll(`[name="${d}"]:not([id="${c}"])`)).forEach((n,m)=>{document.querySelector(`[for="${n.getAttribute("id")}"] iam-card`).dispatchEvent(new Event("inactive"))}),t.click(),o.checked?r.classList.add("checked"):r.classList.remove("checked")}else t.click();break}}),a){let e=this.getAttribute("data-add-link");a.addEventListener("click",o=>{o.stopPropagation(),o.preventDefault(),window.location=e})}}static get observedAttributes(){return["data-total","class","data-image"]}attributeChangedCallback(i,t,r){switch(i){case"data-total":{this.shadowRoot.querySelector(".card__total")&&(this.shadowRoot.querySelector(".card__total").innerHTML=r);break}case"class":{if(t!=r){let a=this.classList.toString();this.querySelector('*:not(.badge):not(small):not(.btn):not(button) > [class*="fa-"]:not(.btn)')&&(a+=" card--has-icon"),this.shadowRoot.querySelector(".card").setAttribute("class",`card ${a}`),this.shadowRoot.querySelector(".card").innerHTML=this.createCardConent()}break}case"data-image":{t!=r&&(this.shadowRoot.querySelector(".card").innerHTML=this.createCardConent());break}}}}export{g as default};
27
+ `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){return v(this,void 0,void 0,function*(){const t=this;t.shadowRoot.querySelector(".card__head");const i=t.shadowRoot.querySelector(".card__body");if(t.shadowRoot.querySelector(".dialog__wrapper"),t.shadowRoot.querySelector(".dialog__wrapper button"),h(t),t.hasAttribute("data-illustration")&&i.insertAdjacentHTML("afterbegin",`<div class="card__illustration"><img src="${this.getAttribute("data-illustration")}" alt="" loading="lazy" /></div>`),!t.querySelector('[slot="btns"]')&&!t.querySelector('[slot="secondary"]')&&t.classList.add("show-icon"),t.querySelector('[slot="btns"]')&&(t.shadowRoot.innerHTML+=`<div class="dialog__wrapper">
28
+ <button class="btn btn-secondary btn-compact fa-ellipsis-vertical" popovertarget="actions" title="Further actions" type="button">Open further actions</button>
29
+ <div class="dialog--fix dialog--list" id="actions" popover>
30
+ <slot name="btns"></slot>
31
+ </div>
32
+ </div>`),Array.from(t.querySelectorAll('[slot="btns"]')).forEach((o,a)=>{o.classList.add("btn"),o.classList.add("btn-action")}),t.querySelector('[slot="checkbox"],[slot="secondary"]')){const o=t.querySelector('[slot="checkbox"],[slot="secondary"]');o.addEventListener("mouseenter",a=>{t.classList.add("prevent-hover")}),o.addEventListener("mouseleave",a=>{t.classList.remove("prevent-hover")})}if(t.shadowRoot.querySelector(".dialog__wrapper")){const o=t.shadowRoot.querySelector(".dialog__wrapper");o.addEventListener("mouseenter",a=>{t.classList.add("prevent-hover")}),o.addEventListener("mouseleave",a=>{t.classList.remove("prevent-hover")})}const e=t.querySelector('input[type="checkbox"]');e&&e.addEventListener("change",o=>{if(e.checked){const a=new CustomEvent("select-card",{detail:{"Card value":e.value,"input name":e.getAttribute("name")}});t.dispatchEvent(a)}else{const a=new CustomEvent("unselect-card",{detail:{"Card value":e.value,"input name":e.getAttribute("name")}});t.dispatchEvent(a)}});const n=t.querySelector('[slot="secondary"]');n&&n.addEventListener("click",o=>{const a=new CustomEvent("secondary-button-clicked",{detail:{Title:n.getAttribute("title")}});t.dispatchEvent(a)});const d=t.querySelectorAll('[slot="btns"]');Array.from(d).forEach((o,a)=>{o.addEventListener("click",p=>{const c=new CustomEvent("action-button-clicked",{detail:{Title:o.getAttribute("title")}});t.dispatchEvent(c)})}),g(t,"iam-card",["select-card","unselect-card","secondary-button-clicked","action-button-clicked"])})}static get observedAttributes(){return["data-image"]}attributeChangedCallback(t,i,e){switch(t){case"data-total":{this.shadowRoot.querySelector(".card__total")&&(this.shadowRoot.querySelector(".card__total").innerHTML=e);break}case"data-image":{if(i!=e){const n=this.shadowRoot.querySelector(".card__head img");n&&n.setAttribute("src",e)}break}}}}export{u as default};
38
33
  //# sourceMappingURL=card.component.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"card.component.min.js","sources":["card.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Card\"\n});\nclass iamCard extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n if (this.querySelector('*:not(.badge):not(small):not(.btn):not(button) > [class*=\"fa-\"]:not(.btn)'))\n this.classList.add('card--has-icon');\n let classList = this.classList.toString();\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/card.css\";`;\n const loadExtraCSS = `@import \"${assetLocation}/css/components/card.global.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 <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n <div class=\"card ${classList}\" tabindex=\"0\" part=\"card\">\n ${this.createCardConent()}\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n // insert extra CSS\n if (!document.getElementById('cardGlobal'))\n document.head.insertAdjacentHTML('beforeend', `<style id=\"cardGlobal\">${loadExtraCSS}</style>`);\n }\n createCardConent() {\n // TODO split this out a bit\n return `${this.hasAttribute('data-image') || this.hasAttribute('data-record') ? `<div class=\"card__head\" part=\"head\">${this.hasAttribute('data-image') ? `<img src=\"${this.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" />` : ``} <div class=\"card__badges\"><slot name=\"badges\"></slot></div></div>` : ''}\n <div class=\"card__body\" part=\"body\">\n ${!this.hasAttribute('data-image') && this.querySelector('[slot=\"badges\"]') && this.querySelector('[slot=\"checkbox\"]') ? `<div class=\"card__badges card__badges--inline\"><slot name=\"badges\"></slot></div>` : ''}\n ${!this.hasAttribute('data-image') && !this.hasAttribute('data-record') && this.querySelector('[slot=\"badges\"]') ? `<div class=\"card__badges\"><slot name=\"badges\"></slot></div>` : ''}\n ${this.hasAttribute('data-illustration') ? `<div class=\"card__illustration\"><img src=\"${this.getAttribute('data-illustration')}\" alt=\"\" loading=\"lazy\" /></div>` : ''}\n <slot></slot>\n ${this.hasAttribute('data-total') ? `<div class=\"card__total\">${this.getAttribute('data-total')}</div>` : ''}\n </div>\n ${this.hasAttribute('data-add-link') ? `<button class=\"btn btn-compact btn-secondary fa-plus\">Add property</button>` : ''}\n <slot name=\"checkbox\"></slot>\n <slot name=\"primary-action\"></slot>\n <div class=\"dialog__wrapper d-none\">\n <button class=\"btn btn-secondary btn-compact fa-ellipsis-vertical\" popovertarget=\"actions\" title=\"${this.hasAttribute('data-menu-title') ? this.getAttribute('data-menu-title') : 'Further actions'}\">Lorum ipsum</button>\n <dialog class=\"dialog--fix dialog--list\" id=\"actions\" popover>\n <slot name=\"actions\"></slot>\n </dialog>\n </div>\n <div class=\"card__footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n <slot name=\"btns\"></slot>\n ${this.hasAttribute('data-cta') ? `<span class=\"link d-inline-block pt-0 mb-0\">${this.getAttribute('data-cta')}</span>` : ''}\n </div>`;\n }\n connectedCallback() {\n this.classList.add('loaded');\n // Mimic clicking the parent node so the focus and target events can be on the card\n const component = this;\n const parentNode = component.parentNode.closest('a, button, label, router-link');\n const card = this.shadowRoot.querySelector('.card');\n const btnCompact = this.shadowRoot.querySelector('.btn-compact');\n const recordType = this.hasAttribute('data-record') ? this.getAttribute('data-record') : '';\n // Add the actions slot to the buttons and links to move them into a dialog warpper\n const actionsWrapper = this.shadowRoot.querySelector('.dialog__wrapper');\n let buttons = component.querySelectorAll('button[slot=\"actions\"],a[slot=\"actions\"]');\n if (buttons.length) {\n const actionsWrapper = this.shadowRoot.querySelector('.dialog__wrapper');\n const actionsDialog = this.shadowRoot.querySelector('.dialog__wrapper dialog');\n const actionsBtn = actionsWrapper.querySelector('button');\n actionsWrapper.classList.remove('d-none');\n Array.from(buttons).forEach((button, index) => {\n button.classList.add('btn');\n button.classList.add('btn-action');\n });\n }\n else {\n actionsWrapper.remove();\n }\n /*\n If the parentNode is actually just a div,\n we don't want to look for anything or add events\n */\n if (!parentNode) {\n return false;\n }\n if (parentNode)\n parentNode.setAttribute('tabindex', '-1');\n if (parentNode.matches('label[for]')) {\n let isChecked = document.getElementById(parentNode.getAttribute('for')).checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n // Click event down\n this.addEventListener('click', (event) => {\n let clickEvent = new Event('click');\n card.dispatchEvent(clickEvent);\n });\n card.addEventListener('click', (event) => {\n if (parentNode.matches('label[for]')) {\n event.stopPropagation();\n event.preventDefault();\n const input = document.getElementById(parentNode.getAttribute('for'));\n const inputName = input.getAttribute('name');\n const inputID = input.getAttribute('id');\n // Mimic radio button functionality\n const inputs = Array.from(document.querySelectorAll(`[name=\"${inputName}\"][type=\"radio\"]:not([id=\"${inputID}\"])`));\n inputs.forEach((input, index) => {\n const otherCard = document.querySelector(`[for=\"${input.getAttribute('id')}\"] iam-card`);\n otherCard.dispatchEvent(new Event('inactive'));\n });\n parentNode.click();\n let isChecked = input.checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n });\n this.addEventListener('inactive', (event) => {\n card.classList.remove('checked');\n });\n card.addEventListener('keydown', (event) => {\n switch (event.keyCode) {\n case 32:\n case 13:\n if (parentNode.matches('label[for]')) {\n event.stopPropagation();\n event.preventDefault();\n const input = document.getElementById(parentNode.getAttribute('for'));\n const inputName = input.getAttribute('name');\n const inputID = input.getAttribute('id');\n const inputs = Array.from(document.querySelectorAll(`[name=\"${inputName}\"]:not([id=\"${inputID}\"])`));\n inputs.forEach((input, index) => {\n const otherCard = document.querySelector(`[for=\"${input.getAttribute('id')}\"] iam-card`);\n otherCard.dispatchEvent(new Event('inactive'));\n });\n parentNode.click();\n let isChecked = input.checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n else {\n parentNode.click();\n }\n break;\n default:\n break;\n }\n });\n if (btnCompact) {\n let addLocation = this.getAttribute('data-add-link');\n btnCompact.addEventListener('click', (event) => {\n event.stopPropagation();\n event.preventDefault();\n window.location = addLocation;\n });\n }\n }\n static get observedAttributes() {\n return [\"data-total\", \"class\", \"data-image\"];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case \"data-total\": {\n if (this.shadowRoot.querySelector('.card__total'))\n this.shadowRoot.querySelector('.card__total').innerHTML = newVal;\n break;\n }\n case \"class\": {\n if (oldVal != newVal) {\n let classList = this.classList.toString();\n if (this.querySelector('*:not(.badge):not(small):not(.btn):not(button) > [class*=\"fa-\"]:not(.btn)'))\n classList += ' card--has-icon';\n this.shadowRoot.querySelector('.card').setAttribute('class', `card ${classList}`);\n this.shadowRoot.querySelector('.card').innerHTML = this.createCardConent();\n }\n break;\n }\n case \"data-image\": {\n if (oldVal != newVal) {\n this.shadowRoot.querySelector('.card').innerHTML = this.createCardConent();\n }\n break;\n }\n }\n }\n}\nexport default iamCard;\n"],"names":["iamCard","classList","assetLocation","coreCSS","template","component","parentNode","card","btnCompact","actionsWrapper","buttons","button","index","event","clickEvent","input","inputName","inputID","addLocation","attrName","oldVal","newVal"],"mappings":"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"}
1
+ {"version":3,"file":"card.component.min.js","sources":["../_global.js","../../modules/card.module.js","card.component.js"],"sourcesContent":["// @ts-nocheck\nexport const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": componentName\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n \"event\": \"customElementAdded\",\n \"element\": componentName\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n let eventDetails = {\n \"event\": eventName,\n \"element\": componentName,\n \"target\": event.target\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","export const cardHTML = `<div class=\"card__head\" part=\"head\">\n <slot name=\"head\"></slot>\n</div>\n<div class=\"card__badges\"><slot name=\"badges\"></slot></div>\n<slot name=\"checkbox\" class=\"activate-prevent-hover\"></slot>\n<div class=\"card__body\" part=\"body\">\n <slot></slot>\n <slot name=\"secondary\" part=\"secondary\"></slot>\n</div>\n<div class=\"card__details\" part=\"details\">\n <slot name=\"details\"></slot>\n</div>\n<div class=\"card__footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n</div>`;\nexport const setupCard = (cardComponent) => {\n cardComponent.classList.add('card');\n const cardHead = cardComponent.shadowRoot.querySelector('.card__head');\n const cardBody = cardComponent.shadowRoot.querySelector('.card__body');\n if (cardComponent.hasAttribute('data-image')) {\n cardHead.innerHTML += `<img src=\"${cardComponent.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" part=\"image\" />`;\n }\n // Inset the HTML for the data total or icon fallback\n if (cardComponent.hasAttribute('data-total')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\">${cardComponent.getAttribute('data-total')}</div>`);\n }\n else if (cardComponent.querySelector('[slot=\"total-icon\"]')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\"><slot name=\"total-icon\"></slot></div>`);\n }\n if (!cardComponent.querySelector('[slot=\"badges\"]')) {\n cardComponent.shadowRoot.querySelector('.card__badges').remove();\n }\n};\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\n// @ts-nocheck\nimport { trackComponent, trackComponentRegistered } from \"../_global.js\";\nimport { cardHTML, setupCard } from \"../../modules/card.module.js\";\ntrackComponentRegistered(\"iam-card\");\nclass iamCard 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/card.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n ${cardHTML}\n <slot name=\"primary-action\"></slot>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n return __awaiter(this, void 0, void 0, function* () {\n const cardComponent = this;\n const cardHead = cardComponent.shadowRoot.querySelector('.card__head');\n const cardBody = cardComponent.shadowRoot.querySelector('.card__body');\n const cardMenu = cardComponent.shadowRoot.querySelector('.dialog__wrapper');\n const btn = cardComponent.shadowRoot.querySelector('.dialog__wrapper button');\n setupCard(cardComponent);\n // Add Illustration HTML\n if (cardComponent.hasAttribute('data-illustration')) {\n cardBody.insertAdjacentHTML('afterbegin', `<div class=\"card__illustration\"><img src=\"${this.getAttribute('data-illustration')}\" alt=\"\" loading=\"lazy\" /></div>`);\n }\n // Add class that shows the right arrow icon\n if (!cardComponent.querySelector('[slot=\"btns\"]') && !cardComponent.querySelector('[slot=\"secondary\"]')) {\n cardComponent.classList.add('show-icon');\n }\n // Secondary buttons and actions\n // Add the dialog wrapper HTML\n if (cardComponent.querySelector('[slot=\"btns\"]')) {\n cardComponent.shadowRoot.innerHTML += `<div class=\"dialog__wrapper\">\n <button class=\"btn btn-secondary btn-compact fa-ellipsis-vertical\" popovertarget=\"actions\" title=\"Further actions\" type=\"button\">Open further actions</button>\n <div class=\"dialog--fix dialog--list\" id=\"actions\" popover>\n <slot name=\"btns\"></slot>\n </div>\n </div>`;\n }\n // Make sure slotted buttons and links have correct button classes\n Array.from(cardComponent.querySelectorAll('[slot=\"btns\"]')).forEach((button, index) => {\n button.classList.add('btn');\n button.classList.add('btn-action');\n });\n // Hide the default hover and focus states when interacting with the checkbox, dialog wrapper or secondary button\n if (cardComponent.querySelector('[slot=\"checkbox\"],[slot=\"secondary\"]')) {\n const element = cardComponent.querySelector('[slot=\"checkbox\"],[slot=\"secondary\"]');\n element.addEventListener('mouseenter', (event) => {\n cardComponent.classList.add('prevent-hover');\n });\n element.addEventListener('mouseleave', (event) => {\n cardComponent.classList.remove('prevent-hover');\n });\n }\n if (cardComponent.shadowRoot.querySelector('.dialog__wrapper')) {\n const element = cardComponent.shadowRoot.querySelector('.dialog__wrapper');\n element.addEventListener('mouseenter', (event) => {\n cardComponent.classList.add('prevent-hover');\n });\n element.addEventListener('mouseleave', (event) => {\n cardComponent.classList.remove('prevent-hover');\n });\n }\n // Dispatch events of selecting checkboxes\n const checkbox = cardComponent.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.addEventListener('change', (event) => {\n if (checkbox.checked) {\n const customEvent = new CustomEvent(\"select-card\", { detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') } });\n cardComponent.dispatchEvent(customEvent);\n }\n else {\n const customEvent = new CustomEvent(\"unselect-card\", { detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') } });\n cardComponent.dispatchEvent(customEvent);\n }\n });\n }\n // Dispatch events of click onto secondary buttons\n const secondaryBtn = cardComponent.querySelector('[slot=\"secondary\"]');\n if (secondaryBtn) {\n secondaryBtn.addEventListener('click', (event) => {\n const customEvent = new CustomEvent(\"secondary-button-clicked\", { detail: { 'Title': secondaryBtn.getAttribute('title') } });\n cardComponent.dispatchEvent(customEvent);\n });\n }\n // Dispatch events of click onto action buttons\n const actionBtns = cardComponent.querySelectorAll('[slot=\"btns\"]');\n Array.from(actionBtns).forEach((button, index) => {\n button.addEventListener('click', (event) => {\n const customEvent = new CustomEvent(\"action-button-clicked\", { detail: { 'Title': button.getAttribute('title') } });\n cardComponent.dispatchEvent(customEvent);\n });\n });\n trackComponent(cardComponent, \"iam-card\", ['select-card', 'unselect-card', 'secondary-button-clicked', 'action-button-clicked']);\n });\n }\n static get observedAttributes() {\n return [\"data-image\"];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case \"data-total\": {\n if (this.shadowRoot.querySelector('.card__total'))\n this.shadowRoot.querySelector('.card__total').innerHTML = newVal;\n break;\n }\n case \"data-image\": {\n if (oldVal != newVal) {\n const cardHeadImg = this.shadowRoot.querySelector('.card__head img');\n if (cardHeadImg)\n cardHeadImg.setAttribute('src', newVal);\n }\n break;\n }\n }\n }\n}\nexport default iamCard;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","cardHTML","setupCard","cardComponent","cardHead","cardBody","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","iamCard","template","button","index","element","checkbox","customEvent","secondaryBtn","actionBtns","attrName","oldVal","newVal","cardHeadImg"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v6.0.0
2
+ * iamKey v6.1.0--beta
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */function p(l,o){var i;let t=l.querySelector(".carousel__inner"),u=l.querySelector(".carousel__controls"),n=o.querySelectorAll(":scope > .col").length;t.addEventListener("scroll",function(a){clearTimeout(i),i=setTimeout(function(){let s=t.clientWidth,e=t.scrollWidth,r=t.scrollLeft,d=Math.round(r/e*n)+1,m=o.querySelector(":scope > .col").scrollWidth,b=o.querySelector(":scope > .col:last-child").offsetLeft,f=t.scrollLeft+s+t.getBoundingClientRect().left>=b+60,h=Math.round(s/m);Math.ceil(n/h)*h-n>0&&f&&(d=Math.floor(n/h)*h+1),Array.from(l.querySelectorAll(".carousel__controls button")).forEach((_,w)=>{_.removeAttribute("aria-current")}),l.querySelector(".control-"+d).setAttribute("aria-current",!0),d==1?l.querySelector(".btn-prev").setAttribute("disabled","disabled"):l.querySelector(".btn-prev").removeAttribute("disabled"),d>n-h?l.querySelector(".btn-next").setAttribute("disabled","disabled"):l.querySelector(".btn-next").removeAttribute("disabled")},100)},!1),u.addEventListener("click",function(a){for(var s=a.target;s&&s!=this;s=s.parentNode)if(typeof s.matches=="function"&&s.matches("button")){a.preventDefault(),Array.from(u.querySelectorAll("button")).forEach((r,d)=>{r.removeAttribute("aria-current")}),s.setAttribute("aria-current",!0);const e=o.querySelector(`:scope > *:nth-child(${s.getAttribute("data-slide")})`);t.scroll({top:0,left:e.offsetLeft-t.getBoundingClientRect().left,behavior:"smooth"});break}},!1),l.addEventListener("click",function(a){let s=t.clientWidth;t.scrollWidth;let e=o.querySelector(":scope > .col").scrollWidth,r=Math.round(s/e),d=o.querySelector(":scope > .col:last-child").offsetLeft,m=t.scrollLeft+s+t.getBoundingClientRect().left>=d+60,b=Math.ceil(n/r)*r-n,f=r-b,h=m&&b>0?f*e:t.clientWidth;for(var c=a.target;c&&c!=this;c=c.parentNode)if(typeof c.matches=="function"&&c.matches(".btn-next, .btn-prev")){a.preventDefault();let _=c.classList.contains("btn-prev")?t.scrollLeft-h:t.scrollLeft+t.clientWidth;t.scroll({top:0,left:_,behavior:"smooth"});break}},!1)}window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"carousel"});class v extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const o=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",i=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${o}/css/core.min.css`,t=document.createElement("template");t.innerHTML=`
5
5
  <style>
@@ -1 +1 @@
1
- {"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","carousel.component.js"],"sourcesContent":["// @ts-nocheck\nfunction carousel(carouselElement, row) {\n var scrollTimeout;\n let carouselInner = carouselElement.querySelector('.carousel__inner');\n let carouselControls = carouselElement.querySelector('.carousel__controls');\n let itemCount = row.querySelectorAll(':scope > .col').length;\n // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n carouselInner.addEventListener('scroll', function (e) {\n clearTimeout(scrollTimeout);\n scrollTimeout = setTimeout(function () {\n let scrollArea = carouselInner.clientWidth;\n let scrollWidth = carouselInner.scrollWidth;\n let scrollLeft = carouselInner.scrollLeft;\n let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n let itemWidth = row.querySelector(':scope > .col').scrollWidth;\n let lastItemOffset = row.querySelector(':scope > .col:last-child').offsetLeft;\n //+60px here is to account for when the next offscreen slide is visible beneath the next arrow\n let lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= (lastItemOffset + 60);\n let visibleItems = Math.round(scrollArea / itemWidth);\n //Check if theres room for more slides than we have\n let leftOverSpace = (Math.ceil(itemCount / visibleItems) * visibleItems) - itemCount;\n if (leftOverSpace > 0 && lastItemInView) {\n targetSlide = (Math.floor(itemCount / visibleItems) * visibleItems) + 1;\n }\n Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button, index) => {\n button.removeAttribute('aria-current');\n });\n carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n // Disable the previous button\n if (targetSlide == 1)\n carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n // Disable the next button if the last item is in view\n if (targetSlide > (itemCount - visibleItems))\n carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n }, 100);\n }, false);\n // when the buttons are used we need to make sure the carousel scrolls to the correct place\n carouselControls.addEventListener('click', function (e) {\n for (var target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == \"function\" && target.matches('button')) {\n e.preventDefault();\n Array.from(carouselControls.querySelectorAll('button')).forEach((button, index) => {\n button.removeAttribute('aria-current');\n });\n target.setAttribute('aria-current', true);\n const el = row.querySelector(`:scope > *:nth-child(${target.getAttribute('data-slide')})`);\n carouselInner.scroll({\n top: 0,\n left: el.offsetLeft - carouselInner.getBoundingClientRect().left,\n behavior: 'smooth'\n });\n break;\n }\n }\n }, false);\n carouselElement.addEventListener('click', function (e) {\n let scrollArea = carouselInner.clientWidth;\n let scrollWidth = carouselInner.scrollWidth;\n let itemWidth = row.querySelector(':scope > .col').scrollWidth;\n let visibleItems = Math.round(scrollArea / itemWidth);\n let lastItemOffset = row.querySelector(':scope > .col:last-child').offsetLeft;\n let lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= (lastItemOffset + 60);\n //Check if theres room for more slides than we have\n let leftOverSpace = (Math.ceil(itemCount / visibleItems) * visibleItems) - itemCount;\n /*\n When the last slide isn't filled with items, we only want to move back the number of items on the slide,\n rather than the total number of possible visible items\n */\n let spacesToMove = visibleItems - leftOverSpace;\n //Only want to change the amount of movement if the last item is visible\n let movement = lastItemInView && leftOverSpace > 0 ? spacesToMove * itemWidth : carouselInner.clientWidth;\n for (var target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == \"function\" && target.matches('.btn-next, .btn-prev')) {\n e.preventDefault();\n let scrollTo = target.classList.contains('btn-prev') ? carouselInner.scrollLeft - movement : carouselInner.scrollLeft + carouselInner.clientWidth;\n carouselInner.scroll({\n top: 0,\n left: scrollTo,\n behavior: 'smooth'\n });\n break;\n }\n }\n }, false);\n}\nexport default carousel;\n","// @ts-nocheck\nimport carousel from \"../../modules/carousel.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"carousel\"\n});\nclass iamCarousel 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/carousel.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=\"carousel\" :id=\"'carousel'+id\">\n <div class=\"carousel__wrapper\">\n <div class=\"carousel__inner\">\n \n <slot></slot>\n </div>\n \n <div class=\"carousel__controls\" part=\"controls\">\n \n </div>\n\n <button class=\"btn btn-prev\" data-go=\"0\" disabled part=\"prev\">Prev</button>\n <button class=\"btn btn-next\" data-go=\"2\" part=\"next\">Next</button>\n\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const carouselElement = this.shadowRoot.querySelector('.carousel');\n const row = this.querySelector('.row');\n const thumbnailImages = JSON.parse(this.dataset.thumbnails);\n const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n let itemCount = this.querySelectorAll(':scope > .row > .col').length;\n carouselElement.setAttribute('data-row-class', row.className);\n if (this.classList.contains('hide-btns'))\n carouselElement.classList.add('hide-btns');\n if (this.classList.contains('hide-controls'))\n carouselElement.classList.add('hide-controls');\n if (thumbnailImages === null || thumbnailImages === void 0 ? void 0 : thumbnailImages.length) {\n carouselControls.classList.add('thumbnails');\n }\n // populate the pips\n let pips = \"\";\n for (let i = 1; i <= itemCount; i++) {\n let pipContent = null;\n let pipClass = '';\n if (thumbnailImages.length) {\n pipClass = 'has-thumbnail';\n pipContent = `<img src=\"${thumbnailImages[i - 1].src}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n }\n else {\n pipContent = `Slide ${i}`;\n }\n pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? \"aria-current\" : \"\"}>${pipContent}</button>`;\n }\n carouselControls.innerHTML = pips;\n carousel(carouselElement, row);\n }\n}\nexport default iamCarousel;\n"],"names":["carousel","carouselElement","row","scrollTimeout","carouselInner","carouselControls","itemCount","e","scrollArea","scrollWidth","scrollLeft","targetSlide","itemWidth","lastItemOffset","lastItemInView","visibleItems","button","index","target","el","leftOverSpace","spacesToMove","movement","scrollTo","iamCarousel","assetLocation","coreCSS","template","thumbnailImages","pips","i","pipContent","pipClass"],"mappings":"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"}
1
+ {"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","carousel.component.js"],"sourcesContent":["// @ts-nocheck\nfunction carousel(carouselElement, row) {\n var scrollTimeout;\n let carouselInner = carouselElement.querySelector('.carousel__inner');\n let carouselControls = carouselElement.querySelector('.carousel__controls');\n let itemCount = row.querySelectorAll(':scope > .col').length;\n // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n carouselInner.addEventListener('scroll', function (e) {\n clearTimeout(scrollTimeout);\n scrollTimeout = setTimeout(function () {\n let scrollArea = carouselInner.clientWidth;\n let scrollWidth = carouselInner.scrollWidth;\n let scrollLeft = carouselInner.scrollLeft;\n let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n let itemWidth = row.querySelector(':scope > .col').scrollWidth;\n let lastItemOffset = row.querySelector(':scope > .col:last-child').offsetLeft;\n //+60px here is to account for when the next offscreen slide is visible beneath the next arrow\n let lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= (lastItemOffset + 60);\n let visibleItems = Math.round(scrollArea / itemWidth);\n //Check if theres room for more slides than we have\n let leftOverSpace = (Math.ceil(itemCount / visibleItems) * visibleItems) - itemCount;\n if (leftOverSpace > 0 && lastItemInView) {\n targetSlide = (Math.floor(itemCount / visibleItems) * visibleItems) + 1;\n }\n Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button, index) => {\n button.removeAttribute('aria-current');\n });\n carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n // Disable the previous button\n if (targetSlide == 1)\n carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n // Disable the next button if the last item is in view\n if (targetSlide > (itemCount - visibleItems))\n carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n }, 100);\n }, false);\n // when the buttons are used we need to make sure the carousel scrolls to the correct place\n carouselControls.addEventListener('click', function (e) {\n for (var target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == \"function\" && target.matches('button')) {\n e.preventDefault();\n Array.from(carouselControls.querySelectorAll('button')).forEach((button, index) => {\n button.removeAttribute('aria-current');\n });\n target.setAttribute('aria-current', true);\n const el = row.querySelector(`:scope > *:nth-child(${target.getAttribute('data-slide')})`);\n carouselInner.scroll({\n top: 0,\n left: el.offsetLeft - carouselInner.getBoundingClientRect().left,\n behavior: 'smooth'\n });\n break;\n }\n }\n }, false);\n carouselElement.addEventListener('click', function (e) {\n let scrollArea = carouselInner.clientWidth;\n let scrollWidth = carouselInner.scrollWidth;\n let itemWidth = row.querySelector(':scope > .col').scrollWidth;\n let visibleItems = Math.round(scrollArea / itemWidth);\n let lastItemOffset = row.querySelector(':scope > .col:last-child').offsetLeft;\n let lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= (lastItemOffset + 60);\n //Check if theres room for more slides than we have\n let leftOverSpace = (Math.ceil(itemCount / visibleItems) * visibleItems) - itemCount;\n /*\n When the last slide isn't filled with items, we only want to move back the number of items on the slide,\n rather than the total number of possible visible items\n */\n let spacesToMove = visibleItems - leftOverSpace;\n //Only want to change the amount of movement if the last item is visible\n let movement = lastItemInView && leftOverSpace > 0 ? spacesToMove * itemWidth : carouselInner.clientWidth;\n for (var target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == \"function\" && target.matches('.btn-next, .btn-prev')) {\n e.preventDefault();\n let scrollTo = target.classList.contains('btn-prev') ? carouselInner.scrollLeft - movement : carouselInner.scrollLeft + carouselInner.clientWidth;\n carouselInner.scroll({\n top: 0,\n left: scrollTo,\n behavior: 'smooth'\n });\n break;\n }\n }\n }, false);\n}\nexport default carousel;\n","// @ts-nocheck\nimport carousel from \"../../modules/carousel.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"carousel\"\n});\nclass iamCarousel 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/carousel.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=\"carousel\" :id=\"'carousel'+id\">\n <div class=\"carousel__wrapper\">\n <div class=\"carousel__inner\">\n \n <slot></slot>\n </div>\n \n <div class=\"carousel__controls\" part=\"controls\">\n \n </div>\n\n <button class=\"btn btn-prev\" data-go=\"0\" disabled part=\"prev\">Prev</button>\n <button class=\"btn btn-next\" data-go=\"2\" part=\"next\">Next</button>\n\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const carouselElement = this.shadowRoot.querySelector('.carousel');\n const row = this.querySelector('.row');\n const thumbnailImages = JSON.parse(this.dataset.thumbnails);\n const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n let itemCount = this.querySelectorAll(':scope > .row > .col').length;\n carouselElement.setAttribute('data-row-class', row.className);\n if (this.classList.contains('hide-btns'))\n carouselElement.classList.add('hide-btns');\n if (this.classList.contains('hide-controls'))\n carouselElement.classList.add('hide-controls');\n if (thumbnailImages === null || thumbnailImages === void 0 ? void 0 : thumbnailImages.length) {\n carouselControls.classList.add('thumbnails');\n }\n // populate the pips\n let pips = \"\";\n for (let i = 1; i <= itemCount; i++) {\n let pipContent = null;\n let pipClass = '';\n if (thumbnailImages.length) {\n pipClass = 'has-thumbnail';\n pipContent = `<img src=\"${thumbnailImages[i - 1].src}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n }\n else {\n pipContent = `Slide ${i}`;\n }\n pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? \"aria-current\" : \"\"}>${pipContent}</button>`;\n }\n carouselControls.innerHTML = pips;\n carousel(carouselElement, row);\n }\n}\nexport default iamCarousel;\n"],"names":["carousel","carouselElement","row","scrollTimeout","carouselInner","carouselControls","itemCount","e","scrollArea","scrollWidth","scrollLeft","targetSlide","itemWidth","lastItemOffset","lastItemInView","visibleItems","button","index","target","el","leftOverSpace","spacesToMove","movement","scrollTo","iamCarousel","assetLocation","coreCSS","template","thumbnailImages","pips","i","pipContent","pipClass"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v6.0.0
2
+ * iamKey v6.1.0--beta
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"collapsible side menu"});class a extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",t=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,n=document.createElement("template");n.innerHTML=`
5
5
  <style class="styles">
@@ -1 +1 @@
1
- {"version":3,"file":"collapsible-side.component.min.js","sources":["collapsible-side.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"collapsible side menu\"\n});\nclass iamCollapsibleSideMenu 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/collapsible-side.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n <div class=\"container\" part=\"container\">\n\n <div class=\"side-menu\" part=\"side-menu\">\n <button class=\"btn btn-compact fa-chevron-right btn-secondary btn-sm btn-collapse\" part=\"btn\">Open or close Collapsible menu</button>\n <div class=\"side-menu-content closed\" part=\"side-menu-content\">\n <slot name=\"menu\"></slot>\n </div>\n </div>\n\n <div class=\"main-content\" part=\"main-content\">\n <slot></slot>\n </div>\n\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const sideMenu = this.shadowRoot.querySelector('.side-menu');\n const sideMenuContent = this.shadowRoot.querySelector('.side-menu-content');\n const mainContent = this.shadowRoot.querySelector('.main-content');\n const button = this.shadowRoot.querySelector('.side-menu > .btn');\n // Load external CSS if needed\n if (this.hasAttribute('data-css'))\n this.shadowRoot.querySelector('.styles').insertAdjacentHTML('beforeend', `@import \"${this.getAttribute('data-css')}\";`);\n // Set sde nav title\n if (!this.hasAttribute('data-title'))\n this.setAttribute('data-title', 'configuration');\n sideMenuContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n mainContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n if (this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)')) {\n this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)').classList.add('h4');\n this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)').classList.add('main-content__title');\n }\n if (this.hasAttribute('open') && window.innerWidth > 992) {\n sideMenu.classList.add('open');\n button.setAttribute('aria-expanded', true);\n }\n // Open the menu\n button.addEventListener('click', (event) => {\n if (!sideMenu.classList.contains('open')) {\n sideMenuContent.classList.remove('closed');\n setTimeout(function () {\n sideMenu.classList.add('open');\n button.setAttribute('aria-expanded', true);\n }, 100);\n }\n else {\n sideMenu.classList.remove('open');\n button.removeAttribute('aria-expanded');\n setTimeout(function () { sideMenuContent.classList.add('closed'); }, 1000); // Delay until its close so the animation is broken\n // While the menu is closing dont allow the hover to re-open it until its fully closed.\n sideMenu.classList.add('pe-none');\n setTimeout(function () { sideMenu.classList.remove('pe-none'); }, 1000);\n }\n });\n // Mimic hover event on desktop so that we can control when classes are set and which order\n sideMenu.addEventListener('mouseenter', (event) => {\n if (window.innerWidth > 992) {\n if (!sideMenu.classList.contains('open'))\n sideMenuContent.classList.remove('closed');\n sideMenu.classList.add('hover');\n }\n });\n sideMenu.addEventListener('mousemove', (event) => {\n if (window.innerWidth > 992) {\n if (!sideMenu.classList.contains('open'))\n sideMenuContent.classList.remove('closed');\n }\n });\n sideMenu.addEventListener('mouseleave', (event) => {\n if (window.innerWidth > 992) {\n sideMenu.classList.remove('hover');\n if (!sideMenu.classList.contains('open'))\n setTimeout(function () { sideMenuContent.classList.add('closed'); }, 1000); // Delay until its close so the animation is broken\n }\n });\n }\n}\nexport default iamCollapsibleSideMenu;\n"],"names":["iamCollapsibleSideMenu","assetLocation","coreCSS","template","sideMenu","sideMenuContent","mainContent","button","event"],"mappings":";;;IAEA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,uBACf,CAAC,EACD,MAAMA,UAA+B,WAAY,CAC7C,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;AAAA,MAkBpE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/D,CACD,mBAAoB,CAChB,MAAMC,EAAW,KAAK,WAAW,cAAc,YAAY,EACrDC,EAAkB,KAAK,WAAW,cAAc,oBAAoB,EACpEC,EAAc,KAAK,WAAW,cAAc,eAAe,EAC3DC,EAAS,KAAK,WAAW,cAAc,mBAAmB,EAE5D,KAAK,aAAa,UAAU,GAC5B,KAAK,WAAW,cAAc,SAAS,EAAE,mBAAmB,YAAa,YAAY,KAAK,aAAa,UAAU,KAAK,EAErH,KAAK,aAAa,YAAY,GAC/B,KAAK,aAAa,aAAc,eAAe,EACnDF,EAAgB,mBAAmB,aAAc,oBAAoB,KAAK,aAAa,YAAY,UAAU,EAC7GC,EAAY,mBAAmB,aAAc,oBAAoB,KAAK,aAAa,YAAY,UAAU,EACrG,KAAK,cAAc,iCAAiC,IACpD,KAAK,cAAc,iCAAiC,EAAE,UAAU,IAAI,IAAI,EACxE,KAAK,cAAc,iCAAiC,EAAE,UAAU,IAAI,qBAAqB,GAEzF,KAAK,aAAa,MAAM,GAAK,OAAO,WAAa,MACjDF,EAAS,UAAU,IAAI,MAAM,EAC7BG,EAAO,aAAa,gBAAiB,EAAI,GAG7CA,EAAO,iBAAiB,QAAUC,GAAU,CACnCJ,EAAS,UAAU,SAAS,MAAM,GAQnCA,EAAS,UAAU,OAAO,MAAM,EAChCG,EAAO,gBAAgB,eAAe,EACtC,WAAW,UAAY,CAAEF,EAAgB,UAAU,IAAI,QAAQ,GAAM,GAAI,EAEzED,EAAS,UAAU,IAAI,SAAS,EAChC,WAAW,UAAY,CAAEA,EAAS,UAAU,OAAO,SAAS,GAAM,GAAI,IAZtEC,EAAgB,UAAU,OAAO,QAAQ,EACzC,WAAW,UAAY,CACnBD,EAAS,UAAU,IAAI,MAAM,EAC7BG,EAAO,aAAa,gBAAiB,EAAI,CAC5C,EAAE,GAAG,EAUtB,CAAS,EAEDH,EAAS,iBAAiB,aAAeI,GAAU,CAC3C,OAAO,WAAa,MACfJ,EAAS,UAAU,SAAS,MAAM,GACnCC,EAAgB,UAAU,OAAO,QAAQ,EAC7CD,EAAS,UAAU,IAAI,OAAO,EAE9C,CAAS,EACDA,EAAS,iBAAiB,YAAcI,GAAU,CAC1C,OAAO,WAAa,MACfJ,EAAS,UAAU,SAAS,MAAM,GACnCC,EAAgB,UAAU,OAAO,QAAQ,EAE7D,CAAS,EACDD,EAAS,iBAAiB,aAAeI,GAAU,CAC3C,OAAO,WAAa,MACpBJ,EAAS,UAAU,OAAO,OAAO,EAC5BA,EAAS,UAAU,SAAS,MAAM,GACnC,WAAW,UAAY,CAAEC,EAAgB,UAAU,IAAI,QAAQ,GAAM,GAAI,EAE7F,CAAS,CACJ,CACL"}
1
+ {"version":3,"file":"collapsible-side.component.min.js","sources":["collapsible-side.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"collapsible side menu\"\n});\nclass iamCollapsibleSideMenu 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/collapsible-side.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n <div class=\"container\" part=\"container\">\n\n <div class=\"side-menu\" part=\"side-menu\">\n <button class=\"btn btn-compact fa-chevron-right btn-secondary btn-sm btn-collapse\" part=\"btn\">Open or close Collapsible menu</button>\n <div class=\"side-menu-content closed\" part=\"side-menu-content\">\n <slot name=\"menu\"></slot>\n </div>\n </div>\n\n <div class=\"main-content\" part=\"main-content\">\n <slot></slot>\n </div>\n\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const sideMenu = this.shadowRoot.querySelector('.side-menu');\n const sideMenuContent = this.shadowRoot.querySelector('.side-menu-content');\n const mainContent = this.shadowRoot.querySelector('.main-content');\n const button = this.shadowRoot.querySelector('.side-menu > .btn');\n // Load external CSS if needed\n if (this.hasAttribute('data-css'))\n this.shadowRoot.querySelector('.styles').insertAdjacentHTML('beforeend', `@import \"${this.getAttribute('data-css')}\";`);\n // Set sde nav title\n if (!this.hasAttribute('data-title'))\n this.setAttribute('data-title', 'configuration');\n sideMenuContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n mainContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n if (this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)')) {\n this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)').classList.add('h4');\n this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)').classList.add('main-content__title');\n }\n if (this.hasAttribute('open') && window.innerWidth > 992) {\n sideMenu.classList.add('open');\n button.setAttribute('aria-expanded', true);\n }\n // Open the menu\n button.addEventListener('click', (event) => {\n if (!sideMenu.classList.contains('open')) {\n sideMenuContent.classList.remove('closed');\n setTimeout(function () {\n sideMenu.classList.add('open');\n button.setAttribute('aria-expanded', true);\n }, 100);\n }\n else {\n sideMenu.classList.remove('open');\n button.removeAttribute('aria-expanded');\n setTimeout(function () { sideMenuContent.classList.add('closed'); }, 1000); // Delay until its close so the animation is broken\n // While the menu is closing dont allow the hover to re-open it until its fully closed.\n sideMenu.classList.add('pe-none');\n setTimeout(function () { sideMenu.classList.remove('pe-none'); }, 1000);\n }\n });\n // Mimic hover event on desktop so that we can control when classes are set and which order\n sideMenu.addEventListener('mouseenter', (event) => {\n if (window.innerWidth > 992) {\n if (!sideMenu.classList.contains('open'))\n sideMenuContent.classList.remove('closed');\n sideMenu.classList.add('hover');\n }\n });\n sideMenu.addEventListener('mousemove', (event) => {\n if (window.innerWidth > 992) {\n if (!sideMenu.classList.contains('open'))\n sideMenuContent.classList.remove('closed');\n }\n });\n sideMenu.addEventListener('mouseleave', (event) => {\n if (window.innerWidth > 992) {\n sideMenu.classList.remove('hover');\n if (!sideMenu.classList.contains('open'))\n setTimeout(function () { sideMenuContent.classList.add('closed'); }, 1000); // Delay until its close so the animation is broken\n }\n });\n }\n}\nexport default iamCollapsibleSideMenu;\n"],"names":["iamCollapsibleSideMenu","assetLocation","coreCSS","template","sideMenu","sideMenuContent","mainContent","button","event"],"mappings":";;;IAEA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,uBACf,CAAC,EACD,MAAMA,UAA+B,WAAY,CAC7C,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;AAAA,MAkBpE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAW,KAAK,WAAW,cAAc,YAAY,EACrDC,EAAkB,KAAK,WAAW,cAAc,oBAAoB,EACpEC,EAAc,KAAK,WAAW,cAAc,eAAe,EAC3DC,EAAS,KAAK,WAAW,cAAc,mBAAmB,EAE5D,KAAK,aAAa,UAAU,GAC5B,KAAK,WAAW,cAAc,SAAS,EAAE,mBAAmB,YAAa,YAAY,KAAK,aAAa,UAAU,KAAK,EAErH,KAAK,aAAa,YAAY,GAC/B,KAAK,aAAa,aAAc,eAAe,EACnDF,EAAgB,mBAAmB,aAAc,oBAAoB,KAAK,aAAa,YAAY,UAAU,EAC7GC,EAAY,mBAAmB,aAAc,oBAAoB,KAAK,aAAa,YAAY,UAAU,EACrG,KAAK,cAAc,iCAAiC,IACpD,KAAK,cAAc,iCAAiC,EAAE,UAAU,IAAI,IAAI,EACxE,KAAK,cAAc,iCAAiC,EAAE,UAAU,IAAI,qBAAqB,GAEzF,KAAK,aAAa,MAAM,GAAK,OAAO,WAAa,MACjDF,EAAS,UAAU,IAAI,MAAM,EAC7BG,EAAO,aAAa,gBAAiB,EAAI,GAG7CA,EAAO,iBAAiB,QAAUC,GAAU,CACnCJ,EAAS,UAAU,SAAS,MAAM,GAQnCA,EAAS,UAAU,OAAO,MAAM,EAChCG,EAAO,gBAAgB,eAAe,EACtC,WAAW,UAAY,CAAEF,EAAgB,UAAU,IAAI,QAAQ,GAAM,GAAI,EAEzED,EAAS,UAAU,IAAI,SAAS,EAChC,WAAW,UAAY,CAAEA,EAAS,UAAU,OAAO,SAAS,GAAM,GAAI,IAZtEC,EAAgB,UAAU,OAAO,QAAQ,EACzC,WAAW,UAAY,CACnBD,EAAS,UAAU,IAAI,MAAM,EAC7BG,EAAO,aAAa,gBAAiB,EAAI,CAC5C,EAAE,GAAG,EAUtB,CAAS,EAEDH,EAAS,iBAAiB,aAAeI,GAAU,CAC3C,OAAO,WAAa,MACfJ,EAAS,UAAU,SAAS,MAAM,GACnCC,EAAgB,UAAU,OAAO,QAAQ,EAC7CD,EAAS,UAAU,IAAI,OAAO,EAE9C,CAAS,EACDA,EAAS,iBAAiB,YAAcI,GAAU,CAC1C,OAAO,WAAa,MACfJ,EAAS,UAAU,SAAS,MAAM,GACnCC,EAAgB,UAAU,OAAO,QAAQ,EAE7D,CAAS,EACDD,EAAS,iBAAiB,aAAeI,GAAU,CAC3C,OAAO,WAAa,MACpBJ,EAAS,UAAU,OAAO,OAAO,EAC5BA,EAAS,UAAU,SAAS,MAAM,GACnC,WAAW,UAAY,CAAEC,EAAgB,UAAU,IAAI,QAAQ,GAAM,GAAI,EAE7F,CAAS,CACL,CACJ"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v6.0.0
2
+ * iamKey v6.1.0--beta
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */function v(d,s){const n=s.querySelector(".files"),i=s.querySelector(".drop-area"),e=d.querySelector("input"),f=d.hasAttribute("data-maxsize")?d.getAttribute("data-maxsize"):0,u=s.querySelector(".invalid-feedback.size"),h=s.querySelector(".invalid-feedback.ext"),o=e.cloneNode();i.append(o);let b=function(t){if(!e.hasAttribute("accept"))return!0;const r=t.split(".").pop();return!!e.getAttribute("accept").includes(r)};if(s.addEventListener("click",t=>{t&&t.target instanceof HTMLElement&&t.target.closest(".btn-primary")&&(t.target.closest(".btn-primary"),h.classList.remove("d-block"),u.classList.remove("d-block"),(e.hasAttribute("multiple")?o:e).click())}),s.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest(".files button")){const r=new DataTransfer,{files:a}=e,m=t.target.closest(".files button");for(let p=0;p<a.length;p++){const l=a[p];l.name!=m.getAttribute("data-file")&&r.items.add(l)}e.files=r.files;const c=new Event("change");e.dispatchEvent(c)}}),o.addEventListener("change",t=>{if(e.hasAttribute("multiple")){const a=[...e.files,...o.files];let m=[];const c=new DataTransfer;for(let p=0;p<a.length;p++){const l=a[p],g=l.size/1e3;!m.includes(l.name)&&(f==0||g<f)&&b(l.name)&&c.items.add(l),b(l.name)||h.classList.add("d-block"),g>f&&u.classList.add("d-block"),m.push(l.name)}e.files=c.files}else e.files=o.files;const r=new Event("change");e.dispatchEvent(r)}),o.addEventListener("dragenter",t=>{o.classList.add("focus")}),o.addEventListener("dragleave",t=>{o.classList.remove("focus")}),o.addEventListener("drop",t=>{o.classList.remove("focus")}),e.addEventListener("change",t=>{if(e.files.length==1){let a=e.files[0];const m=a.size/1e3;if(!b(a.name)){h.classList.add("d-block");const c=new DataTransfer;e.files=c.files}if(m>f){u.classList.add("d-block");const c=new DataTransfer;e.files=c.files}}n.innerHTML="";for(const a of e.files)n.innerHTML+=`<span class="file" part="file">${a.name} <button data-file="${a.name}">Remove</button></span>`;const r=new CustomEvent("elementchange",{detail:{files:e.files}});if(d.dispatchEvent(r),e.files.length==0){const a=new CustomEvent("empty");d.dispatchEvent(a)}}),d.hasAttribute("data-filename")){let t=d.getAttribute("data-filename");t&&(n.innerHTML=`<span class="file">${t} <button data-file="${t}">Remove</button></span>`)}}window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"fileupload"});class y extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const s=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"):`${s}/css/core.min.css`,i=document.createElement("template");i.innerHTML=`
5
5
  <style>
@@ -1 +1 @@
1
- {"version":3,"file":"fileupload.component.min.js","sources":["../../modules/fileupload.js","fileupload.component.js"],"sourcesContent":["// @ts-nocheck\nfunction fileupload(fileupload, wrapper) {\n const filesWrapper = wrapper.querySelector('.files');\n const dropArea = wrapper.querySelector('.drop-area');\n const input = fileupload.querySelector('input');\n const maxSize = fileupload.hasAttribute('data-maxsize') ? fileupload.getAttribute('data-maxsize') : 0;\n const errorMsgSize = wrapper.querySelector('.invalid-feedback.size');\n const errorMsgExt = wrapper.querySelector('.invalid-feedback.ext');\n // We clone the input field to work as a buffer input field, this allows us to add new files without losing the old ones\n const cloneInput = input.cloneNode();\n dropArea.append(cloneInput);\n let checkFileExt = function (filename) {\n if (!input.hasAttribute('accept'))\n return true;\n const nameExtension = filename.split('.').pop();\n const acceptedTypes = input.getAttribute('accept');\n if (acceptedTypes.includes(nameExtension))\n return true;\n return false;\n };\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.btn-primary')) {\n const button = event.target.closest('.btn-primary');\n // If the input allows multiples then use the buffer clone input\n errorMsgExt.classList.remove('d-block');\n errorMsgSize.classList.remove('d-block');\n const inputTrigger = input.hasAttribute('multiple') ? cloneInput : input;\n inputTrigger.click();\n }\n });\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.files button')) {\n const dt = new DataTransfer();\n const { files } = input;\n const button = event.target.closest('.files button');\n for (let i = 0; i < files.length; i++) {\n const file = files[i];\n if (file.name != button.getAttribute('data-file'))\n dt.items.add(file); // here you exclude the file. thus removing it.\n }\n input.files = dt.files; // Assign the updates list\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n }\n });\n // Buffer input change event\n cloneInput.addEventListener('change', (event) => {\n if (input.hasAttribute('multiple')) {\n const filesArray = [...input.files, ...cloneInput.files];\n let fileNames = [];\n const dt = new DataTransfer();\n for (let i = 0; i < filesArray.length; i++) {\n const file = filesArray[i];\n const size = file.size / 1000;\n if (!fileNames.includes(file.name) && (maxSize == 0 || size < maxSize) && checkFileExt(file.name))\n dt.items.add(file); // here you exclude the file. thus removing it.\n if (!checkFileExt(file.name)) {\n errorMsgExt.classList.add('d-block');\n }\n if (size > maxSize) {\n errorMsgSize.classList.add('d-block');\n }\n fileNames.push(file.name);\n }\n input.files = dt.files;\n }\n else {\n input.files = cloneInput.files;\n }\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n });\n cloneInput.addEventListener('dragenter', (event) => {\n cloneInput.classList.add('focus');\n });\n cloneInput.addEventListener('dragleave', (event) => {\n cloneInput.classList.remove('focus');\n });\n cloneInput.addEventListener('drop', (event) => {\n cloneInput.classList.remove('focus');\n });\n input.addEventListener('change', (event) => {\n if (input.files.length == 1) {\n let file = input.files[0];\n const size = file.size / 1000;\n if (!checkFileExt(file.name)) {\n errorMsgExt.classList.add('d-block');\n const dt = new DataTransfer();\n input.files = dt.files;\n }\n if (size > maxSize) {\n errorMsgSize.classList.add('d-block');\n const dt = new DataTransfer();\n input.files = dt.files;\n }\n }\n // Reset\n filesWrapper.innerHTML = '';\n for (const file of input.files) {\n filesWrapper.innerHTML += `<span class=\"file\" part=\"file\">${file.name} <button data-file=\"${file.name}\">Remove</button></span>`;\n }\n const elementChangeEvent = new CustomEvent('elementchange', { detail: { \"files\": input.files } });\n fileupload.dispatchEvent(elementChangeEvent);\n if (input.files.length == 0) {\n const emptyEvent = new CustomEvent('empty');\n fileupload.dispatchEvent(emptyEvent);\n }\n });\n if (fileupload.hasAttribute('data-filename')) {\n let filename = fileupload.getAttribute('data-filename');\n if (filename)\n filesWrapper.innerHTML = `<span class=\"file\">${filename} <button data-file=\"${filename}\">Remove</button></span>`;\n }\n}\nexport default fileupload;\n","// @ts-nocheck\nimport fileupload from \"../../modules/fileupload.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"fileupload\"\n});\nclass iamFileupload 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/fileupload.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=\"file-upload\">\n <span class=\"file-upload__title\" part=\"title\">Upload file</span>\n <p class=\"helper-text\"><slot name=\"helper\"></slot></p>\n <button class=\"btn btn-primary\" type=\"button\" part=\"button\"><slot name=\"btn\"></slot> Upload ${this.hasAttribute('data-filetype') ? this.getAttribute('data-filetype') : 'file'}</button>\n <div class=\"drop-area\"></div>\n <hr/>\n <slot></slot>\n <div class=\"files\" part=\"files\"><slot name=\"files\"></slot></div>\n <span class=\"invalid-feedback ext\">Some files did not match the accpeted extension type.</span>\n <span class=\"invalid-feedback size\">Some files Were too large to upload.</span>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.innerHTML += '<i class=\"fa-regular fa-arrow-up-from-bracket me-2\" aria-hidden=\"true\" slot=\"btn\"></i>';\n const wrapper = this.shadowRoot.querySelector('.file-upload');\n const input = this.querySelector('input');\n const helperText = this.shadowRoot.querySelector('.helper-text');\n if (!this.querySelector('[slot=\"helper\"]'))\n helperText.innerHTML = `${this.hasAttribute('data-maxsize') ? `Max file size is ${this.getAttribute('data-maxsize')}kb. ` : ''}${input.hasAttribute('accept') ? `Supported file types are ${input.getAttribute('accept')}` : ''}`;\n fileupload(this, wrapper);\n }\n static get observedAttributes() {\n return [\"data-filename\"];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case \"data-filename\": {\n if (oldVal != newVal) {\n const filesWrapper = this.shadowRoot.querySelector('.files');\n if (newVal != null && newVal != 'null' && newVal != '')\n filesWrapper.innerHTML = `<span class=\"file\">${newVal} <button data-file=\"${newVal}\">Remove</button></span>`;\n }\n break;\n }\n }\n }\n}\nexport default iamFileupload;\n"],"names":["fileupload","wrapper","filesWrapper","dropArea","input","maxSize","errorMsgSize","errorMsgExt","cloneInput","checkFileExt","filename","nameExtension","event","dt","files","button","i","file","changeEvent","filesArray","fileNames","size","elementChangeEvent","emptyEvent","iamFileupload","assetLocation","coreCSS","template","helperText","attrName","oldVal","newVal"],"mappings":"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"}
1
+ {"version":3,"file":"fileupload.component.min.js","sources":["../../modules/fileupload.js","fileupload.component.js"],"sourcesContent":["// @ts-nocheck\nfunction fileupload(fileupload, wrapper) {\n const filesWrapper = wrapper.querySelector('.files');\n const dropArea = wrapper.querySelector('.drop-area');\n const input = fileupload.querySelector('input');\n const maxSize = fileupload.hasAttribute('data-maxsize') ? fileupload.getAttribute('data-maxsize') : 0;\n const errorMsgSize = wrapper.querySelector('.invalid-feedback.size');\n const errorMsgExt = wrapper.querySelector('.invalid-feedback.ext');\n // We clone the input field to work as a buffer input field, this allows us to add new files without losing the old ones\n const cloneInput = input.cloneNode();\n dropArea.append(cloneInput);\n let checkFileExt = function (filename) {\n if (!input.hasAttribute('accept'))\n return true;\n const nameExtension = filename.split('.').pop();\n const acceptedTypes = input.getAttribute('accept');\n if (acceptedTypes.includes(nameExtension))\n return true;\n return false;\n };\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.btn-primary')) {\n const button = event.target.closest('.btn-primary');\n // If the input allows multiples then use the buffer clone input\n errorMsgExt.classList.remove('d-block');\n errorMsgSize.classList.remove('d-block');\n const inputTrigger = input.hasAttribute('multiple') ? cloneInput : input;\n inputTrigger.click();\n }\n });\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.files button')) {\n const dt = new DataTransfer();\n const { files } = input;\n const button = event.target.closest('.files button');\n for (let i = 0; i < files.length; i++) {\n const file = files[i];\n if (file.name != button.getAttribute('data-file'))\n dt.items.add(file); // here you exclude the file. thus removing it.\n }\n input.files = dt.files; // Assign the updates list\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n }\n });\n // Buffer input change event\n cloneInput.addEventListener('change', (event) => {\n if (input.hasAttribute('multiple')) {\n const filesArray = [...input.files, ...cloneInput.files];\n let fileNames = [];\n const dt = new DataTransfer();\n for (let i = 0; i < filesArray.length; i++) {\n const file = filesArray[i];\n const size = file.size / 1000;\n if (!fileNames.includes(file.name) && (maxSize == 0 || size < maxSize) && checkFileExt(file.name))\n dt.items.add(file); // here you exclude the file. thus removing it.\n if (!checkFileExt(file.name)) {\n errorMsgExt.classList.add('d-block');\n }\n if (size > maxSize) {\n errorMsgSize.classList.add('d-block');\n }\n fileNames.push(file.name);\n }\n input.files = dt.files;\n }\n else {\n input.files = cloneInput.files;\n }\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n });\n cloneInput.addEventListener('dragenter', (event) => {\n cloneInput.classList.add('focus');\n });\n cloneInput.addEventListener('dragleave', (event) => {\n cloneInput.classList.remove('focus');\n });\n cloneInput.addEventListener('drop', (event) => {\n cloneInput.classList.remove('focus');\n });\n input.addEventListener('change', (event) => {\n if (input.files.length == 1) {\n let file = input.files[0];\n const size = file.size / 1000;\n if (!checkFileExt(file.name)) {\n errorMsgExt.classList.add('d-block');\n const dt = new DataTransfer();\n input.files = dt.files;\n }\n if (size > maxSize) {\n errorMsgSize.classList.add('d-block');\n const dt = new DataTransfer();\n input.files = dt.files;\n }\n }\n // Reset\n filesWrapper.innerHTML = '';\n for (const file of input.files) {\n filesWrapper.innerHTML += `<span class=\"file\" part=\"file\">${file.name} <button data-file=\"${file.name}\">Remove</button></span>`;\n }\n const elementChangeEvent = new CustomEvent('elementchange', { detail: { \"files\": input.files } });\n fileupload.dispatchEvent(elementChangeEvent);\n if (input.files.length == 0) {\n const emptyEvent = new CustomEvent('empty');\n fileupload.dispatchEvent(emptyEvent);\n }\n });\n if (fileupload.hasAttribute('data-filename')) {\n let filename = fileupload.getAttribute('data-filename');\n if (filename)\n filesWrapper.innerHTML = `<span class=\"file\">${filename} <button data-file=\"${filename}\">Remove</button></span>`;\n }\n}\nexport default fileupload;\n","// @ts-nocheck\nimport fileupload from \"../../modules/fileupload.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"fileupload\"\n});\nclass iamFileupload 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/fileupload.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=\"file-upload\">\n <span class=\"file-upload__title\" part=\"title\">Upload file</span>\n <p class=\"helper-text\"><slot name=\"helper\"></slot></p>\n <button class=\"btn btn-primary\" type=\"button\" part=\"button\"><slot name=\"btn\"></slot> Upload ${this.hasAttribute('data-filetype') ? this.getAttribute('data-filetype') : 'file'}</button>\n <div class=\"drop-area\"></div>\n <hr/>\n <slot></slot>\n <div class=\"files\" part=\"files\"><slot name=\"files\"></slot></div>\n <span class=\"invalid-feedback ext\">Some files did not match the accpeted extension type.</span>\n <span class=\"invalid-feedback size\">Some files Were too large to upload.</span>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.innerHTML += '<i class=\"fa-regular fa-arrow-up-from-bracket me-2\" aria-hidden=\"true\" slot=\"btn\"></i>';\n const wrapper = this.shadowRoot.querySelector('.file-upload');\n const input = this.querySelector('input');\n const helperText = this.shadowRoot.querySelector('.helper-text');\n if (!this.querySelector('[slot=\"helper\"]'))\n helperText.innerHTML = `${this.hasAttribute('data-maxsize') ? `Max file size is ${this.getAttribute('data-maxsize')}kb. ` : ''}${input.hasAttribute('accept') ? `Supported file types are ${input.getAttribute('accept')}` : ''}`;\n fileupload(this, wrapper);\n }\n static get observedAttributes() {\n return [\"data-filename\"];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case \"data-filename\": {\n if (oldVal != newVal) {\n const filesWrapper = this.shadowRoot.querySelector('.files');\n if (newVal != null && newVal != 'null' && newVal != '')\n filesWrapper.innerHTML = `<span class=\"file\">${newVal} <button data-file=\"${newVal}\">Remove</button></span>`;\n }\n break;\n }\n }\n }\n}\nexport default iamFileupload;\n"],"names":["fileupload","wrapper","filesWrapper","dropArea","input","maxSize","errorMsgSize","errorMsgExt","cloneInput","checkFileExt","filename","nameExtension","event","dt","files","button","i","file","changeEvent","filesArray","fileNames","size","elementChangeEvent","emptyEvent","iamFileupload","assetLocation","coreCSS","template","helperText","attrName","oldVal","newVal"],"mappings":"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"}
@@ -0,0 +1,71 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ // @ts-nocheck
11
+ import { trackComponent, trackComponentRegistered } from "../_global.js";
12
+ import { cardHTML, setupCard } from "../../modules/card.module.js";
13
+ trackComponentRegistered("iam-filter-card");
14
+ class iamFilerCard extends HTMLElement {
15
+ constructor() {
16
+ super();
17
+ this.attachShadow({ mode: 'open' });
18
+ const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';
19
+ const loadCSS = `@import "${assetLocation}/css/components/filter-card.component.css";`;
20
+ const template = document.createElement('template');
21
+ template.innerHTML = `
22
+ <style>
23
+ ${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
24
+
25
+ ${loadCSS}
26
+ </style>
27
+ ${cardHTML}
28
+ `;
29
+ this.shadowRoot.appendChild(template.content.cloneNode(true));
30
+ }
31
+ connectedCallback() {
32
+ return __awaiter(this, void 0, void 0, function* () {
33
+ const cardComponent = this;
34
+ const cardHead = cardComponent.shadowRoot.querySelector('.card__head');
35
+ setupCard(cardComponent);
36
+ // Dispatch events of selecting checkboxes
37
+ const checkbox = cardComponent.parentElement.querySelector('input[type="checkbox"]');
38
+ if (checkbox) {
39
+ checkbox.addEventListener('change', (event) => {
40
+ if (checkbox.checked) {
41
+ const customEvent = new CustomEvent("select-card", { detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') } });
42
+ cardComponent.dispatchEvent(customEvent);
43
+ cardComponent.classList.add('active');
44
+ }
45
+ else {
46
+ const customEvent = new CustomEvent("unselect-card", { detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') } });
47
+ cardComponent.dispatchEvent(customEvent);
48
+ cardComponent.classList.remove('active');
49
+ }
50
+ });
51
+ }
52
+ if (cardComponent.parentElement.matches('button')) {
53
+ const button = cardComponent.parentElement;
54
+ button.addEventListener('click', (event) => {
55
+ if (!cardComponent.classList.contains('active')) {
56
+ const customEvent = new CustomEvent("select-card", { detail: { 'button name': button.getAttribute('name') } });
57
+ cardComponent.dispatchEvent(customEvent);
58
+ cardComponent.classList.add('active');
59
+ }
60
+ else {
61
+ const customEvent = new CustomEvent("unselect-card", { detail: { 'button name': button.getAttribute('name') } });
62
+ cardComponent.dispatchEvent(customEvent);
63
+ cardComponent.classList.remove('active');
64
+ }
65
+ });
66
+ }
67
+ trackComponent(cardComponent, "iam-filter-card", ['select-card', 'unselect-card']);
68
+ });
69
+ }
70
+ }
71
+ export default iamFilerCard;
@@ -0,0 +1,27 @@
1
+ /*!
2
+ * iamKey v6.1.0--beta
3
+ * Copyright 2022-2024 iamproperty
4
+ */const h=e=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:e})},p=(e,t,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:t}),a.forEach(o=>{e.addEventListener(o,function(i){let r={event:o,element:t,target:i.target};Object.keys(i.detail).forEach(d=>{const s=i.detail[d];r[d]=s}),window.dataLayer.push(r)})}),!0),g=`<div class="card__head" part="head">
5
+ <slot name="head"></slot>
6
+ </div>
7
+ <div class="card__badges"><slot name="badges"></slot></div>
8
+ <slot name="checkbox" class="activate-prevent-hover"></slot>
9
+ <div class="card__body" part="body">
10
+ <slot></slot>
11
+ <slot name="secondary" part="secondary"></slot>
12
+ </div>
13
+ <div class="card__details" part="details">
14
+ <slot name="details"></slot>
15
+ </div>
16
+ <div class="card__footer" part="footer">
17
+ <slot name="footer"></slot>
18
+ </div>`,u=e=>{e.classList.add("card");const t=e.shadowRoot.querySelector(".card__head"),a=e.shadowRoot.querySelector(".card__body");e.hasAttribute("data-image")&&(t.innerHTML+=`<img src="${e.getAttribute("data-image")}" alt="" loading="lazy" part="image" />`),e.hasAttribute("data-total")?a.insertAdjacentHTML("beforeend",`<div class="card__total">${e.getAttribute("data-total")}</div>`):e.querySelector('[slot="total-icon"]')&&a.insertAdjacentHTML("beforeend",'<div class="card__total"><slot name="total-icon"></slot></div>'),e.querySelector('[slot="badges"]')||e.shadowRoot.querySelector(".card__badges").remove()};var f=function(e,t,a,o){function i(r){return r instanceof a?r:new a(function(d){d(r)})}return new(a||(a=Promise))(function(r,d){function s(n){try{c(o.next(n))}catch(l){d(l)}}function m(n){try{c(o.throw(n))}catch(l){d(l)}}function c(n){n.done?r(n.value):i(n.value).then(s,m)}c((o=o.apply(e,t||[])).next())})};h("iam-filter-card");class v extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
19
+ <style>
20
+ ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
21
+
22
+ :host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 6 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges{padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}:host{--top-padding: 1.5rem;--right-padding: 1rem;--bottom-padding: 1.5rem;--left-padding: 1rem}:host:has(.card__total) .card__body{align-items:center;display:flex}:host:before,:host:after{display:none}:host.card--has-icon{--bottom-padding: 1rem;border:none}:host .icon{font-size:1.125rem !important;height:1.125rem !important;margin:0 0 .5rem 0 !important;font-weight:400 !important;display:block !important}:host .card__total{margin-top:0;order:-1}:host(:is(:hover,:focus,.hover)){outline:none}:host(:is(:hover,:focus,.hover)) :is(.card__body,.card__footer){background:#eee}:host-context(:is(:checked,.checked)),:host(:is(:active,.active)){outline:2px solid var(--colour, var(--colour-primary));outline-offset:-2px}:host-context(:is(:checked,.checked)) .card__body,:host(:is(:active,.active)) .card__body{background:none}:host-context(:is(:checked,.checked)) .card__footer,:host(:is(:active,.active)) .card__footer{background:none}::slotted(i){display:block !important;font-size:1.125rem !important;margin:0 0 .5rem 0 !important}:host(.card--flag){position:relative}:host(.card--flag):after{content:var(--card-flag-icon, "\\f024");font-family:"Font Awesome 6 Pro";position:absolute;top:1rem;right:1rem;font-size:1rem;line-height:1;height:1rem;width:1rem;display:inline-block;font-weight:normal;color:var(--colour, var(--colour-primary))}.card__body:has(.card__total){--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;display:flex;align-items:center}.card__total{order:-1}/*# sourceMappingURL=assets/css/components/filter-card.component.css.map */
23
+
24
+ </style>
25
+ ${g}
26
+ `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){return f(this,void 0,void 0,function*(){const t=this;t.shadowRoot.querySelector(".card__head"),u(t);const a=t.parentElement.querySelector('input[type="checkbox"]');if(a&&a.addEventListener("change",o=>{if(a.checked){const i=new CustomEvent("select-card",{detail:{"Card value":a.value,"input name":a.getAttribute("name")}});t.dispatchEvent(i),t.classList.add("active")}else{const i=new CustomEvent("unselect-card",{detail:{"Card value":a.value,"input name":a.getAttribute("name")}});t.dispatchEvent(i),t.classList.remove("active")}}),t.parentElement.matches("button")){const o=t.parentElement;o.addEventListener("click",i=>{if(t.classList.contains("active")){const r=new CustomEvent("unselect-card",{detail:{"button name":o.getAttribute("name")}});t.dispatchEvent(r),t.classList.remove("active")}else{const r=new CustomEvent("select-card",{detail:{"button name":o.getAttribute("name")}});t.dispatchEvent(r),t.classList.add("active")}})}p(t,"iam-filter-card",["select-card","unselect-card"])})}}export{v as default};
27
+ //# sourceMappingURL=filter-card.component.min.js.map