@iamproperty/components 5.5.1-beta-4 → 5.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/components/actionbar.css +1 -1
- package/assets/css/components/actionbar.css.map +1 -1
- package/assets/css/components/actionbar.global.css +1 -1
- package/assets/css/components/actionbar.global.css.map +1 -1
- package/assets/css/components/card.css +1 -1
- package/assets/css/components/card.css.map +1 -1
- package/assets/css/components/card.global.css +1 -1
- package/assets/css/components/card.global.css.map +1 -1
- package/assets/css/components/pagination.css +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/core.min.css +1 -1
- package/assets/css/core.min.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.js +2 -0
- package/assets/js/components/actionbar/actionbar.component.min.js +7 -5
- package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
- package/assets/js/components/address-lookup/address-lookup.component.min.js +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js +2 -2
- package/assets/js/components/applied-filters/applied-filters.component.min.js.map +1 -1
- package/assets/js/components/card/card.component.js +8 -5
- package/assets/js/components/card/card.component.min.js +8 -6
- package/assets/js/components/card/card.component.min.js.map +1 -1
- package/assets/js/components/carousel/carousel.component.min.js +28 -0
- package/assets/js/components/carousel/carousel.component.min.js.map +1 -0
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +1 -1
- package/assets/js/components/fileupload/fileupload.component.js +4 -3
- package/assets/js/components/fileupload/fileupload.component.min.js +5 -5
- package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
- package/assets/js/components/header/header.component.min.js +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.js +2 -4
- package/assets/js/components/inline-edit/inline-edit.component.min.js +2 -2
- package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
- package/assets/js/components/marketing/marketing.component.min.js +17 -0
- package/assets/js/components/marketing/marketing.component.min.js.map +1 -0
- package/assets/js/components/multiselect/multiselect.component.min.js +1 -1
- package/assets/js/components/nav/nav.component.min.js +1 -1
- package/assets/js/components/notification/notification.component.min.js +1 -1
- package/assets/js/components/pagination/pagination.component.min.js +2 -2
- package/assets/js/components/search/search.component.min.js +1 -1
- package/assets/js/components/slider/slider.component.min.js +19 -0
- package/assets/js/components/slider/slider.component.min.js.map +1 -0
- package/assets/js/components/table/table.component.js +26 -14
- package/assets/js/components/table/table.component.min.js +4 -4
- package/assets/js/components/table/table.component.min.js.map +1 -1
- package/assets/js/components/tabs/tabs.component.min.js +1 -1
- package/assets/js/dynamic.min.js +1 -1
- package/assets/js/modules/applied-filters.js +5 -1
- package/assets/js/modules/fileupload.js +9 -0
- package/assets/js/modules/table.js +42 -18
- package/assets/js/scripts.bundle.js +11 -9
- package/assets/js/scripts.bundle.js.map +1 -1
- package/assets/js/scripts.bundle.min.js +2 -2
- package/assets/js/scripts.bundle.min.js.map +1 -1
- package/assets/sass/components/actionbar.global.scss +10 -0
- package/assets/sass/components/actionbar.scss +21 -3
- package/assets/sass/components/card.global.scss +30 -1
- package/assets/sass/components/card.scss +80 -33
- package/assets/sass/components/pagination.scss +1 -1
- package/assets/sass/elements/badge-tag.scss +11 -4
- package/assets/sass/elements/forms.scss +5 -2
- package/assets/ts/components/actionbar/actionbar.component.ts +2 -0
- package/assets/ts/components/card/card.component.ts +8 -5
- package/assets/ts/components/fileupload/fileupload.component.ts +4 -3
- package/assets/ts/components/inline-edit/inline-edit.component.ts +2 -8
- package/assets/ts/components/table/table.component.ts +28 -21
- package/assets/ts/modules/applied-filters.ts +4 -1
- package/assets/ts/modules/fileupload.ts +15 -0
- package/assets/ts/modules/table.ts +50 -19
- package/dist/components.es.js +497 -591
- package/dist/components.umd.js +66 -119
- package/package.json +1 -1
- package/src/components/AddressLookup/AddressLookup.vue +1 -1
- package/src/components/AppliedFilters/AppliedFilters.vue +13 -7
- package/src/components/Card/Card.vue +2 -2
- package/src/components/Carousel/Carousel.vue +1 -1
- package/src/components/Marketing/Marketing.vue +1 -1
- package/src/components/Slider/Slider.vue +1 -1
- package/src/components/Table/Table.vue +2 -1
- package/src/components/Tabs/Tabs.vue +2 -2
- package/dist/README.md +0 -21
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.component.min.js","sources":["card.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Card\"\n});\nclass iamCard extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n if (this.querySelector('[class*=\"fa-\"]'))\n this.classList.add('card--has-icon');\n let classList = this.classList.toString();\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/card.css\";`;\n const loadExtraCSS = `@import \"${assetLocation}/css/components/card.global.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n <div class=\"card ${classList}\" tabindex=\"0\" part=\"card\">\n ${this.hasAttribute('data-image') ? `<div class=\"card__head\"><img src=\"${this.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" /><div class=\"card__badges\"><slot name=\"badges\"></slot></div></div>` : ''}\n <div class=\"card__body\">\n ${!this.hasAttribute('data-image') ? `<div class=\"card__badges\"><slot name=\"badges\"></slot></div>` : ''}\n ${this.hasAttribute('data-illustration') ? `<div class=\"card__illustration\"><img src=\"${this.getAttribute('data-illustration')}\" alt=\"\" loading=\"lazy\" /></div>` : ''}\n <slot></slot>\n ${this.hasAttribute('data-total') ? `<div class=\"card__total\">${this.getAttribute('data-total')}</div>` : ''}\n </div>\n ${this.hasAttribute('data-add-link') ? `<button class=\"btn btn-compact btn-secondary fa-plus\">Add property</button>` : ''}\n <slot name=\"checkbox\"></slot>\n <div class=\"card__footer\">\n <slot name=\"footer\"></slot>\n ${this.hasAttribute('data-cta') ? `<span class=\"link d-inline-block pt-0 mb-0\">${this.getAttribute('data-cta')}</span>` : ''}\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n // insert extra CSS\n if (!document.getElementById('cardGlobal'))\n document.head.insertAdjacentHTML('beforeend', `<style id=\"cardGlobal\">${loadExtraCSS}</style>`);\n }\n connectedCallback() {\n this.classList.add('loaded');\n // Mimic clicking the parent node so the focus and target events can be on the card\n const parentNode = this.parentNode.closest('a, button, label');\n const card = this.shadowRoot.querySelector('.card');\n const btnCompact = this.shadowRoot.querySelector('.btn-compact');\n parentNode.setAttribute('tabindex', '-1');\n if (parentNode.matches('label[for]')) {\n let isChecked = document.getElementById(parentNode.getAttribute('for')).checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n // Click event down\n this.addEventListener('click', (event) => {\n let clickEvent = new Event('click');\n card.dispatchEvent(clickEvent);\n });\n card.addEventListener('click', (event) => {\n if (parentNode.matches('label[for]')) {\n event.stopPropagation();\n event.preventDefault();\n const input = document.getElementById(parentNode.getAttribute('for'));\n const inputName = input.getAttribute('name');\n const inputID = input.getAttribute('id');\n // Mimic radio button functionality\n const inputs = Array.from(document.querySelectorAll(`[name=\"${inputName}\"][type=\"radio\"]:not([id=\"${inputID}\"])`));\n inputs.forEach((input, index) => {\n const otherCard = document.querySelector(`[for=\"${input.getAttribute('id')}\"] iam-card`);\n otherCard.dispatchEvent(new Event('inactive'));\n });\n parentNode.click();\n let isChecked = input.checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n });\n this.addEventListener('inactive', (event) => {\n card.classList.remove('checked');\n });\n card.addEventListener('keydown', (event) => {\n switch (event.keyCode) {\n case 32:\n case 13:\n if (parentNode.matches('label[for]')) {\n event.stopPropagation();\n event.preventDefault();\n const input = document.getElementById(parentNode.getAttribute('for'));\n const inputName = input.getAttribute('name');\n const inputID = input.getAttribute('id');\n const inputs = Array.from(document.querySelectorAll(`[name=\"${inputName}\"]:not([id=\"${inputID}\"])`));\n inputs.forEach((input, index) => {\n const otherCard = document.querySelector(`[for=\"${input.getAttribute('id')}\"] iam-card`);\n otherCard.dispatchEvent(new Event('inactive'));\n });\n parentNode.click();\n let isChecked = input.checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n else {\n parentNode.click();\n }\n break;\n default:\n break;\n }\n });\n if (btnCompact) {\n let addLocation = this.getAttribute('data-add-link');\n btnCompact.addEventListener('click', (event) => {\n event.stopPropagation();\n event.preventDefault();\n window.location = addLocation;\n });\n }\n }\n static get observedAttributes() {\n return [\"data-total\", \"class\"];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case \"data-total\": {\n if (this.shadowRoot.querySelector('.card__total'))\n this.shadowRoot.querySelector('.card__total').innerHTML = newVal;\n break;\n }\n case \"class\": {\n let classList = this.classList.toString();\n if (this.querySelector('[class*=\"fa-\"]'))\n classList += ' card--has-icon';\n this.shadowRoot.querySelector('.card').setAttribute('class', `card ${classList}`);\n break;\n }\n }\n }\n}\nexport default iamCard;\n"],"names":["iamCard","classList","assetLocation","coreCSS","template","parentNode","card","btnCompact","event","clickEvent","input","inputName","inputID","index","addLocation","attrName","oldVal","newVal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"card.component.min.js","sources":["card.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Card\"\n});\nclass iamCard extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n if (this.querySelector('*:not(.badge):not(small):not(.btn) > [class*=\"fa-\"]:not(.btn)'))\n this.classList.add('card--has-icon');\n let classList = this.classList.toString();\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/card.css\";`;\n const loadExtraCSS = `@import \"${assetLocation}/css/components/card.global.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n <div class=\"card ${classList}\" tabindex=\"0\" part=\"card\">\n ${this.hasAttribute('data-image') ? `<div class=\"card__head\"><img src=\"${this.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" /><div class=\"card__badges\"><slot name=\"badges\"></slot></div></div>` : ''}\n <div class=\"card__body\">\n ${!this.hasAttribute('data-image') && this.querySelector('[slot=\"badges\"]') && this.querySelector('[slot=\"checkbox\"]') ? `<div class=\"card__badges card__badges--inline\"><slot name=\"badges\"></slot></div>` : ''}\n ${!this.hasAttribute('data-image') && this.querySelector('[slot=\"badges\"]') ? `<div class=\"card__badges\"><slot name=\"badges\"></slot></div>` : ''}\n ${this.hasAttribute('data-illustration') ? `<div class=\"card__illustration\"><img src=\"${this.getAttribute('data-illustration')}\" alt=\"\" loading=\"lazy\" /></div>` : ''}\n <slot></slot>\n ${this.hasAttribute('data-total') ? `<div class=\"card__total\">${this.getAttribute('data-total')}</div>` : ''}\n </div>\n ${this.hasAttribute('data-add-link') ? `<button class=\"btn btn-compact btn-secondary fa-plus\">Add property</button>` : ''}\n <slot name=\"checkbox\"></slot>\n <div class=\"card__footer\">\n <slot name=\"footer\"></slot>\n <slot name=\"btns\"></slot>\n ${this.hasAttribute('data-cta') ? `<span class=\"link d-inline-block pt-0 mb-0\">${this.getAttribute('data-cta')}</span>` : ''}\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n // insert extra CSS\n if (!document.getElementById('cardGlobal'))\n document.head.insertAdjacentHTML('beforeend', `<style id=\"cardGlobal\">${loadExtraCSS}</style>`);\n }\n connectedCallback() {\n this.classList.add('loaded');\n // Mimic clicking the parent node so the focus and target events can be on the card\n const parentNode = this.parentNode.closest('a, button, label, router-link');\n const card = this.shadowRoot.querySelector('.card');\n const btnCompact = this.shadowRoot.querySelector('.btn-compact');\n if (parentNode)\n parentNode.setAttribute('tabindex', '-1');\n if (parentNode.matches('label[for]')) {\n let isChecked = document.getElementById(parentNode.getAttribute('for')).checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n // Click event down\n this.addEventListener('click', (event) => {\n let clickEvent = new Event('click');\n card.dispatchEvent(clickEvent);\n });\n card.addEventListener('click', (event) => {\n if (parentNode.matches('label[for]')) {\n event.stopPropagation();\n event.preventDefault();\n const input = document.getElementById(parentNode.getAttribute('for'));\n const inputName = input.getAttribute('name');\n const inputID = input.getAttribute('id');\n // Mimic radio button functionality\n const inputs = Array.from(document.querySelectorAll(`[name=\"${inputName}\"][type=\"radio\"]:not([id=\"${inputID}\"])`));\n inputs.forEach((input, index) => {\n const otherCard = document.querySelector(`[for=\"${input.getAttribute('id')}\"] iam-card`);\n otherCard.dispatchEvent(new Event('inactive'));\n });\n parentNode.click();\n let isChecked = input.checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n });\n this.addEventListener('inactive', (event) => {\n card.classList.remove('checked');\n });\n card.addEventListener('keydown', (event) => {\n switch (event.keyCode) {\n case 32:\n case 13:\n if (parentNode.matches('label[for]')) {\n event.stopPropagation();\n event.preventDefault();\n const input = document.getElementById(parentNode.getAttribute('for'));\n const inputName = input.getAttribute('name');\n const inputID = input.getAttribute('id');\n const inputs = Array.from(document.querySelectorAll(`[name=\"${inputName}\"]:not([id=\"${inputID}\"])`));\n inputs.forEach((input, index) => {\n const otherCard = document.querySelector(`[for=\"${input.getAttribute('id')}\"] iam-card`);\n otherCard.dispatchEvent(new Event('inactive'));\n });\n parentNode.click();\n let isChecked = input.checked;\n if (isChecked)\n card.classList.add('checked');\n else\n card.classList.remove('checked');\n }\n else {\n parentNode.click();\n }\n break;\n default:\n break;\n }\n });\n if (btnCompact) {\n let addLocation = this.getAttribute('data-add-link');\n btnCompact.addEventListener('click', (event) => {\n event.stopPropagation();\n event.preventDefault();\n window.location = addLocation;\n });\n }\n }\n static get observedAttributes() {\n return [\"data-total\", \"class\"];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case \"data-total\": {\n if (this.shadowRoot.querySelector('.card__total'))\n this.shadowRoot.querySelector('.card__total').innerHTML = newVal;\n break;\n }\n case \"class\": {\n let classList = this.classList.toString();\n if (this.querySelector('*:not(.badge):not(small):not(.btn) > [class*=\"fa-\"]:not(.btn)'))\n classList += ' card--has-icon';\n this.shadowRoot.querySelector('.card').setAttribute('class', `card ${classList}`);\n break;\n }\n }\n }\n}\nexport default iamCard;\n"],"names":["iamCard","classList","assetLocation","coreCSS","template","parentNode","card","btnCompact","event","clickEvent","input","inputName","inputID","index","addLocation","attrName","oldVal","newVal"],"mappings":"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"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* iamKey v5.6.0
|
|
3
|
+
* Copyright 2022-2024 iamproperty
|
|
4
|
+
*/function b(l,r){var n;let s=l.querySelector(".carousel__inner"),i=l.querySelector(".carousel__controls"),e=r.querySelectorAll(".col").length;s.addEventListener("scroll",function(o){clearTimeout(n),n=setTimeout(function(){let t=s.clientWidth,c=s.scrollWidth,d=s.scrollLeft,a=Math.round(d/c*e)+1,h=r.querySelector(".col:last-child").offsetLeft+50;s.scrollLeft+t>=h&&(a=e),Array.from(l.querySelectorAll(".carousel__controls button")).forEach((u,f)=>{u.removeAttribute("aria-current")}),l.querySelector(".control-"+a).setAttribute("aria-current",!0),a==1?l.querySelector(".btn-prev").setAttribute("disabled","disabled"):l.querySelector(".btn-prev").removeAttribute("disabled"),a==e?l.querySelector(".btn-next").setAttribute("disabled","disabled"):l.querySelector(".btn-next").removeAttribute("disabled")},100)},!1),i.addEventListener("click",function(o){for(var t=o.target;t&&t!=this;t=t.parentNode)if(typeof t.matches=="function"&&t.matches("button")){o.preventDefault(),Array.from(i.querySelectorAll("button")).forEach((d,a)=>{d.removeAttribute("aria-current")}),t.setAttribute("aria-current",!0);const c=r.querySelector(`*:nth-child(${t.getAttribute("data-slide")})`);s.scroll({top:0,left:c.offsetLeft,behavior:"smooth"});break}},!1),l.addEventListener("click",function(o){for(var t=o.target;t&&t!=this;t=t.parentNode)if(typeof t.matches=="function"&&t.matches(".btn-next, .btn-prev")){o.preventDefault();let c=t.classList.contains("btn-prev")?s.scrollLeft-s.clientWidth:s.scrollLeft+s.clientWidth;s.scroll({top:0,left:c,behavior:"smooth"});break}},!1)}window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"carousel"});class m extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const r=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",n=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${r}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
|
|
5
|
+
<style>
|
|
6
|
+
@import "${n}";
|
|
7
|
+
.carousel .carousel__wrapper{position:relative}.carousel .carousel__inner{--gutter-x: 1rem;overflow:auto;scroll-snap-type:x mandatory}.carousel .col>*:last-child{margin-bottom:0;padding-bottom:0}.carousel__inner{scrollbar-width:none;-ms-overflow-style:none}.carousel__inner::-webkit-scrollbar{display:none}.btn-next,.btn-prev{--marker-bg: var(--colour-secondary);text-indent:100%;white-space:nowrap;overflow:hidden;background:var(--marker-bg);border-radius:100%;width:2.25rem;max-width:2.25rem;height:2.25rem;text-indent:-300rem;overflow:hidden;border:none;position:relative;margin:0 0.5rem;padding:0;position:absolute;top:50%;left:0rem;transform:translate(0, -50%)}.btn-next:disabled,.btn-prev:disabled{opacity:.8;pointer-events:none}.btn-next:after,.btn-prev:after{content:"";position:absolute;right:0;top:0;height:100%;width:100%;background:currentColor;mask-image:var(--icon-arrow);mask-size:50%;mask-repeat:no-repeat;mask-position:50% 60%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:55% 50%;transform:rotate(0deg)}.btn-next:hover,.btn-next:focus,.btn-prev:hover,.btn-prev:focus{background:var(--colour-warning);color:var(--colour-hover);border-radius:100%}.btn-next:active,.btn-prev:active{border-radius:100%}.btn-next{left:auto;right:0}@media screen and (min-width: 62em){.btn-next{margin-right:-3rem}}@media screen and (min-width: 62em){.btn-prev{margin-left:-3rem}}.btn-prev:after{transform:rotate(180deg)}.carousel .carousel__controls{text-align:center;width:10rem;max-height:1rem;overflow:hidden;margin-inline:auto}@media screen and (min-width: 36em){.carousel .carousel__controls{width:100%}}.carousel .carousel__controls button{width:1rem;height:1rem;min-height:1rem;border-radius:50%;text-indent:-50rem;overflow:hidden;background:var(--colour-primary-theme);padding:0;margin:0 .5rem .5rem .5rem;border:none}.carousel .carousel__controls button:before{display:none}.carousel .carousel__controls button:first-child:last-child{display:none}.carousel__controls>button[aria-current]{background:var(--colour-success)}.carousel.hide-btns .carousel__wrapper>.btn{display:none}.carousel.hide-controls .carousel__controls{display:none}@media screen and (min-width: 36em){[data-row-class*=cols-sm-2] .carousel__controls>button:not(:nth-child(odd)),[data-row-class*=cols-sm-3] .carousel__controls>button:not(:nth-child(3n+1)),[data-row-class*=cols-sm-4] .carousel__controls>button:not(:nth-child(4n+1)),[data-row-class*=cols-sm-5] .carousel__controls>button:not(:nth-child(5n+1)),[data-row-class*=cols-sm-6] .carousel__controls>button:not(:nth-child(6n+1)){display:none}[data-row-class*=cols-sm-2] .carousel__controls:has(button:first-child:nth-last-child(2)),[data-row-class*=cols-sm-3] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3))),[data-row-class*=cols-sm-4] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4))),[data-row-class*=cols-sm-5] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5))),[data-row-class*=cols-sm-6] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5),button:first-child:nth-last-child(6))),[data-row-class*=cols-sm-2] .carousel__controls:has(button:first-child:nth-last-child(2))~.btn,[data-row-class*=cols-sm-3] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3)))~.btn,[data-row-class*=cols-sm-4] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4)))~.btn,[data-row-class*=cols-sm-5] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5)))~.btn,[data-row-class*=cols-sm-6] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5),button:first-child:nth-last-child(6)))~.btn{display:none}}@media screen and (min-width: 62em){.carousel__controls>button{display:inline-block !important}[data-row-class*=cols-md-2] .carousel__controls>button:not(:nth-child(odd)),[data-row-class*=cols-md-3] .carousel__controls>button:not(:nth-child(3n+1)),[data-row-class*=cols-md-4] .carousel__controls>button:not(:nth-child(4n+1)),[data-row-class*=cols-md-5] .carousel__controls>button:not(:nth-child(5n+1)),[data-row-class*=cols-md-6] .carousel__controls>button:not(:nth-child(6n+1)){display:none !important}[data-row-class*=cols-md-2] .carousel__controls:has(button:first-child:nth-last-child(2)),[data-row-class*=cols-md-3] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3))),[data-row-class*=cols-md-4] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4))),[data-row-class*=cols-md-5] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5))),[data-row-class*=cols-md-6] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5),button:first-child:nth-last-child(6))),[data-row-class*=cols-md-2] .carousel__controls:has(button:first-child:nth-last-child(2))~.btn,[data-row-class*=cols-md-3] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3)))~.btn,[data-row-class*=cols-md-4] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4)))~.btn,[data-row-class*=cols-md-5] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5)))~.btn,[data-row-class*=cols-md-6] .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5),button:first-child:nth-last-child(6)))~.btn{display:none}}/*# sourceMappingURL=assets/css/components/carousel.css.map */
|
|
8
|
+
|
|
9
|
+
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
10
|
+
</style>
|
|
11
|
+
<div class="carousel" :id="'carousel'+id">
|
|
12
|
+
<div class="carousel__wrapper">
|
|
13
|
+
<div class="carousel__inner">
|
|
14
|
+
|
|
15
|
+
<slot></slot>
|
|
16
|
+
</div>
|
|
17
|
+
|
|
18
|
+
<div class="carousel__controls">
|
|
19
|
+
|
|
20
|
+
</div>
|
|
21
|
+
|
|
22
|
+
<button class="btn btn-prev" data-go="0" disabled>Prev</button>
|
|
23
|
+
<button class="btn btn-next" data-go="2">Next</button>
|
|
24
|
+
|
|
25
|
+
</div>
|
|
26
|
+
</div>
|
|
27
|
+
`,this.shadowRoot.appendChild(s.content.cloneNode(!0))}connectedCallback(){const r=this.shadowRoot.querySelector(".carousel"),n=this.querySelector(".row"),s=this.shadowRoot.querySelector(".carousel__controls");let i=this.querySelectorAll(":scope > .row > .col").length;r.setAttribute("data-row-class",n.className),this.classList.contains("hide-btns")&&r.classList.add("hide-btns"),this.classList.contains("hide-controls")&&r.classList.add("hide-controls");let e="";for(let o=1;o<=i;o++)e+=`<button class="control-${o}" data-slide="${o}" ${o==1?"aria-current":""}>Slide ${o}</button>`;s.innerHTML=e,b(r,n)}}export{m as default};
|
|
28
|
+
//# sourceMappingURL=carousel.component.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","carousel.component.js"],"sourcesContent":["// @ts-nocheck\nfunction carousel(carouselElement, row) {\n var scrollTimeout;\n let carouselInner = carouselElement.querySelector('.carousel__inner');\n let carouselControls = carouselElement.querySelector('.carousel__controls');\n let itemCount = row.querySelectorAll('.col').length;\n // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n carouselInner.addEventListener('scroll', function (e) {\n clearTimeout(scrollTimeout);\n scrollTimeout = setTimeout(function () {\n let scrollArea = carouselInner.clientWidth;\n let scrollWidth = carouselInner.scrollWidth;\n let scrollLeft = carouselInner.scrollLeft;\n let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n let lastItemOffset = row.querySelector('.col:last-child').offsetLeft + 50;\n if (carouselInner.scrollLeft + scrollArea >= lastItemOffset)\n targetSlide = itemCount;\n Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button, index) => {\n button.removeAttribute('aria-current');\n });\n carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n // Disable the previous button\n if (targetSlide == 1)\n carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n // Disable the next button if the last item is in view\n if (targetSlide == itemCount)\n carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n }, 100);\n }, false);\n // when the buttons are used we need to make sure the carousel scrolls to the correct place\n carouselControls.addEventListener('click', function (e) {\n for (var target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == \"function\" && target.matches('button')) {\n e.preventDefault();\n Array.from(carouselControls.querySelectorAll('button')).forEach((button, index) => {\n button.removeAttribute('aria-current');\n });\n target.setAttribute('aria-current', true);\n const el = row.querySelector(`*:nth-child(${target.getAttribute('data-slide')})`);\n carouselInner.scroll({\n top: 0,\n left: el.offsetLeft,\n behavior: 'smooth'\n });\n break;\n }\n }\n }, false);\n carouselElement.addEventListener('click', function (e) {\n for (var target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == \"function\" && target.matches('.btn-next, .btn-prev')) {\n e.preventDefault();\n let scrollTo = target.classList.contains('btn-prev') ? carouselInner.scrollLeft - carouselInner.clientWidth : carouselInner.scrollLeft + carouselInner.clientWidth;\n carouselInner.scroll({\n top: 0,\n left: scrollTo,\n behavior: 'smooth'\n });\n break;\n }\n }\n }, false);\n}\nexport default carousel;\n","// @ts-nocheck\nimport carousel from \"../../modules/carousel.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"carousel\"\n});\nclass iamCarousel extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/carousel.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"carousel\" :id=\"'carousel'+id\">\n <div class=\"carousel__wrapper\">\n <div class=\"carousel__inner\">\n \n <slot></slot>\n </div>\n \n <div class=\"carousel__controls\">\n \n </div>\n\n <button class=\"btn btn-prev\" data-go=\"0\" disabled>Prev</button>\n <button class=\"btn btn-next\" data-go=\"2\">Next</button>\n\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const carouselElement = this.shadowRoot.querySelector('.carousel');\n const row = this.querySelector('.row');\n const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n let itemCount = this.querySelectorAll(':scope > .row > .col').length;\n carouselElement.setAttribute('data-row-class', row.className);\n if (this.classList.contains('hide-btns'))\n carouselElement.classList.add('hide-btns');\n if (this.classList.contains('hide-controls'))\n carouselElement.classList.add('hide-controls');\n // populate the pips\n let pips = \"\";\n for (let i = 1; i <= itemCount; i++) {\n pips += `<button class=\"control-${i}\" data-slide=\"${i}\" ${i == 1 ? \"aria-current\" : \"\"}>Slide ${i}</button>`;\n }\n carouselControls.innerHTML = pips;\n carousel(carouselElement, row);\n }\n}\nexport default iamCarousel;\n"],"names":["carousel","carouselElement","row","scrollTimeout","carouselInner","carouselControls","itemCount","e","scrollArea","scrollWidth","scrollLeft","targetSlide","lastItemOffset","button","index","target","el","scrollTo","iamCarousel","assetLocation","coreCSS","template","pips","i"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
3
3
|
* Copyright 2022-2024 iamproperty
|
|
4
4
|
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"collapsible side menu"});class s extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",t=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,n=document.createElement("template");n.innerHTML=`
|
|
5
5
|
<style class="styles">
|
|
@@ -22,8 +22,8 @@ class iamFileupload extends HTMLElement {
|
|
|
22
22
|
</style>
|
|
23
23
|
<div class="file-upload">
|
|
24
24
|
<span class="file-upload__title">Upload file</span>
|
|
25
|
-
<p class="helper-text"></p>
|
|
26
|
-
<button class="btn btn-primary"><slot name="btn"></slot> Upload
|
|
25
|
+
<p class="helper-text"><slot name="helper"></slot></p>
|
|
26
|
+
<button class="btn btn-primary"><slot name="btn"></slot> Upload ${this.hasAttribute('data-filetype') ? this.getAttribute('data-filetype') : 'file'}</button>
|
|
27
27
|
<div class="drop-area"></div>
|
|
28
28
|
<hr/>
|
|
29
29
|
<slot></slot>
|
|
@@ -37,7 +37,8 @@ class iamFileupload extends HTMLElement {
|
|
|
37
37
|
const wrapper = this.shadowRoot.querySelector('.file-upload');
|
|
38
38
|
const input = this.querySelector('input');
|
|
39
39
|
const helperText = this.shadowRoot.querySelector('.helper-text');
|
|
40
|
-
|
|
40
|
+
if (!this.querySelector('[slot="helper"]'))
|
|
41
|
+
helperText.innerHTML = `${this.hasAttribute('data-maxsize') ? `Max file size is ${this.getAttribute('data-maxsize')}kb. ` : ''}${input.hasAttribute('accept') ? `Supported file types are ${input.getAttribute('accept')}` : ''}`;
|
|
41
42
|
fileupload(this, wrapper);
|
|
42
43
|
}
|
|
43
44
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
3
3
|
* Copyright 2022-2024 iamproperty
|
|
4
|
-
*/function
|
|
4
|
+
*/function g(r,i){const n=i.querySelector(".files"),l=i.querySelector(".drop-area"),t=r.querySelector("input"),f=r.hasAttribute("data-maxsize")?r.getAttribute("data-maxsize"):0,a=t.cloneNode();if(l.append(a),i.addEventListener("click",e=>{e&&e.target instanceof HTMLElement&&e.target.closest(".btn-primary")&&(e.target.closest(".btn-primary"),(t.hasAttribute("multiple")?a:t).click())}),i.addEventListener("click",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest(".files button")){const o=new DataTransfer,{files:c}=t,p=e.target.closest(".files button");for(let s=0;s<c.length;s++){const d=c[s];d.name!=p.getAttribute("data-file")&&o.items.add(d)}if(t.files=o.files,t.files.length==0){const s=new Event("empty");r.dispatchEvent(s)}const m=new Event("change");t.dispatchEvent(m)}}),a.addEventListener("change",e=>{if(t.hasAttribute("multiple")){const p=[...t.files,...a.files];let m=[];const s=new DataTransfer;for(let d=0;d<p.length;d++){const u=p[d],h=u.size/1e3;!m.includes(u.name)&&(f==0||h<f)&&s.items.add(u),m.push(u.name)}t.files=s.files}else t.files=a.files;const o=new Event("change");t.dispatchEvent(o);const c=new Event("elementChange");r.dispatchEvent(c)}),a.addEventListener("dragenter",e=>{a.classList.add("focus")}),a.addEventListener("dragleave",e=>{a.classList.remove("focus")}),a.addEventListener("drop",e=>{a.classList.remove("focus")}),t.addEventListener("change",e=>{n.innerHTML="";for(const o of t.files)n.innerHTML+=`<span class="file">${o.name} <button data-file="${o.name}">Remove</button></span>`}),r.hasAttribute("data-filename")){let e=r.getAttribute("data-filename");e&&(n.innerHTML+=`<span class="file">${e} <button data-file="${e}">Remove</button></span>`)}i.addEventListener("click",e=>{e&&e.target instanceof HTMLElement&&e.target.closest(".btn-primary")&&(e.target.closest(".btn-primary"),(t.hasAttribute("multiple")?a:t).click())})}window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"fileupload"});class b extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const i=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",n=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${i}/css/core.min.css`,l=document.createElement("template");l.innerHTML=`
|
|
5
5
|
<style>
|
|
6
6
|
@import "${n}";
|
|
7
7
|
.file-upload{max-width:25rem !important;padding-bottom:1rem}.file-upload .drop-area>input{display:none}.file-upload .file-upload__title{margin-top:0;margin-bottom:0;font-family:var(--font-heading);font-style:normal;font-weight:var(--heading-weight);line-height:2rem;color:var(--colour-heading);clear:both;display:block;padding-bottom:2rem;font-size:1.5rem;line-height:2rem;padding-bottom:2rem;max-width:var(--content-max-width)}.file-upload .helper-text{max-width:16.875rem}.files span{display:block;width:100%;padding:var(--input-padding-block, 0.75rem) var(--input-padding-inline, 1rem);font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);border:2px solid var(--colour-primary-theme);appearance:none;border-radius:0.5rem;margin-bottom:1rem;color:var(--colour-primary);border-color:#d8d8d8;background:#d8d8d8;max-width:25rem !important;position:relative}@media screen and (prefers-color-scheme: dark){.files span{background:var(--colour-canvas-2);border-color:var(--colour-canvas-2);color:var(--colour-body)}}@media(forced-colors: active){.files span{padding-right:5rem}.files span button{padding:0;width:3.7rem !important;text-indent:0% !important}.files span button:after{display:none !important}}.files span button{position:absolute;top:calc(50% - 0.5625rem);right:0.875rem;z-index:var(--index-floating);text-indent:300%;overflow:hidden;border:none;height:1.125rem;width:1.125rem;background:rgba(0,0,0,0)}.files span button:after{content:"";top:0;left:0;position:absolute;display:block;height:1.125rem;width:1.125rem;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-close);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-close);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%}:host(.fileupload--drag-drop) .file-upload{max-width:50rem !important}:host(.fileupload--drag-drop) .file-upload .helper-text{max-width:50rem !important}:host(.fileupload--drag-drop) .file-upload .drop-area>input{display:block;min-height:12.5rem;border:2px dashed var(--colour-primary-theme);color:rgba(0,0,0,0);position:relative;padding:1.5rem 2rem 1.5rem 2rem;user-select:none;max-width:100%;min-width:100%}:host(.fileupload--drag-drop) .file-upload .drop-area>input.focus{border:2px solid var(--colour-info)}:host(.fileupload--drag-drop) .file-upload .drop-area{position:relative}:host(.fileupload--drag-drop) .file-upload .drop-area::before{content:"Drag and drop files here or click to upload";position:absolute;inset:1.5rem 2rem 1.5rem 2rem;z-index:1;pointer-events:none}:host(.fileupload--drag-drop) .file-upload ::file-selector-button{position:absolute;inset:0;opacity:0}/*# sourceMappingURL=assets/css/components/fileupload.css.map */
|
|
@@ -10,12 +10,12 @@
|
|
|
10
10
|
</style>
|
|
11
11
|
<div class="file-upload">
|
|
12
12
|
<span class="file-upload__title">Upload file</span>
|
|
13
|
-
<p class="helper-text"></p>
|
|
14
|
-
<button class="btn btn-primary"><slot name="btn"></slot> Upload
|
|
13
|
+
<p class="helper-text"><slot name="helper"></slot></p>
|
|
14
|
+
<button class="btn btn-primary"><slot name="btn"></slot> Upload ${this.hasAttribute("data-filetype")?this.getAttribute("data-filetype"):"file"}</button>
|
|
15
15
|
<div class="drop-area"></div>
|
|
16
16
|
<hr/>
|
|
17
17
|
<slot></slot>
|
|
18
18
|
<div class="files"><slot name="files"></slot></div>
|
|
19
19
|
</div>
|
|
20
|
-
`,this.shadowRoot.appendChild(l.content.cloneNode(!0))}connectedCallback(){this.innerHTML+='<i class="fa-regular fa-arrow-up-from-bracket me-2" aria-hidden="true" slot="btn"></i>';const i=this.shadowRoot.querySelector(".file-upload"),n=this.querySelector("input"),l=this.shadowRoot.querySelector(".helper-text");l.innerHTML=`${this.hasAttribute("data-maxsize")?`Max file size is ${this.getAttribute("data-maxsize")}kb. `:""}${n.hasAttribute("accept")?`Supported file types are ${n.getAttribute("accept")}`:""}
|
|
20
|
+
`,this.shadowRoot.appendChild(l.content.cloneNode(!0))}connectedCallback(){this.innerHTML+='<i class="fa-regular fa-arrow-up-from-bracket me-2" aria-hidden="true" slot="btn"></i>';const i=this.shadowRoot.querySelector(".file-upload"),n=this.querySelector("input"),l=this.shadowRoot.querySelector(".helper-text");this.querySelector('[slot="helper"]')||(l.innerHTML=`${this.hasAttribute("data-maxsize")?`Max file size is ${this.getAttribute("data-maxsize")}kb. `:""}${n.hasAttribute("accept")?`Supported file types are ${n.getAttribute("accept")}`:""}`),g(this,i)}}export{b as default};
|
|
21
21
|
//# sourceMappingURL=fileupload.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fileupload.component.min.js","sources":["../../modules/fileupload.js","fileupload.component.js"],"sourcesContent":["// @ts-nocheck\nfunction fileupload(fileupload, wrapper) {\n const filesWrapper = wrapper.querySelector('.files');\n const dropArea = wrapper.querySelector('.drop-area');\n const input = fileupload.querySelector('input');\n const maxSize = fileupload.hasAttribute('data-maxsize') ? fileupload.getAttribute('data-maxsize') : 0;\n // We clone the input field to work as a buffer input field, this allows us to add new files without losing the old ones\n const cloneInput = input.cloneNode();\n dropArea.append(cloneInput);\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.btn-primary')) {\n const button = event.target.closest('.btn-primary');\n // If the input allows multiples then use the buffer clone input\n const inputTrigger = input.hasAttribute('multiple') ? cloneInput : input;\n inputTrigger.click();\n }\n });\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.files button')) {\n const dt = new DataTransfer();\n const { files } = input;\n const button = event.target.closest('.files button');\n for (let i = 0; i < files.length; i++) {\n const file = files[i];\n if (file.name != button.getAttribute('data-file'))\n dt.items.add(file); // here you exclude the file. thus removing it.\n }\n input.files = dt.files; // Assign the updates list\n if (input.files.length == 0) {\n const emptyEvent = new Event('empty');\n fileupload.dispatchEvent(emptyEvent);\n }\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n }\n });\n // Buffer input change event\n cloneInput.addEventListener('change', (event) => {\n if (input.hasAttribute('multiple')) {\n const filesArray = [...input.files, ...cloneInput.files];\n let fileNames = [];\n const dt = new DataTransfer();\n for (let i = 0; i < filesArray.length; i++) {\n const file = filesArray[i];\n const size = file.size / 1000;\n if (!fileNames.includes(file.name) && (maxSize == 0 || size < maxSize))\n dt.items.add(file); // here you exclude the file. thus removing it.\n fileNames.push(file.name);\n }\n input.files = dt.files;\n }\n else {\n input.files = cloneInput.files;\n }\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n const elementChangeEvent = new Event('elementChange');\n fileupload.dispatchEvent(elementChangeEvent);\n });\n cloneInput.addEventListener('dragenter', (event) => {\n cloneInput.classList.add('focus');\n });\n cloneInput.addEventListener('dragleave', (event) => {\n cloneInput.classList.remove('focus');\n });\n cloneInput.addEventListener('drop', (event) => {\n cloneInput.classList.remove('focus');\n });\n input.addEventListener('change', (event) => {\n // Reset\n filesWrapper.innerHTML = '';\n for (const file of input.files)\n filesWrapper.innerHTML += `<span class=\"file\">${file.name} <button data-file=\"${file.name}\">Remove</button></span>`;\n });\n if (fileupload.hasAttribute('data-filename')) {\n let filename = fileupload.getAttribute('data-filename');\n if (filename)\n filesWrapper.innerHTML += `<span class=\"file\">${filename} <button data-file=\"${filename}\">Remove</button></span>`;\n }\n}\nexport default fileupload;\n","// @ts-nocheck\nimport fileupload from \"../../modules/fileupload.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"fileupload\"\n});\nclass iamFileupload extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/fileupload.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"file-upload\">\n <span class=\"file-upload__title\">Upload file</span>\n <p class=\"helper-text\"></p>\n <button class=\"btn btn-primary\"><slot name=\"btn\"></slot> Upload
|
|
1
|
+
{"version":3,"file":"fileupload.component.min.js","sources":["../../modules/fileupload.js","fileupload.component.js"],"sourcesContent":["// @ts-nocheck\nfunction fileupload(fileupload, wrapper) {\n const filesWrapper = wrapper.querySelector('.files');\n const dropArea = wrapper.querySelector('.drop-area');\n const input = fileupload.querySelector('input');\n const maxSize = fileupload.hasAttribute('data-maxsize') ? fileupload.getAttribute('data-maxsize') : 0;\n // We clone the input field to work as a buffer input field, this allows us to add new files without losing the old ones\n const cloneInput = input.cloneNode();\n dropArea.append(cloneInput);\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.btn-primary')) {\n const button = event.target.closest('.btn-primary');\n // If the input allows multiples then use the buffer clone input\n const inputTrigger = input.hasAttribute('multiple') ? cloneInput : input;\n inputTrigger.click();\n }\n });\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.files button')) {\n const dt = new DataTransfer();\n const { files } = input;\n const button = event.target.closest('.files button');\n for (let i = 0; i < files.length; i++) {\n const file = files[i];\n if (file.name != button.getAttribute('data-file'))\n dt.items.add(file); // here you exclude the file. thus removing it.\n }\n input.files = dt.files; // Assign the updates list\n if (input.files.length == 0) {\n const emptyEvent = new Event('empty');\n fileupload.dispatchEvent(emptyEvent);\n }\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n }\n });\n // Buffer input change event\n cloneInput.addEventListener('change', (event) => {\n if (input.hasAttribute('multiple')) {\n const filesArray = [...input.files, ...cloneInput.files];\n let fileNames = [];\n const dt = new DataTransfer();\n for (let i = 0; i < filesArray.length; i++) {\n const file = filesArray[i];\n const size = file.size / 1000;\n if (!fileNames.includes(file.name) && (maxSize == 0 || size < maxSize))\n dt.items.add(file); // here you exclude the file. thus removing it.\n fileNames.push(file.name);\n }\n input.files = dt.files;\n }\n else {\n input.files = cloneInput.files;\n }\n const changeEvent = new Event('change');\n input.dispatchEvent(changeEvent);\n const elementChangeEvent = new Event('elementChange');\n fileupload.dispatchEvent(elementChangeEvent);\n });\n cloneInput.addEventListener('dragenter', (event) => {\n cloneInput.classList.add('focus');\n });\n cloneInput.addEventListener('dragleave', (event) => {\n cloneInput.classList.remove('focus');\n });\n cloneInput.addEventListener('drop', (event) => {\n cloneInput.classList.remove('focus');\n });\n input.addEventListener('change', (event) => {\n // Reset\n filesWrapper.innerHTML = '';\n for (const file of input.files)\n filesWrapper.innerHTML += `<span class=\"file\">${file.name} <button data-file=\"${file.name}\">Remove</button></span>`;\n });\n if (fileupload.hasAttribute('data-filename')) {\n let filename = fileupload.getAttribute('data-filename');\n if (filename)\n filesWrapper.innerHTML += `<span class=\"file\">${filename} <button data-file=\"${filename}\">Remove</button></span>`;\n }\n // Change the filename\n wrapper.addEventListener('click', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('.btn-primary')) {\n const button = event.target.closest('.btn-primary');\n // If the input allows multiples then use the buffer clone input\n const inputTrigger = input.hasAttribute('multiple') ? cloneInput : input;\n inputTrigger.click();\n }\n });\n}\nexport default fileupload;\n","// @ts-nocheck\nimport fileupload from \"../../modules/fileupload.js\";\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"fileupload\"\n});\nclass iamFileupload extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css') ? document.body.getAttribute('data-core-css') : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/fileupload.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"file-upload\">\n <span class=\"file-upload__title\">Upload file</span>\n <p class=\"helper-text\"><slot name=\"helper\"></slot></p>\n <button class=\"btn btn-primary\"><slot name=\"btn\"></slot> Upload ${this.hasAttribute('data-filetype') ? this.getAttribute('data-filetype') : 'file'}</button>\n <div class=\"drop-area\"></div>\n <hr/>\n <slot></slot>\n <div class=\"files\"><slot name=\"files\"></slot></div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.innerHTML += '<i class=\"fa-regular fa-arrow-up-from-bracket me-2\" aria-hidden=\"true\" slot=\"btn\"></i>';\n const wrapper = this.shadowRoot.querySelector('.file-upload');\n const input = this.querySelector('input');\n const helperText = this.shadowRoot.querySelector('.helper-text');\n if (!this.querySelector('[slot=\"helper\"]'))\n helperText.innerHTML = `${this.hasAttribute('data-maxsize') ? `Max file size is ${this.getAttribute('data-maxsize')}kb. ` : ''}${input.hasAttribute('accept') ? `Supported file types are ${input.getAttribute('accept')}` : ''}`;\n fileupload(this, wrapper);\n }\n}\nexport default iamFileupload;\n"],"names":["fileupload","wrapper","filesWrapper","dropArea","input","maxSize","cloneInput","event","dt","files","button","i","file","emptyEvent","changeEvent","filesArray","fileNames","size","elementChangeEvent","filename","iamFileupload","assetLocation","coreCSS","template","helperText"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
3
3
|
* Copyright 2022-2024 iamproperty
|
|
4
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=`
|
|
5
5
|
<style>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
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>
|
|
@@ -45,7 +45,6 @@ class iamInlineEdit extends HTMLElement {
|
|
|
45
45
|
let originalValue = input.value;
|
|
46
46
|
// cancel
|
|
47
47
|
cancelButton.addEventListener('click', (event) => {
|
|
48
|
-
console.log(originalValue);
|
|
49
48
|
input.value = originalValue;
|
|
50
49
|
input.blur();
|
|
51
50
|
inlineEdit.blur();
|
|
@@ -71,7 +70,7 @@ class iamInlineEdit extends HTMLElement {
|
|
|
71
70
|
statusSaving.classList.remove('d-none');
|
|
72
71
|
});
|
|
73
72
|
// Save
|
|
74
|
-
if (input.tagName === '
|
|
73
|
+
if (input.tagName === 'INPUT') {
|
|
75
74
|
input.addEventListener('keydown', (event) => {
|
|
76
75
|
switch (event.key) { // change to event.key to key to use the above variable
|
|
77
76
|
case "Enter":
|
|
@@ -116,9 +115,8 @@ class iamInlineEdit extends HTMLElement {
|
|
|
116
115
|
});
|
|
117
116
|
}
|
|
118
117
|
//blur it should autosave
|
|
119
|
-
|
|
118
|
+
input.addEventListener('blur', (event) => {
|
|
120
119
|
if (input.value != originalValue) {
|
|
121
|
-
let feedbackText = '(Unsaved)';
|
|
122
120
|
if (inlineEdit.hasAttribute('data-autosave')) {
|
|
123
121
|
originalValue = input.value;
|
|
124
122
|
const saveEvent = new CustomEvent("inline-edit-autosave", { detail: { name: input.getAttribute('name'), value: input.value } });
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
3
3
|
* Copyright 2022-2024 iamproperty
|
|
4
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=`
|
|
5
5
|
<style class="styles">
|
|
@@ -18,5 +18,5 @@
|
|
|
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=>{
|
|
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};
|
|
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 console.log(originalValue);\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 inlineEdit.addEventListener('blur', (event) => {\n if (input.value != originalValue) {\n let feedbackText = '(Unsaved)';\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\">\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":";;;IAEA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,aACf,CAAC,EACD,MAAMA,UAAsB,WAAY,CACpC,aAAc,CACV,QACA,MAAMC,EAAa,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAC/CC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBAEzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAePF,EAAW,YAAYG,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC1D,CACD,mBAAoB,CAChB,IAAIC,EAAa,KACbC,EAAa,KAAK,WAAW,cAAc,OAAO,EAClDC,EAAe,KAAK,WAAW,cAAc,SAAS,EAC9C,KAAK,cAAc,OAAO,EACtC,IAAIC,EAAQ,KAAK,cAAc,yBAAyB,EACpDC,EAAe,KAAK,WAAW,cAAc,SAAS,EACtDC,EAAc,KAAK,WAAW,cAAc,QAAQ,EACpDC,EAAiB,KAAK,WAAW,cAAc,WAAW,EAE1DC,EAAgBJ,EAAM,MAE1BD,EAAa,iBAAiB,QAAUM,GAAU,CAC9CL,EAAM,MAAQI,EACdJ,EAAM,KAAI,EACVH,EAAW,KAAI,EACfA,EAAW,UAAU,OAAO,eAAe,EAC3CM,EAAe,UAAU,IAAI,QAAQ,EACrC,MAAMG,EAAc,IAAI,YAAY,qBAAsB,CAAE,OAAQ,CAAE,KAAMN,EAAM,aAAa,MAAM,CAAC,CAAI,CAAA,EAC1GH,EAAW,cAAcS,CAAW,CAChD,CAAS,EAEDR,EAAW,iBAAiB,QAAUO,GAAU,CAC5C,GAAIR,EAAW,cAAc,UAAU,EACnC,OAAAA,EAAW,UAAU,IAAI,eAAe,EACjC,GAEXO,EAAgBJ,EAAM,MAEtB,MAAMO,EAAY,IAAI,YAAY,mBAAoB,CAAE,OAAQ,CAAE,KAAMP,EAAM,aAAa,MAAM,EAAG,MAAOA,EAAM,KAAO,CAAA,CAAE,EAC1HH,EAAW,cAAcU,CAAS,EAElCP,EAAM,SAAW,GACjBA,EAAM,KAAI,EACVH,EAAW,KAAI,EACfI,EAAa,UAAU,OAAO,QAAQ,CAClD,CAAS,EAEGD,EAAM,UAAY,SAClBA,EAAM,iBAAiB,UAAYK,GAAU,CACzC,OAAQA,EAAM,IAAG,CACb,IAAK,QACDA,EAAM,gBAAe,EACrBA,EAAM,eAAc,EACpBP,EAAW,MAAK,EAChB,KACP,CACjB,CAAa,EAGLD,EAAW,iBAAiB,oBAAsBQ,GAAU,CACxD,WAAW,IAAM,CACbJ,EAAa,UAAU,IAAI,QAAQ,EACnCC,EAAY,UAAU,OAAO,QAAQ,EACrC,MAAMM,EAAe,IAAI,YAAY,wBAAyB,CAAE,OAAQ,CAAE,KAAMR,EAAM,aAAa,MAAM,CAAC,CAAI,CAAA,EAC9GH,EAAW,cAAcW,CAAY,CACxC,EAAE,GAAG,EAEN,WAAW,IAAM,CACbR,EAAM,SAAW,GACjBH,EAAW,gBAAgB,aAAa,EACxCI,EAAa,UAAU,IAAI,QAAQ,EACnCC,EAAY,UAAU,IAAI,QAAQ,EAClCC,EAAe,UAAU,IAAI,QAAQ,CACxC,EAAE,GAAI,CACnB,CAAS,EAEGH,EAAM,UAAY,UAClBA,EAAM,iBAAiB,SAAWK,GAAU,CACxCD,EAAgBJ,EAAM,MACtB,MAAMO,EAAY,IAAI,YAAY,mBAAoB,CAAE,OAAQ,CAAE,KAAMP,EAAM,aAAa,MAAM,EAAG,MAAOA,EAAM,KAAO,CAAA,CAAE,EAC1HH,EAAW,cAAcU,CAAS,EAClCV,EAAW,aAAa,cAAe,MAAM,EAC7CG,EAAM,SAAW,GACjBA,EAAM,KAAI,CAC1B,CAAa,EAEDA,EAAM,SAAW,UACjBA,EAAM,iBAAiB,QAAUK,GAAU,CACvCL,EAAM,OAAM,CAC5B,CAAa,EAGLA,EAAM,iBAAiB,OAASK,GAAU,CACtC,GAAIL,EAAM,OAASI,EACf,GAAIP,EAAW,aAAa,eAAe,EAAG,CAC1CO,EAAgBJ,EAAM,MACtB,MAAMO,EAAY,IAAI,YAAY,uBAAwB,CAAE,OAAQ,CAAE,KAAMP,EAAM,aAAa,MAAM,EAAG,MAAOA,EAAM,KAAO,CAAA,CAAE,EAC9HH,EAAW,cAAcU,CAAS,EAClCN,EAAa,UAAU,OAAO,QAAQ,OAEhCJ,EAAW,cAAc,kBAAkB,GACjDM,EAAe,UAAU,OAAO,QAAQ,CAG5D,CAAS,EAEDN,EAAW,iBAAiB,SAAWQ,GAAU,CAC7C,GAAIA,GAASA,EAAM,kBAAkB,aAAeA,EAAM,OAAO,QAAQ,wBAAwB,EAAG,CAChG,IAAII,EAAY,GAChB,MAAM,KAAKZ,EAAW,iBAAiB,sCAAsC,CAAC,EAAE,QAAQ,CAACa,EAAUC,IAAU,CACrGA,GAAS,IACTF,GAAa,MACjBA,GAAaC,EAAS,KAC1C,CAAiB,EACD,MAAMH,EAAY,IAAI,YAAY,mBAAoB,CAAE,OAAQ,CAAE,KAAMF,EAAM,OAAO,QAAQ,wBAAwB,EAAE,aAAa,MAAM,EAAG,MAAOI,CAAW,CAAA,CAAE,EACjKZ,EAAW,cAAcU,CAAS,EAElD,CAAS,CACJ,CACL"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* iamKey v5.6.0
|
|
3
|
+
* Copyright 2022-2024 iamproperty
|
|
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
|
+
<style>
|
|
6
|
+
@import "${i}";
|
|
7
|
+
figure{position:absolute;height:100%;width:100%;top:0;left:0}figure:after{content:"";inset:0;height:100%;width:100%;position:absolute;background-image:linear-gradient(15deg, #00313c 0%, #03404f 28.7%, #03404f 31.5%, #044353 60.1%, #1bb1dc 83.2%, rgba(28, 182, 226, 0.486) 100%);opacity:.85;z-index:1}img{pointer-events:none;position:absolute;inset:0;width:100%;max-height:auto;z-index:2;-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));mask-image:linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));mix-blend-mode:multiply}:host{display:flex;position:relative;overflow:hidden;position:relative;overflow:hidden;margin-bottom:2rem;max-width:40rem;min-width:100%;padding:2rem;border-radius:.5rem;text-align:center;align-items:flex-end;padding-top:33%}::slotted(*){position:relative;z-index:2;text-align:center}/*# sourceMappingURL=assets/css/components/marketing.css.map */
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
</style>
|
|
11
|
+
<link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous" />
|
|
12
|
+
<div class="marketing">
|
|
13
|
+
|
|
14
|
+
<slot></slot>
|
|
15
|
+
</div>
|
|
16
|
+
`,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){this.classList.add("invert-colours"),this.hasAttribute("data-img")&&this.shadowRoot.querySelector(".marketing").insertAdjacentHTML("afterbegin",`<figure><img src="${this.getAttribute("data-img")}" alt="" /></figure>`)}}export{o as default};
|
|
17
|
+
//# sourceMappingURL=marketing.component.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Marketing\"\n});\nclass iamMarketing 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/marketing.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n \n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n <div class=\"marketing\">\n \n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('invert-colours');\n if (this.hasAttribute('data-img')) {\n this.shadowRoot.querySelector('.marketing').insertAdjacentHTML('afterbegin', `<figure><img src=\"${this.getAttribute('data-img')}\" alt=\"\" /></figure>`);\n }\n }\n}\nexport default iamMarketing;\n"],"names":["iamMarketing","assetLocation","coreCSS","template"],"mappings":";;;IAEA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,WACf,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,aAAc,CACV,QACA,KAAK,aAAa,CAAE,KAAM,MAAQ,CAAA,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBAEzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUP,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/D,CACD,mBAAoB,CAChB,KAAK,UAAU,IAAI,gBAAgB,EAC/B,KAAK,aAAa,UAAU,GAC5B,KAAK,WAAW,cAAc,YAAY,EAAE,mBAAmB,aAAc,qBAAqB,KAAK,aAAa,UAAU,uBAAuB,CAE5J,CACL"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
3
3
|
* Copyright 2022-2024 iamproperty
|
|
4
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=`
|
|
5
5
|
<style>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
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">
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
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>
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
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>
|
|
6
6
|
@import "${t}";
|
|
7
|
-
:host{container-type:inline-size;display:block}.pagination{display:block}@container (width > 23.4375em){.pagination{display:flex;align-items:center;justify-content:space-between !important;padding-top:2rem}}.pagination>div{display:flex;align-items:center}.pagination div:is(.page-jump,.per-page){border:1px solid var(--colour-light);height:3.25rem;display:none;align-items:center;padding-inline:1rem}.pagination div:is(.page-jump,.per-page) .select--minimal{height:3.25rem;line-height:3.25rem;margin-left:-1rem;
|
|
7
|
+
:host{container-type:inline-size;display:block}.pagination{display:block}@container (width > 23.4375em){.pagination{display:flex;align-items:center;justify-content:space-between !important;padding-top:2rem}}.pagination>div{display:flex;align-items:center}.pagination div:is(.page-jump,.per-page){border:1px solid var(--colour-light);height:3.25rem;display:none;align-items:center;padding-inline:1rem}.pagination div:is(.page-jump,.per-page) .select--minimal{--select-padding-left: rem(16);height:3.25rem;line-height:3.25rem;margin-left:-1rem;font-weight:bold}.pagination div:is(.page-jump,.per-page) div:has(>select){margin-bottom:0}.page-jump{border-right:none !important}.total-pages{white-space:nowrap}:host([data-page-jump][data-minimal]) .page-jump{display:flex !important}@container (width > 23.4375em){:host([data-page-jump]) .page-jump{display:flex !important}}@container (width > 23.4375em){:host([data-per-page]:not([data-page-jump][data-item-count])) .per-page{display:flex !important}}@container (width > 48em){:host([data-per-page][data-page-jump][data-item-count]) .per-page{display:flex !important}}.pagination>.item-count{display:block;text-align:center;margin-bottom:1rem;margin-inline:auto}@container (width > 23.4375em){.pagination>.item-count{display:none}:host([data-item-count]) .pagination>.item-count{display:flex !important;margin:0}}*:where(.prev,.next){border:1px solid var(--colour-light);line-height:3.25rem;height:3.25rem;margin:0;display:none;background:none;padding-inline:1rem}@container (width > 23.4375em){*:where(.prev,.next){display:inline-block}}*:where(.prev,.next):after{margin-left:.5em;font-size:.8rem;content:"\uF054";font-family:"Font Awesome 6 Pro";color:var(--colour-info)}*:where(.prev,.next):is(:hover,:focus):not(:disabled){background-color:var(--colour-light)}*:where(.prev,.next):is(:active):not(:disabled){background-color:#e0e0e0}@media screen and (prefers-color-scheme: dark){*:where(.prev,.next):is(:hover,:focus):not(:disabled){background-color:var(--colour-canvas)}*:where(.prev,.next):is(:active):not(:disabled){background-color:var(--colour-canvas)}}*:where(.prev,.next):disabled:after,*:where(.prev,.next):disabled:before{color:inherit !important}:host([data-minimal]) .pagination{justify-content:flex-end}@container (width > 23.4375em){:host([data-minimal]) .pagination{justify-content:space-between}}:host([data-minimal]) *:where(.prev,.next){display:inline-block !important}.prev{border-right:none}.prev:after{display:none}.prev:before{margin-right:.5em;font-size:.8rem;content:"\uF053";font-family:"Font Awesome 6 Pro";color:var(--colour-info)}.mobile-controls{display:block}:host([data-minimal]) .pagination{padding-top:1.5rem;display:flex;align-items:center;justify-content:flex-end}:host([data-minimal]) *:is(.mobile-controls,.item-count){display:none}@container (width > 23.4375em){.mobile-controls{display:none !important}:host([data-item-count]) .item-count{display:flex !important}}.fa-spin{display:none !important;font-size:3rem;color:var(--colour-info)}:host([data-loading]) .mobile-controls{padding-top:2rem}:host([data-loading]) .item-count,:host([data-loading]) .mobile-controls>*:not(.fa-spin){display:none !important}:host([data-loading]) .fa-spin{display:block !important;margin:auto}/*# sourceMappingURL=assets/css/components/pagination.css.map */
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v5.
|
|
2
|
+
* iamKey v5.6.0
|
|
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>
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* iamKey v5.6.0
|
|
3
|
+
* Copyright 2022-2024 iamproperty
|
|
4
|
+
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Slider"});class f extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",p=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,i=document.createElement("template");i.innerHTML=`
|
|
5
|
+
<style>
|
|
6
|
+
@import "${p}";
|
|
7
|
+
.row{align-items:center}:is(.min,.max){max-width:fit-content;line-height:2rem}.sliders{position:relative;padding:0}:host{max-width:var(--input-max-width, 50rem);display:block}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--track-colour), var(--track-colour) var(--start-percent, 0%), var(--thumb-colour) var(--start-percent, 0%), var(--thumb-colour) var(--percent, 0%), var(--track-colour) var(--percent, 0%))}input[type=range]::-moz-range-track{background:linear-gradient(to right, var(--track-colour), var(--track-colour) var(--start-percent, 0%), var(--thumb-colour) var(--start-percent, 0%), var(--thumb-colour) var(--percent, 0%), var(--track-colour) var(--percent, 0%))}input[type=range]+input[type=range]{position:absolute;top:0;left:50%;width:50%}input[type=range]+input[type=range]::-webkit-slider-runnable-track{background:rgba(0,0,0,0);pointer-events:none;width:200%;margin-left:-100%}@supports(-moz-appearance: none){input[type=range]+input[type=range]{left:0;width:100%;pointer-events:none}}input[type=range]+input[type=range]::-moz-range-track{background:rgba(0,0,0,0);pointer-events:none}.input__wrapper{display:flex;justify-content:flex-end;--max-width: 6.25rem;--padding-top: 0.75rem}.input__wrapper>span{display:none}.input__wrapper[data-elements="2"]{justify-content:space-between;--max-width: calc(50% - 3rem);--padding-top: 2rem;position:relative}.input__wrapper[data-elements="2"]:before{content:"";position:absolute;width:4rem;height:2px;top:calc(50% - 1px);left:calc(50% - 2rem);background-color:var(--colour-border)}.input__wrapper[data-elements="2"] span{display:block;position:absolute;top:.5rem;left:1rem;color:#9d9d9d;font-size:1rem}.input__wrapper[data-elements="2"] span+span{left:calc(50% + 4rem)}::slotted(input){margin-top:0 !important;padding-top:var(--padding-top) !important;max-width:var(--max-width) !important;-webkit-appearance:none !important;appearance:none !important;min-height:auto !important;max-height:none !important}/*# sourceMappingURL=assets/css/components/slider.css.map */
|
|
8
|
+
|
|
9
|
+
</style>
|
|
10
|
+
<div class="row">
|
|
11
|
+
<div class="col min pe-2"></div>
|
|
12
|
+
<div class="col sliders">
|
|
13
|
+
|
|
14
|
+
</div>
|
|
15
|
+
<div class="col max ps-2"></div>
|
|
16
|
+
</div>
|
|
17
|
+
<div class="input__wrapper"><slot></slot><span>Minimum</span><span>Maximum</span></div>
|
|
18
|
+
`,this.shadowRoot.appendChild(i.content.cloneNode(!0))}connectedCallback(){const t=this,p=this.shadowRoot.querySelector(".min"),i=this.shadowRoot.querySelector(".max"),m=this.shadowRoot.querySelector(".sliders");let s=this.querySelectorAll("input");const y=this.shadowRoot.querySelector(".input__wrapper"),g=this.closest("label");let c,v="mouseup",h="mousedown";"ontouchstart"in document.documentElement&&(v="touchend",h="touchstart");let l=function(e,r){let a=e.value,d=t.shadowRoot.querySelector(".is-first").getAttribute("min"),u=t.shadowRoot.querySelector(".is-last").getAttribute("max");if(e.classList.contains("is-last")&&!e.classList.contains("is-first")){let n=a/(u-d)*100;t.style.setProperty("--percent",n+"%"),parseFloat(e.value)<=parseFloat(t.shadowRoot.querySelector(".is-first").value)&&(t.shadowRoot.querySelector(".is-first").value=e.value,t.querySelector(".is-first").value=e.value,t.style.setProperty("--start-percent",n+"%"))}else if(e.classList.contains("is-first")&&!e.classList.contains("is-last")){let n=a/(u-d)*100;t.style.setProperty("--start-percent",n+"%"),parseFloat(e.value)>=parseFloat(t.shadowRoot.querySelector(".is-last").value)&&(t.shadowRoot.querySelector(".is-last").value=e.value,t.querySelector(".is-last").value=e.value,t.style.setProperty("--percent",n+"%"))}else{let n=(a/(u-d)*100).toFixed(2);t.style.setProperty("--percent",n+"%")}};Array.from(s).forEach((e,r)=>{let a=e.cloneNode(!0);e.setAttribute("type","number"),a.setAttribute("type","range"),r==0&&(e.classList.add("is-first"),a.classList.add("is-first"),p.innerHTML=e.getAttribute("min"),i.innerHTML=e.getAttribute("max"),m.appendChild(a)),r==s.length-1&&(e.classList.add("is-last"),a.classList.add("is-last"),m.appendChild(a)),r>1&&e.remove()}),s=this.querySelectorAll("input"),y.setAttribute("data-elements",s.length);const o=this.shadowRoot.querySelectorAll("input");Array.from(s).forEach((e,r)=>{e.addEventListener("keyup",function(a){o[r].value=e.value,l(o[r])}),e.addEventListener("keydown",function(a){o[r].value=e.value,l(o[r])}),e.addEventListener("change",function(a){o[r].value=e.value,l(o[r])})}),Array.from(o).forEach((e,r)=>{l(e),e.addEventListener(h,function(a){clearInterval(c),c=setInterval(function(){l(e),s[r].value=e.value},10)}),e.addEventListener(v,function(a){clearInterval(c)}),e.addEventListener("change",function(a){clearInterval(c),l(e),s[r].value=e.value})}),g.addEventListener("click",function(e){if(e.preventDefault(),this===e.target)t.shadowRoot.querySelector("input").focus();else return e.stopPropagation(),!1})}}export{f as default};
|
|
19
|
+
//# sourceMappingURL=slider.component.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"slider.component.min.js","sources":["slider.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n \"event\": \"customElementRegistered\",\n \"element\": \"Slider\"\n});\nclass iamSlider 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/slider.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n </style>\n <div class=\"row\">\n <div class=\"col min pe-2\"></div>\n <div class=\"col sliders\">\n \n </div>\n <div class=\"col max ps-2\"></div>\n </div>\n <div class=\"input__wrapper\"><slot></slot><span>Minimum</span><span>Maximum</span></div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const slider = this;\n const minElement = this.shadowRoot.querySelector('.min');\n const maxElement = this.shadowRoot.querySelector('.max');\n const slidersHolder = this.shadowRoot.querySelector('.sliders');\n let inputs = this.querySelectorAll('input');\n const inputWrapper = this.shadowRoot.querySelector('.input__wrapper');\n const label = this.closest('label');\n let stepperInterval, stepperEvent = \"mouseup\", stepperStart = \"mousedown\";\n if (\"ontouchstart\" in document.documentElement) {\n stepperEvent = \"touchend\";\n stepperStart = \"touchstart\";\n }\n let stepperFunction = function (input, eventType) {\n let value = input.value;\n let min = slider.shadowRoot.querySelector('.is-first').getAttribute('min');\n let max = slider.shadowRoot.querySelector('.is-last').getAttribute('max');\n if (input.classList.contains('is-last') && !input.classList.contains('is-first')) {\n let percent = ((value / (max - min)) * 100);\n slider.style.setProperty('--percent', percent + \"%\");\n if (parseFloat(input.value) <= parseFloat(slider.shadowRoot.querySelector('.is-first').value)) {\n slider.shadowRoot.querySelector('.is-first').value = input.value;\n slider.querySelector('.is-first').value = input.value;\n slider.style.setProperty('--start-percent', percent + \"%\");\n }\n }\n else if (input.classList.contains('is-first') && !input.classList.contains('is-last')) {\n let percent = ((value / (max - min)) * 100);\n slider.style.setProperty('--start-percent', percent + \"%\");\n if (parseFloat(input.value) >= parseFloat(slider.shadowRoot.querySelector('.is-last').value)) {\n slider.shadowRoot.querySelector('.is-last').value = input.value;\n slider.querySelector('.is-last').value = input.value;\n slider.style.setProperty('--percent', percent + \"%\");\n }\n }\n else {\n let percent = ((value / (max - min)) * 100).toFixed(2);\n slider.style.setProperty('--percent', percent + \"%\");\n }\n };\n // Create sliders\n Array.from(inputs).forEach((input, index) => {\n let rangeInput = input.cloneNode(true);\n input.setAttribute('type', 'number');\n rangeInput.setAttribute('type', 'range');\n if (index == 0) {\n input.classList.add('is-first');\n rangeInput.classList.add('is-first');\n minElement.innerHTML = input.getAttribute('min');\n maxElement.innerHTML = input.getAttribute('max');\n slidersHolder.appendChild(rangeInput);\n }\n if (index == inputs.length - 1) {\n input.classList.add('is-last');\n rangeInput.classList.add('is-last');\n slidersHolder.appendChild(rangeInput);\n }\n if (index > 1) {\n input.remove();\n }\n });\n inputs = this.querySelectorAll('input');\n inputWrapper.setAttribute('data-elements', inputs.length);\n const sliders = this.shadowRoot.querySelectorAll('input');\n Array.from(inputs).forEach((input, index) => {\n input.addEventListener('keyup', function (event) {\n sliders[index].value = input.value;\n stepperFunction(sliders[index]);\n });\n input.addEventListener('keydown', function (event) {\n sliders[index].value = input.value;\n stepperFunction(sliders[index]);\n });\n input.addEventListener('change', function (event) {\n sliders[index].value = input.value;\n stepperFunction(sliders[index]);\n });\n });\n Array.from(sliders).forEach((input, index) => {\n stepperFunction(input, 'start');\n input.addEventListener(stepperStart, function (event) {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n stepperFunction(input, 'drag');\n inputs[index].value = input.value;\n }, 10);\n });\n input.addEventListener(stepperEvent, function (event) {\n clearInterval(stepperInterval);\n });\n input.addEventListener('change', function (event) {\n clearInterval(stepperInterval);\n stepperFunction(input, 'click');\n inputs[index].value = input.value;\n });\n });\n // Move focus to slider when clicking on label\n label.addEventListener('click', function (event) {\n event.preventDefault();\n if (this === event.target) {\n /* click was on label */\n slider.shadowRoot.querySelector('input').focus();\n }\n else {\n /* click was on input */\n event.stopPropagation();\n return false;\n }\n });\n } // Connected callback\n}\nexport default iamSlider;\n"],"names":["iamSlider","assetLocation","coreCSS","template","slider","minElement","maxElement","slidersHolder","inputs","inputWrapper","label","stepperInterval","stepperEvent","stepperStart","stepperFunction","input","eventType","value","min","max","percent","index","rangeInput","sliders","event"],"mappings":";;;IAEA,OAAO,UAAY,OAAO,WAAa,GACvC,OAAO,UAAU,KAAK,CAClB,MAAS,0BACT,QAAW,QACf,CAAC,EACD,MAAMA,UAAkB,WAAY,CAChC,aAAc,CACV,QACA,KAAK,aAAa,CAAE,KAAM,MAAQ,CAAA,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EAAI,SAAS,KAAK,aAAa,sBAAsB,EAAI,UAC1HC,EAAU,SAAS,KAAK,aAAa,eAAe,EAAI,SAAS,KAAK,aAAa,eAAe,EAAI,GAAGD,qBAEzGE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAYP,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/D,CACD,mBAAoB,CAChB,MAAMC,EAAS,KACTC,EAAa,KAAK,WAAW,cAAc,MAAM,EACjDC,EAAa,KAAK,WAAW,cAAc,MAAM,EACjDC,EAAgB,KAAK,WAAW,cAAc,UAAU,EAC9D,IAAIC,EAAS,KAAK,iBAAiB,OAAO,EAC1C,MAAMC,EAAe,KAAK,WAAW,cAAc,iBAAiB,EAC9DC,EAAQ,KAAK,QAAQ,OAAO,EAClC,IAAIC,EAAiBC,EAAe,UAAWC,EAAe,YAC1D,iBAAkB,SAAS,kBAC3BD,EAAe,WACfC,EAAe,cAEnB,IAAIC,EAAkB,SAAUC,EAAOC,EAAW,CAC9C,IAAIC,EAAQF,EAAM,MACdG,EAAMd,EAAO,WAAW,cAAc,WAAW,EAAE,aAAa,KAAK,EACrEe,EAAMf,EAAO,WAAW,cAAc,UAAU,EAAE,aAAa,KAAK,EACxE,GAAIW,EAAM,UAAU,SAAS,SAAS,GAAK,CAACA,EAAM,UAAU,SAAS,UAAU,EAAG,CAC9E,IAAIK,EAAYH,GAASE,EAAMD,GAAQ,IACvCd,EAAO,MAAM,YAAY,YAAagB,EAAU,GAAG,EAC/C,WAAWL,EAAM,KAAK,GAAK,WAAWX,EAAO,WAAW,cAAc,WAAW,EAAE,KAAK,IACxFA,EAAO,WAAW,cAAc,WAAW,EAAE,MAAQW,EAAM,MAC3DX,EAAO,cAAc,WAAW,EAAE,MAAQW,EAAM,MAChDX,EAAO,MAAM,YAAY,kBAAmBgB,EAAU,GAAG,WAGxDL,EAAM,UAAU,SAAS,UAAU,GAAK,CAACA,EAAM,UAAU,SAAS,SAAS,EAAG,CACnF,IAAIK,EAAYH,GAASE,EAAMD,GAAQ,IACvCd,EAAO,MAAM,YAAY,kBAAmBgB,EAAU,GAAG,EACrD,WAAWL,EAAM,KAAK,GAAK,WAAWX,EAAO,WAAW,cAAc,UAAU,EAAE,KAAK,IACvFA,EAAO,WAAW,cAAc,UAAU,EAAE,MAAQW,EAAM,MAC1DX,EAAO,cAAc,UAAU,EAAE,MAAQW,EAAM,MAC/CX,EAAO,MAAM,YAAY,YAAagB,EAAU,GAAG,OAGtD,CACD,IAAIA,GAAYH,GAASE,EAAMD,GAAQ,KAAK,QAAQ,CAAC,EACrDd,EAAO,MAAM,YAAY,YAAagB,EAAU,GAAG,EAEnE,EAEQ,MAAM,KAAKZ,CAAM,EAAE,QAAQ,CAACO,EAAOM,IAAU,CACzC,IAAIC,EAAaP,EAAM,UAAU,EAAI,EACrCA,EAAM,aAAa,OAAQ,QAAQ,EACnCO,EAAW,aAAa,OAAQ,OAAO,EACnCD,GAAS,IACTN,EAAM,UAAU,IAAI,UAAU,EAC9BO,EAAW,UAAU,IAAI,UAAU,EACnCjB,EAAW,UAAYU,EAAM,aAAa,KAAK,EAC/CT,EAAW,UAAYS,EAAM,aAAa,KAAK,EAC/CR,EAAc,YAAYe,CAAU,GAEpCD,GAASb,EAAO,OAAS,IACzBO,EAAM,UAAU,IAAI,SAAS,EAC7BO,EAAW,UAAU,IAAI,SAAS,EAClCf,EAAc,YAAYe,CAAU,GAEpCD,EAAQ,GACRN,EAAM,OAAM,CAE5B,CAAS,EACDP,EAAS,KAAK,iBAAiB,OAAO,EACtCC,EAAa,aAAa,gBAAiBD,EAAO,MAAM,EACxD,MAAMe,EAAU,KAAK,WAAW,iBAAiB,OAAO,EACxD,MAAM,KAAKf,CAAM,EAAE,QAAQ,CAACO,EAAOM,IAAU,CACzCN,EAAM,iBAAiB,QAAS,SAAUS,EAAO,CAC7CD,EAAQF,CAAK,EAAE,MAAQN,EAAM,MAC7BD,EAAgBS,EAAQF,CAAK,CAAC,CAC9C,CAAa,EACDN,EAAM,iBAAiB,UAAW,SAAUS,EAAO,CAC/CD,EAAQF,CAAK,EAAE,MAAQN,EAAM,MAC7BD,EAAgBS,EAAQF,CAAK,CAAC,CAC9C,CAAa,EACDN,EAAM,iBAAiB,SAAU,SAAUS,EAAO,CAC9CD,EAAQF,CAAK,EAAE,MAAQN,EAAM,MAC7BD,EAAgBS,EAAQF,CAAK,CAAC,CAC9C,CAAa,CACb,CAAS,EACD,MAAM,KAAKE,CAAO,EAAE,QAAQ,CAACR,EAAOM,IAAU,CAC1CP,EAAgBC,CAAc,EAC9BA,EAAM,iBAAiBF,EAAc,SAAUW,EAAO,CAClD,cAAcb,CAAe,EAC7BA,EAAkB,YAAY,UAAY,CACtCG,EAAgBC,CAAa,EAC7BP,EAAOa,CAAK,EAAE,MAAQN,EAAM,KAC/B,EAAE,EAAE,CACrB,CAAa,EACDA,EAAM,iBAAiBH,EAAc,SAAUY,EAAO,CAClD,cAAcb,CAAe,CAC7C,CAAa,EACDI,EAAM,iBAAiB,SAAU,SAAUS,EAAO,CAC9C,cAAcb,CAAe,EAC7BG,EAAgBC,CAAc,EAC9BP,EAAOa,CAAK,EAAE,MAAQN,EAAM,KAC5C,CAAa,CACb,CAAS,EAEDL,EAAM,iBAAiB,QAAS,SAAUc,EAAO,CAE7C,GADAA,EAAM,eAAc,EAChB,OAASA,EAAM,OAEfpB,EAAO,WAAW,cAAc,OAAO,EAAE,MAAK,MAI9C,QAAAoB,EAAM,gBAAe,EACd,EAEvB,CAAS,CACJ,CACL"}
|