@iamproperty/components 5.6.0 → 5.6.1-beta10

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 (106) hide show
  1. package/assets/css/components/card.css +1 -1
  2. package/assets/css/components/card.css.map +1 -1
  3. package/assets/css/components/collapsible-side.css +1 -1
  4. package/assets/css/components/collapsible-side.css.map +1 -1
  5. package/assets/css/components/fileupload.css +1 -1
  6. package/assets/css/components/fileupload.css.map +1 -1
  7. package/assets/css/components/inline-edit.preload.css +1 -1
  8. package/assets/css/components/inline-edit.preload.css.map +1 -1
  9. package/assets/css/components/multiselect.css +1 -1
  10. package/assets/css/components/multiselect.css.map +1 -1
  11. package/assets/css/components/table.global.css +1 -1
  12. package/assets/css/components/table.global.css.map +1 -1
  13. package/assets/css/components/tabs.css +1 -1
  14. package/assets/css/components/tabs.css.map +1 -1
  15. package/assets/css/core.min.css +1 -1
  16. package/assets/css/core.min.css.map +1 -1
  17. package/assets/css/style.min.css +1 -1
  18. package/assets/css/style.min.css.map +1 -1
  19. package/assets/js/components/accordion/accordion.component.min.js +1 -1
  20. package/assets/js/components/actionbar/actionbar.component.js +7 -7
  21. package/assets/js/components/actionbar/actionbar.component.min.js +10 -10
  22. package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
  23. package/assets/js/components/address-lookup/address-lookup.component.js +3 -3
  24. package/assets/js/components/address-lookup/address-lookup.component.min.js +6 -6
  25. package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
  26. package/assets/js/components/applied-filters/applied-filters.component.min.js +1 -1
  27. package/assets/js/components/card/card.component.js +5 -4
  28. package/assets/js/components/card/card.component.min.js +9 -9
  29. package/assets/js/components/card/card.component.min.js.map +1 -1
  30. package/assets/js/components/carousel/carousel.component.js +3 -3
  31. package/assets/js/components/carousel/carousel.component.min.js +5 -5
  32. package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
  33. package/assets/js/components/collapsible-side/collapsible-side.component.js +14 -10
  34. package/assets/js/components/collapsible-side/collapsible-side.component.min.js +14 -14
  35. package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
  36. package/assets/js/components/fileupload/fileupload.component.js +3 -3
  37. package/assets/js/components/fileupload/fileupload.component.min.js +8 -8
  38. package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -1
  39. package/assets/js/components/filterlist/filterlist.component.js +2 -2
  40. package/assets/js/components/filterlist/filterlist.component.min.js +5 -5
  41. package/assets/js/components/filterlist/filterlist.component.min.js.map +1 -1
  42. package/assets/js/components/header/header.component.min.js +1 -1
  43. package/assets/js/components/inline-edit/inline-edit.component.js +11 -3
  44. package/assets/js/components/inline-edit/inline-edit.component.min.js +7 -7
  45. package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
  46. package/assets/js/components/marketing/marketing.component.min.js +1 -1
  47. package/assets/js/components/multiselect/multiselect.component.js +4 -3
  48. package/assets/js/components/multiselect/multiselect.component.min.js +6 -6
  49. package/assets/js/components/multiselect/multiselect.component.min.js.map +1 -1
  50. package/assets/js/components/nav/nav.component.min.js +1 -1
  51. package/assets/js/components/notification/notification.component.js +1 -1
  52. package/assets/js/components/notification/notification.component.min.js +2 -2
  53. package/assets/js/components/notification/notification.component.min.js.map +1 -1
  54. package/assets/js/components/pagination/pagination.component.min.js +1 -1
  55. package/assets/js/components/search/search.component.min.js +1 -1
  56. package/assets/js/components/search/search.component.min.js.map +1 -1
  57. package/assets/js/components/slider/slider.component.min.js +1 -1
  58. package/assets/js/components/table/table.component.min.js +5 -5
  59. package/assets/js/components/table/table.component.min.js.map +1 -1
  60. package/assets/js/components/tabs/tabs.component.min.js +2 -2
  61. package/assets/js/dynamic.min.js +5 -5
  62. package/assets/js/dynamic.min.js.map +1 -1
  63. package/assets/js/modules/dialogs.js +10 -5
  64. package/assets/js/modules/dynamicEvents.js +3 -0
  65. package/assets/js/modules/fileupload.js +2 -9
  66. package/assets/js/modules/helpers.js +4 -0
  67. package/assets/js/scripts.bundle.js +17 -17
  68. package/assets/js/scripts.bundle.js.map +1 -1
  69. package/assets/js/scripts.bundle.min.js +2 -2
  70. package/assets/js/scripts.bundle.min.js.map +1 -1
  71. package/assets/sass/_components.scss +47 -0
  72. package/assets/sass/_functions/variables.scss +1 -1
  73. package/assets/sass/components/card.scss +88 -1
  74. package/assets/sass/components/collapsible-side.scss +63 -48
  75. package/assets/sass/components/fileupload.scss +1 -0
  76. package/assets/sass/components/inline-edit.preload.scss +57 -3
  77. package/assets/sass/components/multiselect.scss +5 -1
  78. package/assets/sass/components/table.global.scss +4 -19
  79. package/assets/sass/components/tabs.scss +1 -6
  80. package/assets/sass/elements/buttons.scss +1 -1
  81. package/assets/sass/elements/dialog.scss +29 -1
  82. package/assets/sass/elements/forms.scss +40 -9
  83. package/assets/sass/elements/progress.scss +159 -17
  84. package/assets/sass/foundations/reboot.scss +3 -3
  85. package/assets/sass/foundations/root.scss +2 -2
  86. package/assets/ts/components/actionbar/actionbar.component.ts +7 -7
  87. package/assets/ts/components/address-lookup/address-lookup.component.ts +3 -3
  88. package/assets/ts/components/card/card.component.ts +6 -4
  89. package/assets/ts/components/carousel/carousel.component.ts +3 -3
  90. package/assets/ts/components/collapsible-side/collapsible-side.component.ts +17 -11
  91. package/assets/ts/components/fileupload/fileupload.component.ts +3 -3
  92. package/assets/ts/components/filterlist/filterlist.component.ts +2 -2
  93. package/assets/ts/components/inline-edit/inline-edit.component.ts +15 -4
  94. package/assets/ts/components/multiselect/multiselect.component.ts +4 -3
  95. package/assets/ts/components/notification/notification.component.ts +1 -1
  96. package/assets/ts/modules/dialogs.ts +13 -5
  97. package/assets/ts/modules/dynamicEvents.ts +3 -0
  98. package/assets/ts/modules/fileupload.ts +3 -14
  99. package/assets/ts/modules/helpers.ts +6 -0
  100. package/dist/components.es.js +550 -621
  101. package/dist/components.umd.js +86 -86
  102. package/dist/style.css +1 -1
  103. package/package.json +4 -4
  104. package/src/components/Card/README.md +1 -0
  105. package/src/components/CollapsibleSideMenu/CollapsibleSideMenu.vue +1 -1
  106. package/src/components/FileUpload/FileUpload.vue +29 -6
@@ -35,9 +35,9 @@ class iamFilterlist extends HTMLElement {
35
35
  <div class="form-control__wrapper">
36
36
  <label for="search" class="visually-hidden">Search</label>
37
37
  <span class="suffix" role="presentation"><slot name="icon"></slot></span>
38
- <input name="search" id="search" type="text" class="form-control" autocomplete="off" placeholder="Search" />
38
+ <input name="search" id="search" type="text" class="form-control" autocomplete="off" placeholder="Search" part="search-input" />
39
39
  </div>
40
- <div class="list__wrapper">
40
+ <div class="list__wrapper" part="wrapper">
41
41
  <slot></slot>
42
42
  </div>
43
43
  `;
@@ -1,7 +1,7 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
- */function r(s,t){n(s,t)}function n(s,t){var e;t.addEventListener("keyup",a=>{clearTimeout(e),e=setTimeout(function(){o(s,t.value)},500)}),t.addEventListener("change",a=>{clearTimeout(e),o(s,t.value)})}const o=function(s,t){Array.from(s.querySelectorAll(":scope > li")).forEach((e,a)=>{let i=e.textContent.toLowerCase();e.classList.add("d-none"),i.includes(t.toLowerCase())&&e.classList.remove("d-none")}),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Filtered list",value:t})};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"filterlist"});class l extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
4
+ */function i(s,t){n(s,t)}function n(s,t){var e;t.addEventListener("keyup",a=>{clearTimeout(e),e=setTimeout(function(){o(s,t.value)},500)}),t.addEventListener("change",a=>{clearTimeout(e),o(s,t.value)})}const o=function(s,t){Array.from(s.querySelectorAll(":scope > li")).forEach((e,a)=>{let r=e.textContent.toLowerCase();e.classList.add("d-none"),r.includes(t.toLowerCase())&&e.classList.remove("d-none")}),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Filtered list",value:t})};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"filterlist"});class l extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
5
5
  <style>
6
6
  @import "${e}";
7
7
  ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
@@ -23,10 +23,10 @@
23
23
  <div class="form-control__wrapper">
24
24
  <label for="search" class="visually-hidden">Search</label>
25
25
  <span class="suffix" role="presentation"><slot name="icon"></slot></span>
26
- <input name="search" id="search" type="text" class="form-control" autocomplete="off" placeholder="Search" />
26
+ <input name="search" id="search" type="text" class="form-control" autocomplete="off" placeholder="Search" part="search-input" />
27
27
  </div>
28
- <div class="list__wrapper">
28
+ <div class="list__wrapper" part="wrapper">
29
29
  <slot></slot>
30
30
  </div>
31
- `,this.shadowRoot.appendChild(a.content.cloneNode(!0))}connectedCallback(){let t=this.classList.toString();this.shadowRoot.querySelector(".list__wrapper").setAttribute("class",`list__wrapper ${t}`),this.querySelector("i.fa-search")||(this.innerHTML+='<i class="fa fa-light fa-search" aria-hidden="true" slot="icon"></i>'),r(this.querySelector("ul"),this.shadowRoot.querySelector("#search"))}}export{l as default};
31
+ `,this.shadowRoot.appendChild(a.content.cloneNode(!0))}connectedCallback(){let t=this.classList.toString();this.shadowRoot.querySelector(".list__wrapper").setAttribute("class",`list__wrapper ${t}`),this.querySelector("i.fa-search")||(this.innerHTML+='<i class="fa fa-light fa-search" aria-hidden="true" slot="icon"></i>'),i(this.querySelector("ul"),this.shadowRoot.querySelector("#search"))}}export{l as default};
32
32
  //# sourceMappingURL=filterlist.component.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"filterlist.component.min.js","sources":["../../modules/filterlist.js","filterlist.component.js"],"sourcesContent":["// @ts-nocheck\nfunction filterlist(list, input) {\n addFilterlistEventListeners(list, input);\n}\nfunction addFilterlistEventListeners(list, input) {\n var timer;\n input.addEventListener('keyup', (event) => {\n clearTimeout(timer);\n timer = setTimeout(function () {\n filterTheList(list, input.value);\n }, 500);\n });\n input.addEventListener('change', (event) => {\n clearTimeout(timer);\n filterTheList(list, input.value);\n });\n}\nexport const filterTheList = function (list, searchTerm) {\n Array.from(list.querySelectorAll(':scope > li')).forEach((item, index) => {\n let content = item.textContent.toLowerCase();\n item.classList.add('d-none');\n if (content.includes(searchTerm.toLowerCase()))\n item.classList.remove('d-none');\n });\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n \"event\": \"Filtered list\",\n \"value\": searchTerm\n });\n};\nexport default filterlist;\n","// @ts-nocheck\nimport filterlist from \"../../modules/filterlist.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"filterlist\"\n});\nclass iamFilterlist extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n :host {\n margin-bottom: 1rem;\n display:block;\n }\n :host(.mh-sm){\n max-height: none!important;\n }\n :host(.mh-md){\n max-height: none!important;\n }\n :host(.mh-lg){\n max-height: none!important;\n }\n </style>\n <div class=\"form-control__wrapper\">\n <label for=\"search\" class=\"visually-hidden\">Search</label>\n <span class=\"suffix\" role=\"presentation\"><slot name=\"icon\"></slot></span>\n <input name=\"search\" id=\"search\" type=\"text\" class=\"form-control\" autocomplete=\"off\" placeholder=\"Search\" />\n </div>\n <div class=\"list__wrapper\">\n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n let classList = this.classList.toString();\n this.shadowRoot.querySelector('.list__wrapper').setAttribute('class', `list__wrapper ${classList}`);\n if (!this.querySelector('i.fa-search'))\n this.innerHTML += '<i class=\"fa fa-light fa-search\" aria-hidden=\"true\" slot=\"icon\"></i>';\n filterlist(this.querySelector('ul'), this.shadowRoot.querySelector('#search'));\n }\n}\nexport default iamFilterlist;\n"],"names":["filterlist","list","input","addFilterlistEventListeners","timer","event","filterTheList","searchTerm","item","index","content","iamFilterlist","assetLocation","coreCSS","template","classList"],"mappings":";;;IACA,SAASA,EAAWC,EAAMC,EAAO,CAC7BC,EAA4BF,EAAMC,CAAK,CAC3C,CACA,SAASC,EAA4BF,EAAMC,EAAO,CAC9C,IAAIE,EACJF,EAAM,iBAAiB,QAAUG,GAAU,CACvC,aAAaD,CAAK,EAClBA,EAAQ,WAAW,UAAY,CAC3BE,EAAcL,EAAMC,EAAM,KAAK,CAClC,EAAE,GAAG,CACd,CAAK,EACDA,EAAM,iBAAiB,SAAWG,GAAU,CACxC,aAAaD,CAAK,EAClBE,EAAcL,EAAMC,EAAM,KAAK,CACvC,CAAK,CACL,CACO,MAAMI,EAAgB,SAAUL,EAAMM,EAAY,CACrD,MAAM,KAAKN,EAAK,iBAAiB,aAAa,CAAC,EAAE,QAAQ,CAACO,EAAMC,IAAU,CACtE,IAAIC,EAAUF,EAAK,YAAY,YAAW,EAC1CA,EAAK,UAAU,IAAI,QAAQ,EACvBE,EAAQ,SAASH,EAAW,YAAW,CAAE,GACzCC,EAAK,UAAU,OAAO,QAAQ,CAC1C,CAAK,EAED,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAS,gBACT,MAASD,CACjB,CAAK,CACL,EC3BA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,YACf,CAAC,EACD,MAAMI,UAAsB,WAAY,CACpC,aAAc,CACV,QACA,KAAK,aAAa,CAAE,KAAM,MAAQ,CAAA,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBACzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA,MACT,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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAyBpE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/D,CACD,mBAAoB,CAChB,IAAIC,EAAY,KAAK,UAAU,SAAQ,EACvC,KAAK,WAAW,cAAc,gBAAgB,EAAE,aAAa,QAAS,iBAAiBA,GAAW,EAC7F,KAAK,cAAc,aAAa,IACjC,KAAK,WAAa,wEACtBf,EAAW,KAAK,cAAc,IAAI,EAAG,KAAK,WAAW,cAAc,SAAS,CAAC,CAChF,CACL"}
1
+ {"version":3,"file":"filterlist.component.min.js","sources":["../../modules/filterlist.js","filterlist.component.js"],"sourcesContent":["// @ts-nocheck\nfunction filterlist(list, input) {\n addFilterlistEventListeners(list, input);\n}\nfunction addFilterlistEventListeners(list, input) {\n var timer;\n input.addEventListener('keyup', (event) => {\n clearTimeout(timer);\n timer = setTimeout(function () {\n filterTheList(list, input.value);\n }, 500);\n });\n input.addEventListener('change', (event) => {\n clearTimeout(timer);\n filterTheList(list, input.value);\n });\n}\nexport const filterTheList = function (list, searchTerm) {\n Array.from(list.querySelectorAll(':scope > li')).forEach((item, index) => {\n let content = item.textContent.toLowerCase();\n item.classList.add('d-none');\n if (content.includes(searchTerm.toLowerCase()))\n item.classList.remove('d-none');\n });\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n \"event\": \"Filtered list\",\n \"value\": searchTerm\n });\n};\nexport default filterlist;\n","// @ts-nocheck\nimport filterlist from \"../../modules/filterlist.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"filterlist\"\n});\nclass iamFilterlist extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n :host {\n margin-bottom: 1rem;\n display:block;\n }\n :host(.mh-sm){\n max-height: none!important;\n }\n :host(.mh-md){\n max-height: none!important;\n }\n :host(.mh-lg){\n max-height: none!important;\n }\n </style>\n <div class=\"form-control__wrapper\">\n <label for=\"search\" class=\"visually-hidden\">Search</label>\n <span class=\"suffix\" role=\"presentation\"><slot name=\"icon\"></slot></span>\n <input name=\"search\" id=\"search\" type=\"text\" class=\"form-control\" autocomplete=\"off\" placeholder=\"Search\" part=\"search-input\" />\n </div>\n <div class=\"list__wrapper\" part=\"wrapper\">\n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n let classList = this.classList.toString();\n this.shadowRoot.querySelector('.list__wrapper').setAttribute('class', `list__wrapper ${classList}`);\n if (!this.querySelector('i.fa-search'))\n this.innerHTML += '<i class=\"fa fa-light fa-search\" aria-hidden=\"true\" slot=\"icon\"></i>';\n filterlist(this.querySelector('ul'), this.shadowRoot.querySelector('#search'));\n }\n}\nexport default iamFilterlist;\n"],"names":["filterlist","list","input","addFilterlistEventListeners","timer","event","filterTheList","searchTerm","item","index","content","iamFilterlist","assetLocation","coreCSS","template","classList"],"mappings":";;;IACA,SAASA,EAAWC,EAAMC,EAAO,CAC7BC,EAA4BF,EAAMC,CAAK,CAC3C,CACA,SAASC,EAA4BF,EAAMC,EAAO,CAC9C,IAAIE,EACJF,EAAM,iBAAiB,QAAUG,GAAU,CACvC,aAAaD,CAAK,EAClBA,EAAQ,WAAW,UAAY,CAC3BE,EAAcL,EAAMC,EAAM,KAAK,CAClC,EAAE,GAAG,CACd,CAAK,EACDA,EAAM,iBAAiB,SAAWG,GAAU,CACxC,aAAaD,CAAK,EAClBE,EAAcL,EAAMC,EAAM,KAAK,CACvC,CAAK,CACL,CACO,MAAMI,EAAgB,SAAUL,EAAMM,EAAY,CACrD,MAAM,KAAKN,EAAK,iBAAiB,aAAa,CAAC,EAAE,QAAQ,CAACO,EAAMC,IAAU,CACtE,IAAIC,EAAUF,EAAK,YAAY,YAAW,EAC1CA,EAAK,UAAU,IAAI,QAAQ,EACvBE,EAAQ,SAASH,EAAW,YAAW,CAAE,GACzCC,EAAK,UAAU,OAAO,QAAQ,CAC1C,CAAK,EAED,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAS,gBACT,MAASD,CACjB,CAAK,CACL,EC3BA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,YACf,CAAC,EACD,MAAMI,UAAsB,WAAY,CACpC,aAAc,CACV,QACA,KAAK,aAAa,CAAE,KAAM,MAAQ,CAAA,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBACzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA,MACT,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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAyBpE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/D,CACD,mBAAoB,CAChB,IAAIC,EAAY,KAAK,UAAU,SAAQ,EACvC,KAAK,WAAW,cAAc,gBAAgB,EAAE,aAAa,QAAS,iBAAiBA,GAAW,EAC7F,KAAK,cAAc,aAAa,IACjC,KAAK,WAAa,wEACtBf,EAAW,KAAK,cAAc,IAAI,EAAG,KAAK,WAAW,cAAc,SAAS,CAAC,CAChF,CACL"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
5
5
  <style>
@@ -21,10 +21,10 @@ class iamInlineEdit extends HTMLElement {
21
21
  <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
22
22
 
23
23
  <slot></slot>
24
- <div class="btns">
25
- <button class="btn btn-action" id="save"><i class="fa-regular fa-save m-0"></i> Save</button><button class="btn btn-action" id="cancel">Cancel</button>
24
+ <div class="btns" part="btns">
25
+ <button class="btn btn-action" id="save" part="save-btn"><i class="fa-regular fa-save m-0"></i> Save</button><button class="btn btn-action" id="cancel" part="cancel-btn">Cancel</button>
26
26
  </div>
27
- <div class="status pe-none">
27
+ <div class="status pe-none" part="status">
28
28
  <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saving"><i class="fa-regular fa-spinner fa-spin me-1"></i> Saving...</span>
29
29
  <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saved"><i class="fa-regular fa-check me-1"></i> Saved</span>
30
30
  <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="notsaved"><i class="fa-regular fa-circle-info me-1"></i> Not Saved</span>
@@ -38,6 +38,7 @@ class iamInlineEdit extends HTMLElement {
38
38
  let cancelButton = this.shadowRoot.querySelector('#cancel');
39
39
  let label = this.querySelector('label');
40
40
  let input = this.querySelector('input, textarea, select');
41
+ let preview = this.querySelector('.preview');
41
42
  let statusSaving = this.shadowRoot.querySelector('#saving');
42
43
  let statusSaved = this.shadowRoot.querySelector('#saved');
43
44
  let statusNotSaved = this.shadowRoot.querySelector('#notsaved');
@@ -68,6 +69,10 @@ class iamInlineEdit extends HTMLElement {
68
69
  input.blur();
69
70
  inlineEdit.blur();
70
71
  statusSaving.classList.remove('d-none');
72
+ if (preview) {
73
+ console.log(input.value);
74
+ preview.innerHTML = input.value;
75
+ }
71
76
  });
72
77
  // Save
73
78
  if (input.tagName === 'INPUT') {
@@ -122,6 +127,9 @@ class iamInlineEdit extends HTMLElement {
122
127
  const saveEvent = new CustomEvent("inline-edit-autosave", { detail: { name: input.getAttribute('name'), value: input.value } });
123
128
  inlineEdit.dispatchEvent(saveEvent);
124
129
  statusSaving.classList.remove('d-none');
130
+ if (preview) {
131
+ preview.innerHTML = input.value;
132
+ }
125
133
  }
126
134
  else if (!inlineEdit.querySelector('.inline-feedback')) {
127
135
  statusNotSaved.classList.remove('d-none');
@@ -1,22 +1,22 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
- */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class m extends HTMLElement{constructor(){super();const t=this.attachShadow({mode:"open"}),i=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",l=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${i}/css/core.min.css`,e=document.createElement("template");e.innerHTML=`
4
+ */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class b extends HTMLElement{constructor(){super();const t=this.attachShadow({mode:"open"}),i=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",d=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${i}/css/core.min.css`,e=document.createElement("template");e.innerHTML=`
5
5
  <style class="styles">
6
- @import "${l}";
6
+ @import "${d}";
7
7
  :host{max-width:var(--input-max-width, 50rem);display:block;font-weight:normal;margin-bottom:2rem;position:relative}.btns,.status{justify-content:flex-end;gap:.5rem;position:absolute;top:calc(100% + .5rem);right:0}.btns{display:var(--display-btns, flex);justify-content:flex-end}.status{display:var(--display-status, flex)}.btn-action{margin:0}/*# sourceMappingURL=assets/css/components/inline-edit.css.map */
8
8
 
9
9
  </style>
10
10
  <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
11
11
 
12
12
  <slot></slot>
13
- <div class="btns">
14
- <button class="btn btn-action" id="save"><i class="fa-regular fa-save m-0"></i> Save</button><button class="btn btn-action" id="cancel">Cancel</button>
13
+ <div class="btns" part="btns">
14
+ <button class="btn btn-action" id="save" part="save-btn"><i class="fa-regular fa-save m-0"></i> Save</button><button class="btn btn-action" id="cancel" part="cancel-btn">Cancel</button>
15
15
  </div>
16
- <div class="status pe-none">
16
+ <div class="status pe-none" part="status">
17
17
  <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saving"><i class="fa-regular fa-spinner fa-spin me-1"></i> Saving...</span>
18
18
  <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saved"><i class="fa-regular fa-check me-1"></i> Saved</span>
19
19
  <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="notsaved"><i class="fa-regular fa-circle-info me-1"></i> Not Saved</span>
20
20
  </div>
21
- `,t.appendChild(e.content.cloneNode(!0))}connectedCallback(){let t=this,i=this.shadowRoot.querySelector("#save"),l=this.shadowRoot.querySelector("#cancel");this.querySelector("label");let e=this.querySelector("input, textarea, select"),o=this.shadowRoot.querySelector("#saving"),c=this.shadowRoot.querySelector("#saved"),d=this.shadowRoot.querySelector("#notsaved"),s=e.value;l.addEventListener("click",a=>{e.value=s,e.blur(),t.blur(),t.classList.remove("was-validated"),d.classList.add("d-none");const n=new CustomEvent("inline-edit-cancel",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(n)}),i.addEventListener("click",a=>{if(t.querySelector(":invalid"))return t.classList.add("was-validated"),!1;s=e.value;const n=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(n),e.disabled=!0,e.blur(),t.blur(),o.classList.remove("d-none")}),e.tagName==="INPUT"&&e.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),i.click();break}}),t.addEventListener("inline-edit-saved",a=>{setTimeout(()=>{o.classList.add("d-none"),c.classList.remove("d-none");const n=new CustomEvent("inline-edit-confirmed",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(n)},100),setTimeout(()=>{e.disabled=!1,t.removeAttribute("data-saving"),o.classList.add("d-none"),c.classList.add("d-none"),d.classList.add("d-none")},1e3)}),e.tagName==="SELECT"&&e.addEventListener("change",a=>{s=e.value;const n=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(n),t.setAttribute("data-saving","true"),e.disabled=!0,e.blur()}),e.tagName!="SELECT"&&e.addEventListener("focus",a=>{e.select()}),e.addEventListener("blur",a=>{if(e.value!=s)if(t.hasAttribute("data-autosave")){s=e.value;const n=new CustomEvent("inline-edit-autosave",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(n),o.classList.remove("d-none")}else t.querySelector(".inline-feedback")||d.classList.remove("d-none")}),t.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let n="";Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach((u,v)=>{v!=0&&(n+=", "),n+=u.value});const r=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:n}});t.dispatchEvent(r)}})}}export{m as default};
21
+ `,t.appendChild(e.content.cloneNode(!0))}connectedCallback(){let t=this,i=this.shadowRoot.querySelector("#save"),d=this.shadowRoot.querySelector("#cancel");this.querySelector("label");let e=this.querySelector("input, textarea, select"),o=this.querySelector(".preview"),l=this.shadowRoot.querySelector("#saving"),c=this.shadowRoot.querySelector("#saved"),r=this.shadowRoot.querySelector("#notsaved"),s=e.value;d.addEventListener("click",a=>{e.value=s,e.blur(),t.blur(),t.classList.remove("was-validated"),r.classList.add("d-none");const n=new CustomEvent("inline-edit-cancel",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(n)}),i.addEventListener("click",a=>{if(t.querySelector(":invalid"))return t.classList.add("was-validated"),!1;s=e.value;const n=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(n),e.disabled=!0,e.blur(),t.blur(),l.classList.remove("d-none"),o&&(console.log(e.value),o.innerHTML=e.value)}),e.tagName==="INPUT"&&e.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),i.click();break}}),t.addEventListener("inline-edit-saved",a=>{setTimeout(()=>{l.classList.add("d-none"),c.classList.remove("d-none");const n=new CustomEvent("inline-edit-confirmed",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(n)},100),setTimeout(()=>{e.disabled=!1,t.removeAttribute("data-saving"),l.classList.add("d-none"),c.classList.add("d-none"),r.classList.add("d-none")},1e3)}),e.tagName==="SELECT"&&e.addEventListener("change",a=>{s=e.value;const n=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(n),t.setAttribute("data-saving","true"),e.disabled=!0,e.blur()}),e.tagName!="SELECT"&&e.addEventListener("focus",a=>{e.select()}),e.addEventListener("blur",a=>{if(e.value!=s)if(t.hasAttribute("data-autosave")){s=e.value;const n=new CustomEvent("inline-edit-autosave",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(n),l.classList.remove("d-none"),o&&(o.innerHTML=e.value)}else t.querySelector(".inline-feedback")||r.classList.remove("d-none")}),t.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let n="";Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach((v,m)=>{m!=0&&(n+=", "),n+=v.value});const u=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:n}});t.dispatchEvent(u)}})}}export{b as default};
22
22
  //# sourceMappingURL=inline-edit.component.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"inline-edit.component.min.js","sources":["inline-edit.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"inline edit\"\n});\nclass iamInlineEdit extends HTMLElement {\n constructor() {\n super();\n const shadowRoot = 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/inline-edit.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n @import \"${coreCSS}\";\n ${loadCSS}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n \n <slot></slot>\n <div class=\"btns\">\n <button class=\"btn btn-action\" id=\"save\"><i class=\"fa-regular fa-save m-0\"></i> Save</button><button class=\"btn btn-action\" id=\"cancel\">Cancel</button>\n </div>\n <div class=\"status pe-none\">\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saving\"><i class=\"fa-regular fa-spinner fa-spin me-1\"></i> Saving...</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saved\"><i class=\"fa-regular fa-check me-1\"></i> Saved</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"notsaved\"><i class=\"fa-regular fa-circle-info me-1\"></i> Not Saved</span>\n </div>\n `;\n shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n let inlineEdit = this;\n let saveButton = this.shadowRoot.querySelector('#save');\n let cancelButton = this.shadowRoot.querySelector('#cancel');\n let label = this.querySelector('label');\n let input = this.querySelector('input, textarea, select');\n let statusSaving = this.shadowRoot.querySelector('#saving');\n let statusSaved = this.shadowRoot.querySelector('#saved');\n let statusNotSaved = this.shadowRoot.querySelector('#notsaved');\n // Save the original value for later\n let originalValue = input.value;\n // cancel\n cancelButton.addEventListener('click', (event) => {\n input.value = originalValue;\n input.blur();\n inlineEdit.blur();\n inlineEdit.classList.remove('was-validated');\n statusNotSaved.classList.add('d-none');\n const cancelEvent = new CustomEvent(\"inline-edit-cancel\", { detail: { name: input.getAttribute('name') } });\n inlineEdit.dispatchEvent(cancelEvent);\n });\n // Save\n saveButton.addEventListener('click', (event) => {\n if (inlineEdit.querySelector(':invalid')) {\n inlineEdit.classList.add('was-validated');\n return false;\n }\n originalValue = input.value;\n // dispatch save event\n const saveEvent = new CustomEvent(\"inline-edit-save\", { detail: { name: input.getAttribute('name'), value: input.value } });\n inlineEdit.dispatchEvent(saveEvent);\n //inlineEdit.setAttribute('data-saving','true');\n input.disabled = true;\n input.blur();\n inlineEdit.blur();\n statusSaving.classList.remove('d-none');\n });\n // Save\n if (input.tagName === 'INPUT') {\n input.addEventListener('keydown', (event) => {\n switch (event.key) { // change to event.key to key to use the above variable\n case \"Enter\":\n event.stopPropagation();\n event.preventDefault();\n saveButton.click();\n break;\n }\n });\n }\n // Saved\n inlineEdit.addEventListener('inline-edit-saved', (event) => {\n setTimeout(() => {\n statusSaving.classList.add('d-none');\n statusSaved.classList.remove('d-none');\n const confirmEvent = new CustomEvent(\"inline-edit-confirmed\", { detail: { name: input.getAttribute('name') } });\n inlineEdit.dispatchEvent(confirmEvent);\n }, 100);\n // Reset to normal\n setTimeout(() => {\n input.disabled = false;\n inlineEdit.removeAttribute('data-saving');\n statusSaving.classList.add('d-none');\n statusSaved.classList.add('d-none');\n statusNotSaved.classList.add('d-none');\n }, 1000);\n });\n // enter key saves\n if (input.tagName === 'SELECT') {\n input.addEventListener('change', (event) => {\n originalValue = input.value;\n const saveEvent = new CustomEvent(\"inline-edit-save\", { detail: { name: input.getAttribute('name'), value: input.value } });\n inlineEdit.dispatchEvent(saveEvent);\n inlineEdit.setAttribute('data-saving', 'true');\n input.disabled = true;\n input.blur();\n });\n }\n if (input.tagName != 'SELECT') {\n input.addEventListener('focus', (event) => {\n input.select();\n });\n }\n //blur it should autosave\n input.addEventListener('blur', (event) => {\n if (input.value != originalValue) {\n if (inlineEdit.hasAttribute('data-autosave')) {\n originalValue = input.value;\n const saveEvent = new CustomEvent(\"inline-edit-autosave\", { detail: { name: input.getAttribute('name'), value: input.value } });\n inlineEdit.dispatchEvent(saveEvent);\n statusSaving.classList.remove('d-none');\n }\n else if (!inlineEdit.querySelector('.inline-feedback')) {\n statusNotSaved.classList.remove('d-none');\n }\n }\n });\n // checkboxes\n inlineEdit.addEventListener('change', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n let saveValue = \"\";\n Array.from(inlineEdit.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n if (index != 0)\n saveValue += \", \";\n saveValue += checkbox.value;\n });\n const saveEvent = new CustomEvent(\"inline-edit-save\", { detail: { name: event.target.closest('input[type=\"checkbox\"]').getAttribute('name'), value: saveValue } });\n inlineEdit.dispatchEvent(saveEvent);\n }\n });\n }\n}\nexport default iamInlineEdit;\n"],"names":["iamInlineEdit","shadowRoot","assetLocation","coreCSS","template","inlineEdit","saveButton","cancelButton","input","statusSaving","statusSaved","statusNotSaved","originalValue","event","cancelEvent","saveEvent","confirmEvent","saveValue","checkbox","index"],"mappings":"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"}
1
+ {"version":3,"file":"inline-edit.component.min.js","sources":["inline-edit.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"inline edit\"\n});\nclass iamInlineEdit extends HTMLElement {\n constructor() {\n super();\n const shadowRoot = 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/inline-edit.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n @import \"${coreCSS}\";\n ${loadCSS}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n \n <slot></slot>\n <div class=\"btns\" part=\"btns\">\n <button class=\"btn btn-action\" id=\"save\" part=\"save-btn\"><i class=\"fa-regular fa-save m-0\"></i> Save</button><button class=\"btn btn-action\" id=\"cancel\" part=\"cancel-btn\">Cancel</button>\n </div>\n <div class=\"status pe-none\" part=\"status\">\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saving\"><i class=\"fa-regular fa-spinner fa-spin me-1\"></i> Saving...</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saved\"><i class=\"fa-regular fa-check me-1\"></i> Saved</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"notsaved\"><i class=\"fa-regular fa-circle-info me-1\"></i> Not Saved</span>\n </div>\n `;\n shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n let inlineEdit = this;\n let saveButton = this.shadowRoot.querySelector('#save');\n let cancelButton = this.shadowRoot.querySelector('#cancel');\n let label = this.querySelector('label');\n let input = this.querySelector('input, textarea, select');\n let preview = this.querySelector('.preview');\n let statusSaving = this.shadowRoot.querySelector('#saving');\n let statusSaved = this.shadowRoot.querySelector('#saved');\n let statusNotSaved = this.shadowRoot.querySelector('#notsaved');\n // Save the original value for later\n let originalValue = input.value;\n // cancel\n cancelButton.addEventListener('click', (event) => {\n input.value = originalValue;\n input.blur();\n inlineEdit.blur();\n inlineEdit.classList.remove('was-validated');\n statusNotSaved.classList.add('d-none');\n const cancelEvent = new CustomEvent(\"inline-edit-cancel\", { detail: { name: input.getAttribute('name') } });\n inlineEdit.dispatchEvent(cancelEvent);\n });\n // Save\n saveButton.addEventListener('click', (event) => {\n if (inlineEdit.querySelector(':invalid')) {\n inlineEdit.classList.add('was-validated');\n return false;\n }\n originalValue = input.value;\n // dispatch save event\n const saveEvent = new CustomEvent(\"inline-edit-save\", { detail: { name: input.getAttribute('name'), value: input.value } });\n inlineEdit.dispatchEvent(saveEvent);\n //inlineEdit.setAttribute('data-saving','true');\n input.disabled = true;\n input.blur();\n inlineEdit.blur();\n statusSaving.classList.remove('d-none');\n if (preview) {\n console.log(input.value);\n preview.innerHTML = input.value;\n }\n });\n // Save\n if (input.tagName === 'INPUT') {\n input.addEventListener('keydown', (event) => {\n switch (event.key) { // change to event.key to key to use the above variable\n case \"Enter\":\n event.stopPropagation();\n event.preventDefault();\n saveButton.click();\n break;\n }\n });\n }\n // Saved\n inlineEdit.addEventListener('inline-edit-saved', (event) => {\n setTimeout(() => {\n statusSaving.classList.add('d-none');\n statusSaved.classList.remove('d-none');\n const confirmEvent = new CustomEvent(\"inline-edit-confirmed\", { detail: { name: input.getAttribute('name') } });\n inlineEdit.dispatchEvent(confirmEvent);\n }, 100);\n // Reset to normal\n setTimeout(() => {\n input.disabled = false;\n inlineEdit.removeAttribute('data-saving');\n statusSaving.classList.add('d-none');\n statusSaved.classList.add('d-none');\n statusNotSaved.classList.add('d-none');\n }, 1000);\n });\n // enter key saves\n if (input.tagName === 'SELECT') {\n input.addEventListener('change', (event) => {\n originalValue = input.value;\n const saveEvent = new CustomEvent(\"inline-edit-save\", { detail: { name: input.getAttribute('name'), value: input.value } });\n inlineEdit.dispatchEvent(saveEvent);\n inlineEdit.setAttribute('data-saving', 'true');\n input.disabled = true;\n input.blur();\n });\n }\n if (input.tagName != 'SELECT') {\n input.addEventListener('focus', (event) => {\n input.select();\n });\n }\n //blur it should autosave\n input.addEventListener('blur', (event) => {\n if (input.value != originalValue) {\n if (inlineEdit.hasAttribute('data-autosave')) {\n originalValue = input.value;\n const saveEvent = new CustomEvent(\"inline-edit-autosave\", { detail: { name: input.getAttribute('name'), value: input.value } });\n inlineEdit.dispatchEvent(saveEvent);\n statusSaving.classList.remove('d-none');\n if (preview) {\n preview.innerHTML = input.value;\n }\n }\n else if (!inlineEdit.querySelector('.inline-feedback')) {\n statusNotSaved.classList.remove('d-none');\n }\n }\n });\n // checkboxes\n inlineEdit.addEventListener('change', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n let saveValue = \"\";\n Array.from(inlineEdit.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n if (index != 0)\n saveValue += \", \";\n saveValue += checkbox.value;\n });\n const saveEvent = new CustomEvent(\"inline-edit-save\", { detail: { name: event.target.closest('input[type=\"checkbox\"]').getAttribute('name'), value: saveValue } });\n inlineEdit.dispatchEvent(saveEvent);\n }\n });\n }\n}\nexport default iamInlineEdit;\n"],"names":["iamInlineEdit","shadowRoot","assetLocation","coreCSS","template","inlineEdit","saveButton","cancelButton","input","preview","statusSaving","statusSaved","statusNotSaved","originalValue","event","cancelEvent","saveEvent","confirmEvent","saveValue","checkbox","index"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=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"):`${e}/css/core.min.css`,t=document.createElement("template");t.innerHTML=`
5
5
  <style>
@@ -24,9 +24,9 @@ class iamMultiselect extends HTMLElement {
24
24
  <div class="wrapper">
25
25
 
26
26
  <slot name="checked"></slot>
27
- <input name="search" id="search" autocomplete="off" required />
27
+ <input name="search" id="search" autocomplete="off" required part="search-input"/>
28
28
  <span class="admin-panel feedback">This field is required</span>
29
- <div class="admin-panel dropdown">
29
+ <div class="admin-panel dropdown" part="dropdown">
30
30
  <slot></slot>
31
31
  </div>
32
32
  <button id="clear"><span class="visually-hidden">Clear</span></button>
@@ -111,7 +111,8 @@ class iamMultiselect extends HTMLElement {
111
111
  Array.from(multiselect.querySelectorAll(`label:not([slot="checked"])`)).forEach((label, index) => {
112
112
  let checkbox = label.querySelector('input');
113
113
  let searchValue = checkbox.value;
114
- if (searchValue.toLowerCase().includes(search.value.toLowerCase())) {
114
+ let labelText = label.textContent;
115
+ if (searchValue.toLowerCase().includes(search.value.toLowerCase()) || labelText.toLowerCase().includes(search.value.toLowerCase())) {
115
116
  label.removeAttribute('slot');
116
117
  }
117
118
  else {
@@ -1,10 +1,10 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
- */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"mutliselect"});class m extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",s=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,r=document.createElement("template");r.innerHTML=`
4
+ */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"mutliselect"});class b extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",s=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,r=document.createElement("template");r.innerHTML=`
5
5
  <style>
6
6
  @import "${s}";
7
- .outer{position:relative;max-width:var(--input-max-width, 50rem);display:block}label{margin-bottom:0;padding-bottom:.5rem}.wrapper{margin-bottom:1.5rem;max-width:var(--input-max-width, 50rem)}.wrapper:after{content:"";display:block;position:absolute;top:100%;left:0;width:100%;height:1rem}.wrapper input{margin-bottom:0.5rem}.wrapper .feedback{position:absolute;right:0;bottom:100%;padding:.85rem;width:min-content;white-space:nowrap;margin-bottom:.5rem;display:none}.wrapper.was-validated .feedback{display:block}.wrapper.filled{display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;min-height:calc(2.75rem + 4px);padding:0.5rem 2rem 0rem 0.8125rem;font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);color:var(--colour-body);background-color:var(--colour-canvas-2);border:2px solid var(--colour-primary);border-radius:0.5rem}.wrapper.filled:is(:focus-within,.focus-within):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}.wrapper.filled input{all:unset;font-size:1rem;line-height:1.625rem;display:inline-block;width:0;flex-grow:1;padding:0 0.5rem 0 0 !important;margin-inline:0.1875rem;order:999;margin-bottom:0.5rem}.wrapper.filled .feedback{display:none !important}.wrapper.filled:is(:focus,.focus):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}button{position:absolute;top:.75rem;right:.5rem;border:none;background:none;padding-inline:.5rem;display:var(--display-button, none)}button:after{content:"\u2715";font-weight:bold}.dropdown{position:absolute;top:calc(100% + .5rem);padding:0;left:0;width:100%;margin:0;z-index:99;display:none;max-height:15.25rem !important;overflow:auto}.dropdown:before{display:none}.wrapper:is(:hover,:focus-within) .dropdown{display:var(--display-panel, none)}:host-context(:focus-within) input{background-color:none !important}:host-context(iam-inline-edit){display:block;--display-btns: none}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]),:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) input,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover input{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) .dropdown,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover .dropdown{display:none}:host-context(iam-inline-edit) .wrapper{margin-bottom:0}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) input{border:none;background:none;margin-left:-1rem;width:calc(100% + 1rem);max-width:calc(100% + 1rem);box-shadow:none}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) .dropdown{display:none}:host-context(iam-inline-edit) .wrapper.filled:not(:focus-within):not([data-mousedown]){background:none;border:none;padding-left:0}/*# sourceMappingURL=assets/css/components/multiselect.css.map */
7
+ .outer{position:relative;max-width:var(--input-max-width, 50rem);display:block}label{margin-bottom:0;padding-bottom:.5rem}.wrapper{margin-bottom:1.5rem;max-width:var(--input-max-width, 50rem)}.wrapper:after{content:"";display:block;position:absolute;top:100%;left:0;width:100%;height:1rem}.wrapper input{margin-bottom:0.5rem}.wrapper .feedback{position:absolute;right:0;bottom:100%;padding:.85rem;width:min-content;white-space:nowrap;margin-bottom:.5rem;display:none}.wrapper.was-validated .feedback{display:block}.wrapper.filled{display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;min-height:calc(2.75rem + 4px);padding:0.5rem 2rem 0rem 0.8125rem;font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);color:var(--colour-body);background-color:var(--colour-canvas-2);border:2px solid var(--colour-primary);border-radius:0.5rem}.wrapper.filled:is(:focus-within,.focus-within):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}.wrapper.filled input{all:unset;font-size:1rem;line-height:1.625rem;display:inline-block;width:0;flex-grow:1;padding:0 0.5rem 0 0 !important;margin-inline:0.1875rem;order:999;margin-bottom:0.5rem}.wrapper.filled .feedback{display:none !important}.wrapper.filled:is(:focus,.focus):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}button{position:absolute;top:.75rem;right:.5rem;border:none;background:none;padding-inline:.5rem;display:var(--display-button, none)}button:after{content:"\u2715";font-weight:bold}.dropdown{position:absolute;top:calc(100% + .5rem);padding:0;left:0;width:100%;margin:0;z-index:99;display:none;max-height:15.25rem !important;overflow:auto}.dropdown:before{display:none}.wrapper:is(:focus-within) .dropdown{display:var(--display-panel, none)}.wrapper .dropdown:hover{display:var(--display-panel, none)}:host-context(:focus-within) input{background-color:none !important}:host-context(iam-inline-edit){display:block;--display-btns: none}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]),:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) input,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover input{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) .dropdown,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover .dropdown{display:none}:host-context(iam-inline-edit) .wrapper{margin-bottom:0}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) input{border:none;background:none;margin-left:-1rem;width:calc(100% + 1rem);max-width:calc(100% + 1rem);box-shadow:none}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) .dropdown{display:none}:host-context(iam-inline-edit) .wrapper.filled:not(:focus-within):not([data-mousedown]){background:none;border:none;padding-left:0}/*# sourceMappingURL=assets/css/components/multiselect.css.map */
8
8
 
9
9
  ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
10
10
  </style>
@@ -13,13 +13,13 @@
13
13
  <div class="wrapper">
14
14
 
15
15
  <slot name="checked"></slot>
16
- <input name="search" id="search" autocomplete="off" required />
16
+ <input name="search" id="search" autocomplete="off" required part="search-input"/>
17
17
  <span class="admin-panel feedback">This field is required</span>
18
- <div class="admin-panel dropdown">
18
+ <div class="admin-panel dropdown" part="dropdown">
19
19
  <slot></slot>
20
20
  </div>
21
21
  <button id="clear"><span class="visually-hidden">Clear</span></button>
22
22
  </div>
23
23
  </div>
24
- `,this.shadowRoot.appendChild(r.content.cloneNode(!0))}connectedCallback(){let t=this,s=this.closest("form"),r=this.shadowRoot.querySelector(".wrapper"),a=t.shadowRoot.querySelector("#search"),p=t.shadowRoot.querySelector("#clear"),n=0,h=t.shadowRoot.querySelector("label");if(h.innerHTML=t.getAttribute("data-label"),t.hasAttribute("placeholder")&&a.setAttribute("placeholder",t.getAttribute("placeholder")),t.setAttribute("data-error","true"),s&&t.hasAttribute("data-is-required")){let e=new MutationObserver(function(o){o.forEach(function(i){const l=i.target;console.log(l),l.classList.contains("was-validated")?r.classList.add("was-validated"):r.classList.remove("was-validated")})});s.classList.contains("was-validated")?r.classList.add("was-validated"):r.classList.remove("was-validated"),e.observe(s,{attributes:!0,attributeFilter:["style","class"]})}function c(e){e.checked==!1?(e.closest("label").removeAttribute("slot"),e.closest("label").removeAttribute("style"),e.closest("label").removeAttribute("data-order")):(n++,e.closest("label").setAttribute("slot","checked"),e.closest("label").setAttribute("style",`--order:${n};`),e.closest("label").setAttribute("data-order",n)),t.querySelector('label[slot="checked"]')?(r.classList.add("filled"),t.removeAttribute("data-error"),a.removeAttribute("placeholder")):(r.classList.remove("filled"),t.setAttribute("data-error","true"),t.hasAttribute("placeholder")&&a.setAttribute("placeholder",t.getAttribute("placeholder")))}Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach((e,o)=>{c(e)}),a.addEventListener("input",e=>{Array.from(t.querySelectorAll('label:not([slot="checked"])')).forEach((o,i)=>{o.querySelector("input").value.toLowerCase().includes(a.value.toLowerCase())?o.removeAttribute("slot"):o.setAttribute("slot","notmatched")})}),t.addEventListener("change",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest('input[type="checkbox"]')){let o=e.target.closest('input[type="checkbox"]');c(o),a.focus()}}),p.addEventListener("click",function(e){Array.from(t.querySelectorAll('label input[type="checkbox"]')).forEach((o,i)=>{o.checked=!1,c(o)}),a.focus()}),t.addEventListener("keydown",function(e){const o=document.activeElement;switch(e.key){case"ArrowUp":if(e.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){let i=t.querySelectorAll('label:not([slot="checked"]):not([slot="checked"])'),l=Array.from(i).indexOf(o.closest("label")),d=Array.from(i)[l-1];d?d.focus():a.focus()}break;case"ArrowDown":if(e.preventDefault(),o==t)t.querySelector('label:not([slot="checked"]):not([slot="checked"])').focus();else if(o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){let i=o.value,l=t.querySelector(`label:has(input[value="${i}"]) ~ label:not([slot="checked"]):not([slot="checked"])`);l&&l.focus()}break;case"Enter":e.stopPropagation(),e.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"&&(o.checked==!1?o.checked=!0:o.checked=!1),c(o),a.focus();break}});function u(){if(n==0)return!1;let e=t.querySelector(`label[data-order="${n}"]`);return e||(e=u(n--)),e}a.addEventListener("keydown",function(e){switch(e.key){case"Enter":t.querySelector(`input[value="${a.value}"]:not(:checked)`)||(a.value=""),a.focus();break;case"Backspace":if(!a.value){let i=u();if(i){let l=i.querySelector("input");l.checked=!1,c(l)}a.focus()}break}}),t.addEventListener("mousedown",e=>{r.setAttribute("data-mousedown","true")}),t.addEventListener("mouseup",e=>{r.removeAttribute("data-mousedown")})}}export{m as default};
24
+ `,this.shadowRoot.appendChild(r.content.cloneNode(!0))}connectedCallback(){let t=this,s=this.closest("form"),r=this.shadowRoot.querySelector(".wrapper"),a=t.shadowRoot.querySelector("#search"),p=t.shadowRoot.querySelector("#clear"),n=0,h=t.shadowRoot.querySelector("label");if(h.innerHTML=t.getAttribute("data-label"),t.hasAttribute("placeholder")&&a.setAttribute("placeholder",t.getAttribute("placeholder")),t.setAttribute("data-error","true"),s&&t.hasAttribute("data-is-required")){let e=new MutationObserver(function(o){o.forEach(function(i){const l=i.target;console.log(l),l.classList.contains("was-validated")?r.classList.add("was-validated"):r.classList.remove("was-validated")})});s.classList.contains("was-validated")?r.classList.add("was-validated"):r.classList.remove("was-validated"),e.observe(s,{attributes:!0,attributeFilter:["style","class"]})}function c(e){e.checked==!1?(e.closest("label").removeAttribute("slot"),e.closest("label").removeAttribute("style"),e.closest("label").removeAttribute("data-order")):(n++,e.closest("label").setAttribute("slot","checked"),e.closest("label").setAttribute("style",`--order:${n};`),e.closest("label").setAttribute("data-order",n)),t.querySelector('label[slot="checked"]')?(r.classList.add("filled"),t.removeAttribute("data-error"),a.removeAttribute("placeholder")):(r.classList.remove("filled"),t.setAttribute("data-error","true"),t.hasAttribute("placeholder")&&a.setAttribute("placeholder",t.getAttribute("placeholder")))}Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach((e,o)=>{c(e)}),a.addEventListener("input",e=>{Array.from(t.querySelectorAll('label:not([slot="checked"])')).forEach((o,i)=>{let d=o.querySelector("input").value,m=o.textContent;d.toLowerCase().includes(a.value.toLowerCase())||m.toLowerCase().includes(a.value.toLowerCase())?o.removeAttribute("slot"):o.setAttribute("slot","notmatched")})}),t.addEventListener("change",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest('input[type="checkbox"]')){let o=e.target.closest('input[type="checkbox"]');c(o),a.focus()}}),p.addEventListener("click",function(e){Array.from(t.querySelectorAll('label input[type="checkbox"]')).forEach((o,i)=>{o.checked=!1,c(o)}),a.focus()}),t.addEventListener("keydown",function(e){const o=document.activeElement;switch(e.key){case"ArrowUp":if(e.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){let i=t.querySelectorAll('label:not([slot="checked"]):not([slot="checked"])'),l=Array.from(i).indexOf(o.closest("label")),d=Array.from(i)[l-1];d?d.focus():a.focus()}break;case"ArrowDown":if(e.preventDefault(),o==t)t.querySelector('label:not([slot="checked"]):not([slot="checked"])').focus();else if(o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){let i=o.value,l=t.querySelector(`label:has(input[value="${i}"]) ~ label:not([slot="checked"]):not([slot="checked"])`);l&&l.focus()}break;case"Enter":e.stopPropagation(),e.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"&&(o.checked==!1?o.checked=!0:o.checked=!1),c(o),a.focus();break}});function u(){if(n==0)return!1;let e=t.querySelector(`label[data-order="${n}"]`);return e||(e=u(n--)),e}a.addEventListener("keydown",function(e){switch(e.key){case"Enter":t.querySelector(`input[value="${a.value}"]:not(:checked)`)||(a.value=""),a.focus();break;case"Backspace":if(!a.value){let i=u();if(i){let l=i.querySelector("input");l.checked=!1,c(l)}a.focus()}break}}),t.addEventListener("mousedown",e=>{r.setAttribute("data-mousedown","true")}),t.addEventListener("mouseup",e=>{r.removeAttribute("data-mousedown")})}}export{b as default};
25
25
  //# sourceMappingURL=multiselect.component.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"multiselect.component.min.js","sources":["multiselect.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"mutliselect\"\n});\nclass iamMultiselect 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/multiselect.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 <label for=\"search\"> <slot name=\"feedback\"></slot></label>\n <div class=\"outer\">\n <div class=\"wrapper\">\n \n <slot name=\"checked\"></slot>\n <input name=\"search\" id=\"search\" autocomplete=\"off\" required />\n <span class=\"admin-panel feedback\">This field is required</span>\n <div class=\"admin-panel dropdown\">\n <slot></slot>\n </div>\n <button id=\"clear\"><span class=\"visually-hidden\">Clear</span></button>\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n let multiselect = this;\n let form = this.closest('form');\n let wrapper = this.shadowRoot.querySelector('.wrapper');\n let search = multiselect.shadowRoot.querySelector('#search');\n let button = multiselect.shadowRoot.querySelector('#clear');\n let order = 0;\n let label = multiselect.shadowRoot.querySelector('label');\n label.innerHTML = multiselect.getAttribute('data-label');\n if (multiselect.hasAttribute('placeholder')) {\n search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n }\n multiselect.setAttribute('data-error', 'true');\n // If in form and is required lets watch for the form being submitted\n if (form && multiselect.hasAttribute('data-is-required')) {\n let observer = new MutationObserver(function (mutations) {\n mutations.forEach(function (mutationRecord) {\n const targetElement = mutationRecord.target;\n console.log(targetElement);\n if (targetElement.classList.contains(\"was-validated\")) {\n wrapper.classList.add('was-validated');\n }\n else {\n wrapper.classList.remove('was-validated');\n }\n ;\n });\n });\n if (form.classList.contains(\"was-validated\")) {\n wrapper.classList.add('was-validated');\n }\n else {\n wrapper.classList.remove('was-validated');\n }\n ;\n observer.observe(form, {\n attributes: true,\n attributeFilter: ['style', 'class']\n });\n }\n // Set the correct attributes\n function setItem(inputToSet) {\n if (inputToSet.checked == false) {\n inputToSet.closest('label').removeAttribute('slot');\n inputToSet.closest('label').removeAttribute('style');\n inputToSet.closest('label').removeAttribute('data-order');\n }\n else {\n order++;\n inputToSet.closest('label').setAttribute('slot', 'checked');\n inputToSet.closest('label').setAttribute('style', `--order:${order};`);\n inputToSet.closest('label').setAttribute('data-order', order);\n }\n // check for errors\n if (multiselect.querySelector('label[slot=\"checked\"]')) {\n wrapper.classList.add('filled');\n multiselect.removeAttribute('data-error');\n search.removeAttribute('placeholder');\n }\n else {\n wrapper.classList.remove('filled');\n multiselect.setAttribute('data-error', 'true');\n if (multiselect.hasAttribute('placeholder')) {\n search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n }\n }\n }\n // Set on load\n Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n setItem(checkbox);\n });\n // Filter list\n search.addEventListener('input', (event) => {\n Array.from(multiselect.querySelectorAll(`label:not([slot=\"checked\"])`)).forEach((label, index) => {\n let checkbox = label.querySelector('input');\n let searchValue = checkbox.value;\n if (searchValue.toLowerCase().includes(search.value.toLowerCase())) {\n label.removeAttribute('slot');\n }\n else {\n label.setAttribute('slot', 'notmatched');\n }\n });\n });\n // Set items\n multiselect.addEventListener('change', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n let checkbox = event.target.closest('input[type=\"checkbox\"]');\n setItem(checkbox);\n search.focus();\n }\n });\n // Clear all\n button.addEventListener(\"click\", function (event) {\n Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]`)).forEach((checkbox, index) => {\n checkbox.checked = false;\n setItem(checkbox);\n });\n search.focus();\n });\n // Add some keyboard features to keep it accessible\n multiselect.addEventListener(\"keydown\", function (event) {\n const activeElement = document.activeElement;\n switch (event.key) { // change to event.key to key to use the above variable\n case \"ArrowUp\":\n // Up pressed\n event.preventDefault();\n if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == \"checkbox\") {\n let arrCheckboxes = multiselect.querySelectorAll(`label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n let activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));\n let prevCheckbox = Array.from(arrCheckboxes)[activeIndex - 1];\n if (prevCheckbox)\n prevCheckbox.focus();\n else\n search.focus();\n }\n break;\n case \"ArrowDown\":\n // Down pressed\n event.preventDefault();\n if (activeElement == multiselect) {\n multiselect.querySelector('label:not([slot=\"checked\"]):not([slot=\"checked\"])').focus();\n }\n else if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == \"checkbox\") {\n let activeValue = activeElement.value;\n let nextCheckbox = multiselect.querySelector(`label:has(input[value=\"${activeValue}\"]) ~ label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n if (nextCheckbox)\n nextCheckbox.focus();\n }\n break;\n case \"Enter\":\n event.stopPropagation();\n event.preventDefault();\n if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == \"checkbox\") {\n if (activeElement.checked == false)\n activeElement.checked = true;\n else\n activeElement.checked = false;\n }\n setItem(activeElement);\n search.focus();\n break;\n }\n });\n function checkLastTag() {\n if (order == 0)\n return false;\n let lastTag = multiselect.querySelector(`label[data-order=\"${order}\"]`);\n if (!lastTag) {\n lastTag = checkLastTag(order--);\n }\n return lastTag;\n }\n search.addEventListener(\"keydown\", function (event) {\n switch (event.key) { // change to event.key to key to use the above variable\n case \"Enter\":\n let match = multiselect.querySelector(`input[value=\"${search.value}\"]:not(:checked)`);\n if (!match)\n search.value = \"\";\n search.focus();\n break;\n case \"Backspace\":\n if (!search.value) {\n let lastTag = checkLastTag(order);\n if (lastTag) {\n let lastTagInput = lastTag.querySelector('input');\n lastTagInput.checked = false;\n setItem(lastTagInput);\n }\n search.focus();\n }\n break;\n }\n });\n // Fix for the inline edit multiselect\n multiselect.addEventListener(\"mousedown\", (event) => {\n wrapper.setAttribute('data-mousedown', 'true');\n });\n multiselect.addEventListener(\"mouseup\", (event) => {\n wrapper.removeAttribute('data-mousedown');\n });\n }\n}\nexport default iamMultiselect;\n"],"names":["iamMultiselect","assetLocation","coreCSS","template","multiselect","form","wrapper","search","button","order","label","observer","mutations","mutationRecord","targetElement","setItem","inputToSet","checkbox","index","event","activeElement","arrCheckboxes","activeIndex","prevCheckbox","activeValue","nextCheckbox","checkLastTag","lastTag","lastTagInput"],"mappings":"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"}
1
+ {"version":3,"file":"multiselect.component.min.js","sources":["multiselect.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"mutliselect\"\n});\nclass iamMultiselect 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/multiselect.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 <label for=\"search\"> <slot name=\"feedback\"></slot></label>\n <div class=\"outer\">\n <div class=\"wrapper\">\n \n <slot name=\"checked\"></slot>\n <input name=\"search\" id=\"search\" autocomplete=\"off\" required part=\"search-input\"/>\n <span class=\"admin-panel feedback\">This field is required</span>\n <div class=\"admin-panel dropdown\" part=\"dropdown\">\n <slot></slot>\n </div>\n <button id=\"clear\"><span class=\"visually-hidden\">Clear</span></button>\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n let multiselect = this;\n let form = this.closest('form');\n let wrapper = this.shadowRoot.querySelector('.wrapper');\n let search = multiselect.shadowRoot.querySelector('#search');\n let button = multiselect.shadowRoot.querySelector('#clear');\n let order = 0;\n let label = multiselect.shadowRoot.querySelector('label');\n label.innerHTML = multiselect.getAttribute('data-label');\n if (multiselect.hasAttribute('placeholder')) {\n search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n }\n multiselect.setAttribute('data-error', 'true');\n // If in form and is required lets watch for the form being submitted\n if (form && multiselect.hasAttribute('data-is-required')) {\n let observer = new MutationObserver(function (mutations) {\n mutations.forEach(function (mutationRecord) {\n const targetElement = mutationRecord.target;\n console.log(targetElement);\n if (targetElement.classList.contains(\"was-validated\")) {\n wrapper.classList.add('was-validated');\n }\n else {\n wrapper.classList.remove('was-validated');\n }\n ;\n });\n });\n if (form.classList.contains(\"was-validated\")) {\n wrapper.classList.add('was-validated');\n }\n else {\n wrapper.classList.remove('was-validated');\n }\n ;\n observer.observe(form, {\n attributes: true,\n attributeFilter: ['style', 'class']\n });\n }\n // Set the correct attributes\n function setItem(inputToSet) {\n if (inputToSet.checked == false) {\n inputToSet.closest('label').removeAttribute('slot');\n inputToSet.closest('label').removeAttribute('style');\n inputToSet.closest('label').removeAttribute('data-order');\n }\n else {\n order++;\n inputToSet.closest('label').setAttribute('slot', 'checked');\n inputToSet.closest('label').setAttribute('style', `--order:${order};`);\n inputToSet.closest('label').setAttribute('data-order', order);\n }\n // check for errors\n if (multiselect.querySelector('label[slot=\"checked\"]')) {\n wrapper.classList.add('filled');\n multiselect.removeAttribute('data-error');\n search.removeAttribute('placeholder');\n }\n else {\n wrapper.classList.remove('filled');\n multiselect.setAttribute('data-error', 'true');\n if (multiselect.hasAttribute('placeholder')) {\n search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n }\n }\n }\n // Set on load\n Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n setItem(checkbox);\n });\n // Filter list\n search.addEventListener('input', (event) => {\n Array.from(multiselect.querySelectorAll(`label:not([slot=\"checked\"])`)).forEach((label, index) => {\n let checkbox = label.querySelector('input');\n let searchValue = checkbox.value;\n let labelText = label.textContent;\n if (searchValue.toLowerCase().includes(search.value.toLowerCase()) || labelText.toLowerCase().includes(search.value.toLowerCase())) {\n label.removeAttribute('slot');\n }\n else {\n label.setAttribute('slot', 'notmatched');\n }\n });\n });\n // Set items\n multiselect.addEventListener('change', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n let checkbox = event.target.closest('input[type=\"checkbox\"]');\n setItem(checkbox);\n search.focus();\n }\n });\n // Clear all\n button.addEventListener(\"click\", function (event) {\n Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]`)).forEach((checkbox, index) => {\n checkbox.checked = false;\n setItem(checkbox);\n });\n search.focus();\n });\n // Add some keyboard features to keep it accessible\n multiselect.addEventListener(\"keydown\", function (event) {\n const activeElement = document.activeElement;\n switch (event.key) { // change to event.key to key to use the above variable\n case \"ArrowUp\":\n // Up pressed\n event.preventDefault();\n if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == \"checkbox\") {\n let arrCheckboxes = multiselect.querySelectorAll(`label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n let activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));\n let prevCheckbox = Array.from(arrCheckboxes)[activeIndex - 1];\n if (prevCheckbox)\n prevCheckbox.focus();\n else\n search.focus();\n }\n break;\n case \"ArrowDown\":\n // Down pressed\n event.preventDefault();\n if (activeElement == multiselect) {\n multiselect.querySelector('label:not([slot=\"checked\"]):not([slot=\"checked\"])').focus();\n }\n else if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == \"checkbox\") {\n let activeValue = activeElement.value;\n let nextCheckbox = multiselect.querySelector(`label:has(input[value=\"${activeValue}\"]) ~ label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n if (nextCheckbox)\n nextCheckbox.focus();\n }\n break;\n case \"Enter\":\n event.stopPropagation();\n event.preventDefault();\n if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == \"checkbox\") {\n if (activeElement.checked == false)\n activeElement.checked = true;\n else\n activeElement.checked = false;\n }\n setItem(activeElement);\n search.focus();\n break;\n }\n });\n function checkLastTag() {\n if (order == 0)\n return false;\n let lastTag = multiselect.querySelector(`label[data-order=\"${order}\"]`);\n if (!lastTag) {\n lastTag = checkLastTag(order--);\n }\n return lastTag;\n }\n search.addEventListener(\"keydown\", function (event) {\n switch (event.key) { // change to event.key to key to use the above variable\n case \"Enter\":\n let match = multiselect.querySelector(`input[value=\"${search.value}\"]:not(:checked)`);\n if (!match)\n search.value = \"\";\n search.focus();\n break;\n case \"Backspace\":\n if (!search.value) {\n let lastTag = checkLastTag(order);\n if (lastTag) {\n let lastTagInput = lastTag.querySelector('input');\n lastTagInput.checked = false;\n setItem(lastTagInput);\n }\n search.focus();\n }\n break;\n }\n });\n // Fix for the inline edit multiselect\n multiselect.addEventListener(\"mousedown\", (event) => {\n wrapper.setAttribute('data-mousedown', 'true');\n });\n multiselect.addEventListener(\"mouseup\", (event) => {\n wrapper.removeAttribute('data-mousedown');\n });\n }\n}\nexport default iamMultiselect;\n"],"names":["iamMultiselect","assetLocation","coreCSS","template","multiselect","form","wrapper","search","button","order","label","observer","mutations","mutationRecord","targetElement","setItem","inputToSet","checkbox","index","event","searchValue","labelText","activeElement","arrCheckboxes","activeIndex","prevCheckbox","activeValue","nextCheckbox","checkLastTag","lastTag","lastTagInput"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"nav"});class v extends HTMLElement{constructor(){super();const s=this.attachShadow({mode:"open"}),n=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${n}/css/core.min.css`,i=document.createElement("template");i.innerHTML=`
5
5
  <style class="styles">
@@ -32,7 +32,7 @@ class iamNotification extends HTMLElement {
32
32
  <div class="notification">
33
33
  <div class="notification__icon"><slot name="icon"></slot></div>
34
34
  <div class="notification__inner"><div class="notification__text"><slot></slot></div>${buttons.length ? `<div class="notification__btns"><slot name="btns"></slot></div>` : ''}</div>
35
- ${this.hasAttribute('data-dismiss') ? `<div class="notification__dismiss"><button data-dismiss-button>Dismiss</button></div>` : ''}
35
+ ${this.hasAttribute('data-dismiss') ? `<div class="notification__dismiss"><button data-dismiss-button part="dismiss-btn">Dismiss</button></div>` : ''}
36
36
  </div>
37
37
  `;
38
38
  this.shadowRoot.appendChild(template.content.cloneNode(true));
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */function r(i){if(i.hasAttribute("data-type")&&i.getAttribute("data-type")=="toast"){let t=document.querySelector(".notification__holder");t||(t=document.createElement("div"),t.classList.add("notification__holder"),t.classList.add("container"),document.querySelector("body").appendChild(t)),i.closest(".notification__holder")||t.appendChild(i)}if(i.setAttribute("role","alert"),i.addEventListener("click",function(t){event&&event.target instanceof HTMLElement&&event.target.closest("[data-dismiss-button]")&&(t.preventDefault(),a(i))},!1),i.hasAttribute("data-timeout")){let t=i.getAttribute("data-timeout");var n=new c(function(){a(i)},t);i.addEventListener("mouseenter",o=>{n.pause()}),i.addEventListener("mouseleave",o=>{n.resume()})}}function c(i,n){var t,o,e=n;this.pause=function(){window.clearTimeout(t),e-=new Date-o},this.resume=function(){o=new Date,window.clearTimeout(t),t=window.setTimeout(i,e)},this.resume()}const a=function(i){i.classList.add("d-none")};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Notification"});class d extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const n=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"):`${n}/css/core.min.css`,o=this.querySelectorAll("a,button");Array.from(o).forEach((s,l)=>{s.setAttribute("slot","btns"),s.classList.add("link")}),(o.length||this.hasAttribute("data-dismiss"))&&this.classList.add("notification--dismissable");const e=document.createElement("template");e.innerHTML=`
5
5
  <style>
@@ -12,7 +12,7 @@
12
12
  <div class="notification">
13
13
  <div class="notification__icon"><slot name="icon"></slot></div>
14
14
  <div class="notification__inner"><div class="notification__text"><slot></slot></div>${o.length?'<div class="notification__btns"><slot name="btns"></slot></div>':""}</div>
15
- ${this.hasAttribute("data-dismiss")?'<div class="notification__dismiss"><button data-dismiss-button>Dismiss</button></div>':""}
15
+ ${this.hasAttribute("data-dismiss")?'<div class="notification__dismiss"><button data-dismiss-button part="dismiss-btn">Dismiss</button></div>':""}
16
16
  </div>
17
17
  `,this.shadowRoot.appendChild(e.content.cloneNode(!0)),document.getElementById("notificationHolder")||document.head.insertAdjacentHTML("beforeend",`<style id="notificationHolder">.container.notification__holder{position:fixed;top:var(--nav-height);left:50%;transform:translate(-50%, 0);bottom:0;z-index:999999;pointer-events:none;padding-top:1rem;padding-bottom:1rem;display:flex;margin:0;width:100%;flex-wrap:wrap;align-content:flex-start;flex-direction:column;align-content:flex-end;align-items:flex-end}.container.notification__holder :is(.iam-notification,iam-notification){pointer-events:all;margin:.5rem 0 .5rem 0}.container.notification__holder.bottom{flex-direction:column-reverse}.container.notification__holder.left{align-content:flex-start;align-items:flex-start}.container.notification__holder.middle{align-content:space-around;align-items:center}/*# sourceMappingURL=assets/css/components/notification.global.css.map */
18
18
  </style>`)}connectedCallback(){const n=this.shadowRoot.querySelector("[data-dismiss-button]"),t=this.hasAttribute("data-status")?this.getAttribute("data-status"):"white";this.hasAttribute("data-type")?this.classList.add(`bg-${t}`):this.classList.add(`colour-${t}`);const o=this;if(!this.querySelector("i"))switch(t){case"danger":this.innerHTML+='<i class="fa-solid fa-circle-exclamation" aria-hidden="true" slot="icon"></i>';break;case"warning":this.innerHTML+='<i class="fa-solid fa-triangle-exclamation" aria-hidden="true" slot="icon"></i>';break;case"success":this.innerHTML+='<i class="fa-solid fa-check-circle" aria-hidden="true" slot="icon"></i>';break;default:this.innerHTML+='<i class="fa-solid fa-circle-info" aria-hidden="true" slot="icon"></i>'}r(o),n&&n.addEventListener("click",function(e){a(o)},!1)}}export{d as default};
@@ -1 +1 @@
1
- {"version":3,"file":"notification.component.min.js","sources":["../../modules/notification.js","notification.component.js"],"sourcesContent":["// @ts-nocheck\nfunction setupNotification(element) {\n // Add toast to notification holder\n if (element.hasAttribute('data-type') && element.getAttribute('data-type') == \"toast\") {\n let holder = document.querySelector('.notification__holder');\n if (!holder) {\n holder = document.createElement('div');\n holder.classList.add('notification__holder');\n holder.classList.add('container');\n document.querySelector('body').appendChild(holder);\n }\n if (!element.closest('.notification__holder'))\n holder.appendChild(element);\n }\n element.setAttribute('role', 'alert');\n // Create a dissmissable button\n element.addEventListener('click', function (e) {\n if (event && event.target instanceof HTMLElement && event.target.closest('[data-dismiss-button]')) {\n e.preventDefault();\n closeNotification(element);\n }\n }, false);\n // Self disappearing alert\n if (element.hasAttribute('data-timeout')) {\n let timeOut = element.getAttribute('data-timeout');\n var timer = new Timer(function () {\n closeNotification(element);\n }, timeOut);\n element.addEventListener(\"mouseenter\", (event) => {\n timer.pause();\n });\n element.addEventListener(\"mouseleave\", (event) => {\n timer.resume();\n });\n }\n}\nfunction Timer(callback, delay) {\n var timerId, start, remaining = delay;\n this.pause = function () {\n window.clearTimeout(timerId);\n remaining -= new Date() - start;\n };\n this.resume = function () {\n start = new Date();\n window.clearTimeout(timerId);\n timerId = window.setTimeout(callback, remaining);\n };\n this.resume();\n}\nexport const closeNotification = function (element) {\n element.classList.add('d-none');\n};\nexport default setupNotification;\n","// @ts-nocheck\nimport setupNotification, { closeNotification } from \"../../modules/notification.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Notification\"\n});\nclass iamNotification 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/notification.css\";`;\n const loadExtraCSS = `@import \"${assetLocation}/css/components/notification.global.css\";`;\n const buttons = this.querySelectorAll('a,button');\n Array.from(buttons).forEach((button, index) => {\n button.setAttribute('slot', 'btns');\n button.classList.add('link');\n });\n if (buttons.length || this.hasAttribute('data-dismiss'))\n this.classList.add('notification--dismissable');\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('data-css') ? `${this.getAttribute('data-css')}` : ``}\n </style>\n\n <div class=\"notification\">\n <div class=\"notification__icon\"><slot name=\"icon\"></slot></div>\n <div class=\"notification__inner\"><div class=\"notification__text\"><slot></slot></div>${buttons.length ? `<div class=\"notification__btns\"><slot name=\"btns\"></slot></div>` : ''}</div>\n ${this.hasAttribute('data-dismiss') ? `<div class=\"notification__dismiss\"><button data-dismiss-button>Dismiss</button></div>` : ''}\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n // insert extra CSS\n if (!document.getElementById('notificationHolder'))\n document.head.insertAdjacentHTML('beforeend', `<style id=\"notificationHolder\">${loadExtraCSS}</style>`);\n }\n connectedCallback() {\n const dismissBtn = this.shadowRoot.querySelector('[data-dismiss-button]');\n const statusBG = this.hasAttribute('data-status') ? this.getAttribute('data-status') : 'white';\n if (this.hasAttribute('data-type'))\n this.classList.add(`bg-${statusBG}`);\n else {\n this.classList.add(`colour-${statusBG}`);\n }\n const wrapper = this;\n if (!this.querySelector('i')) {\n switch (statusBG) {\n case 'danger':\n this.innerHTML += '<i class=\"fa-solid fa-circle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>';\n break;\n case 'warning':\n this.innerHTML += '<i class=\"fa-solid fa-triangle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>';\n break;\n case 'success':\n this.innerHTML += '<i class=\"fa-solid fa-check-circle\" aria-hidden=\"true\" slot=\"icon\"></i>';\n break;\n default:\n this.innerHTML += '<i class=\"fa-solid fa-circle-info\" aria-hidden=\"true\" slot=\"icon\"></i>';\n }\n }\n setupNotification(wrapper);\n if (dismissBtn) {\n dismissBtn.addEventListener('click', function (e) {\n closeNotification(wrapper);\n }, false);\n }\n }\n}\nexport default iamNotification;\n"],"names":["setupNotification","element","holder","e","closeNotification","timeOut","timer","Timer","event","callback","delay","timerId","start","remaining","iamNotification","assetLocation","coreCSS","buttons","button","index","template","dismissBtn","statusBG","wrapper"],"mappings":"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"}
1
+ {"version":3,"file":"notification.component.min.js","sources":["../../modules/notification.js","notification.component.js"],"sourcesContent":["// @ts-nocheck\nfunction setupNotification(element) {\n // Add toast to notification holder\n if (element.hasAttribute('data-type') && element.getAttribute('data-type') == \"toast\") {\n let holder = document.querySelector('.notification__holder');\n if (!holder) {\n holder = document.createElement('div');\n holder.classList.add('notification__holder');\n holder.classList.add('container');\n document.querySelector('body').appendChild(holder);\n }\n if (!element.closest('.notification__holder'))\n holder.appendChild(element);\n }\n element.setAttribute('role', 'alert');\n // Create a dissmissable button\n element.addEventListener('click', function (e) {\n if (event && event.target instanceof HTMLElement && event.target.closest('[data-dismiss-button]')) {\n e.preventDefault();\n closeNotification(element);\n }\n }, false);\n // Self disappearing alert\n if (element.hasAttribute('data-timeout')) {\n let timeOut = element.getAttribute('data-timeout');\n var timer = new Timer(function () {\n closeNotification(element);\n }, timeOut);\n element.addEventListener(\"mouseenter\", (event) => {\n timer.pause();\n });\n element.addEventListener(\"mouseleave\", (event) => {\n timer.resume();\n });\n }\n}\nfunction Timer(callback, delay) {\n var timerId, start, remaining = delay;\n this.pause = function () {\n window.clearTimeout(timerId);\n remaining -= new Date() - start;\n };\n this.resume = function () {\n start = new Date();\n window.clearTimeout(timerId);\n timerId = window.setTimeout(callback, remaining);\n };\n this.resume();\n}\nexport const closeNotification = function (element) {\n element.classList.add('d-none');\n};\nexport default setupNotification;\n","// @ts-nocheck\nimport setupNotification, { closeNotification } from \"../../modules/notification.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Notification\"\n});\nclass iamNotification 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/notification.css\";`;\n const loadExtraCSS = `@import \"${assetLocation}/css/components/notification.global.css\";`;\n const buttons = this.querySelectorAll('a,button');\n Array.from(buttons).forEach((button, index) => {\n button.setAttribute('slot', 'btns');\n button.classList.add('link');\n });\n if (buttons.length || this.hasAttribute('data-dismiss'))\n this.classList.add('notification--dismissable');\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('data-css') ? `${this.getAttribute('data-css')}` : ``}\n </style>\n\n <div class=\"notification\">\n <div class=\"notification__icon\"><slot name=\"icon\"></slot></div>\n <div class=\"notification__inner\"><div class=\"notification__text\"><slot></slot></div>${buttons.length ? `<div class=\"notification__btns\"><slot name=\"btns\"></slot></div>` : ''}</div>\n ${this.hasAttribute('data-dismiss') ? `<div class=\"notification__dismiss\"><button data-dismiss-button part=\"dismiss-btn\">Dismiss</button></div>` : ''}\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n // insert extra CSS\n if (!document.getElementById('notificationHolder'))\n document.head.insertAdjacentHTML('beforeend', `<style id=\"notificationHolder\">${loadExtraCSS}</style>`);\n }\n connectedCallback() {\n const dismissBtn = this.shadowRoot.querySelector('[data-dismiss-button]');\n const statusBG = this.hasAttribute('data-status') ? this.getAttribute('data-status') : 'white';\n if (this.hasAttribute('data-type'))\n this.classList.add(`bg-${statusBG}`);\n else {\n this.classList.add(`colour-${statusBG}`);\n }\n const wrapper = this;\n if (!this.querySelector('i')) {\n switch (statusBG) {\n case 'danger':\n this.innerHTML += '<i class=\"fa-solid fa-circle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>';\n break;\n case 'warning':\n this.innerHTML += '<i class=\"fa-solid fa-triangle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>';\n break;\n case 'success':\n this.innerHTML += '<i class=\"fa-solid fa-check-circle\" aria-hidden=\"true\" slot=\"icon\"></i>';\n break;\n default:\n this.innerHTML += '<i class=\"fa-solid fa-circle-info\" aria-hidden=\"true\" slot=\"icon\"></i>';\n }\n }\n setupNotification(wrapper);\n if (dismissBtn) {\n dismissBtn.addEventListener('click', function (e) {\n closeNotification(wrapper);\n }, false);\n }\n }\n}\nexport default iamNotification;\n"],"names":["setupNotification","element","holder","e","closeNotification","timeOut","timer","Timer","event","callback","delay","timerId","start","remaining","iamNotification","assetLocation","coreCSS","buttons","button","index","template","dismissBtn","statusBG","wrapper"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */class v extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const i=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"):`${i}/css/core.min.css`,e=document.createElement("template");e.innerHTML=`
5
5
  <style>
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v5.6.0
2
+ * iamKey v5.6.1-beta10
3
3
  * Copyright 2022-2024 iamproperty
4
4
  */import k from"js-cookie";const q=e=>e.replace(/ /g,"_"),x=function(e){return e=e.toLowerCase(),e=q(e),e=e.replace(/\W/g,""),e},m=(e,s,a)=>s.split(/[\.\[\]\'\"]/).filter(o=>o).reduce((o,d)=>o?o[d]:a,e),S=e=>Array.isArray(e)||e!==null&&["function","object"].includes(typeof e);var L=function(e,s,a,o){function d(c){return c instanceof a?c:new a(function(n){n(c)})}return new(a||(a=Promise))(function(c,n){function v(r){try{u(o.next(r))}catch(i){n(i)}}function t(r){try{u(o.throw(r))}catch(i){n(i)}}function u(r){r.done?c(r.value):d(r.value).then(v,t)}u((o=o.apply(e,s||[])).next())})};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Search"});class C extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const s=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",a=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${s}/css/core.min.css`,o=document.createElement("template");o.innerHTML=`
5
5
  <style>