npm - @iamproperty/components - Versions diffs - 7.8.2--beta3 → 7.8.2--beta4 - Mend

@iamproperty/components 7.8.2--beta3 → 7.8.2--beta4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (200) hide show

package/assets/js/components/card/card.component.min.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"card.component.min.js","sources":["../_global.js","../../modules/card.module.js","../menu/menu.component.js","card.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","export const cardHTML = `<div class=\"wrapper\">\n <div class=\"card__head\" part=\"head\">\n <slot name=\"head\"></slot>\n </div>\n <div class=\"card__badges\"><slot name=\"badges\"></slot></div>\n <slot name=\"checkbox\" class=\"activate-prevent-hover\"></slot>\n <div class=\"card__body\" part=\"body\">\n <slot></slot>\n <slot name=\"secondary\" part=\"secondary\"></slot>\n </div>\n <div class=\"card__details\" part=\"details\">\n <slot name=\"details\"></slot>\n </div>\n <div class=\"card__footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n </div>\n</div>`;\nexport const setupCard = (cardComponent) => {\n cardComponent.classList.add('card');\n const cardHead = cardComponent.shadowRoot.querySelector('.card__head');\n const cardBody = cardComponent.shadowRoot.querySelector('.card__body');\n if (cardComponent.hasAttribute('data-image')) {\n cardHead.innerHTML += `<img src=\"${cardComponent.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" part=\"image\" />`;\n }\n // Inset the HTML for the data total or icon fallback\n if (cardComponent.hasAttribute('data-total')) {\n if (!(cardBody === null \|\| cardBody === void 0 ? void 0 : cardBody.querySelector('.card__total')))\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\">${cardComponent.getAttribute('data-total')}</div>`);\n else {\n const cardTotal = cardBody === null \|\| cardBody === void 0 ? void 0 : cardBody.querySelector('.card__total');\n if (cardTotal)\n cardTotal.innerHTML = cardComponent.getAttribute('data-total');\n }\n }\n else if (cardComponent.querySelector('[slot=\"total-icon\"]')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\"><slot name=\"total-icon\"></slot></div>`);\n }\n if (!cardComponent.querySelector('[slot=\"badges\"]')) {\n cardComponent.shadowRoot.querySelector('.card__badges').classList.add('empty');\n }\n else {\n cardComponent.shadowRoot.querySelector('.card__badges').classList.remove('empty');\n }\n};\n","class iamMenu extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const menuCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${menuCSS}\n </style>\n <div class=\"menu--inner\" part=\"inner\">\n <slot></slot>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('dropdown');\n const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n let menuItems = this.querySelectorAll('a, button');\n if (this.closest('.menu__wrapper')) {\n menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n topLevelmenuItems = menuItems;\n }\n const subMenus = this.querySelectorAll('details');\n let subNextIndex;\n let subPrevIndex;\n // Set the needed CSS styles to connect the ID attribute to the anchor name\n if (menuID && menuButton) {\n this.setAttribute('role', 'menu');\n this.setAttribute('popover', 'auto');\n this.style['position-anchor'] = `--${menuID}`;\n menuButton === null \|\| menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n menuButton === null \|\| menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n menuButton === null \|\| menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n }\n menuItems.forEach((item, index) => {\n item.setAttribute('role', 'menuitem');\n item.setAttribute('tabindex', '0');\n if (index == 0) {\n item.setAttribute('autofocus', true);\n }\n });\n this.addEventListener('keydown', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n const activeItem = document.activeElement;\n const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n switch (event.keyCode // change to event.key to key to use the above variable\n ) {\n case 27: // Esc\n if (activeItem.closest('details')) {\n event.stopPropagation();\n event.preventDefault();\n activeItem.closest('details').removeAttribute('open');\n activeItem.closest('details').querySelector(':scope summary').focus();\n }\n else {\n event.stopPropagation();\n menuButton.focus();\n }\n break;\n case 32: // Space\n case 13: // Enter\n break;\n case 35: // end\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[menuItems.length - 1].focus();\n break;\n case 36: // home\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[0].focus();\n break;\n case 38: // up\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n Array.from(topLevelmenuItems)[prevIndex].focus();\n else\n Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n Array.from(subMenuItems)[subPrevIndex].focus();\n else\n Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n }\n break;\n case 40: // down\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n Array.from(topLevelmenuItems)[nextIndex].focus();\n else\n Array.from(topLevelmenuItems)[0].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n if (Array.from(subMenuItems)[subNextIndex] != undefined)\n Array.from(subMenuItems)[subNextIndex].focus();\n else\n Array.from(subMenuItems)[0].focus();\n }\n break;\n }\n }\n });\n this.addEventListener('toggle', (e) => {\n var _a, _b, _c, _d;\n const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n this.dispatchEvent(updateEvent);\n // Fix the focus\n if (this.closest('.menu__wrapper')) {\n menuItems[0].focus();\n }\n if (this.hasAttribute('popover-open')) {\n e.preventDefault();\n this.removeAttribute('popover-open');\n this.hidePopover();\n }\n if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _b === void 0 ? void 0 : _b.classList.add('active');\n }\n else {\n (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _d === void 0 ? void 0 : _d.classList.remove('active');\n }\n });\n this.addEventListener('click', (event) => {\n if (event &&\n event.target instanceof HTMLElement &&\n event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n const button = event.target.closest('button:has(+ iam-menu)');\n button === null \|\| button === void 0 ? void 0 : button.classList.toggle('open');\n }\n else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n const button = event.target.closest('button.selectable');\n if (this.hasAttribute('multiple')) {\n button.classList.toggle('selected');\n }\n else if (button === null \|\| button === void 0 ? void 0 : button.classList.contains('selected')) {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n }\n else {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n button.classList.add('selected');\n }\n }\n });\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n document.addEventListener('click', (event) => {\n if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n const button = event.originalTarget;\n const popoverID = button.getAttribute('popovertarget');\n const popover = document.getElementById(popoverID);\n const viewportOffset = button.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n popover.style.setProperty('top', top + 'px');\n popover.style.setProperty('left', left + button.clientWidth + 'px');\n }\n });\n }\n }\n}\nexport default iamMenu;\n","var __awaiter = (this && this.__awaiter) \|\| function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P \|\| (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments \|\| [])).next());\n });\n};\nimport { trackComponent, trackComponentRegistered } from '../_global';\nimport { cardHTML, setupCard } from '../../modules/card.module';\nimport iamMenu from '../menu/menu.component';\ntrackComponentRegistered('iam-card');\nclass iamCard extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/card.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n ${cardHTML}\n <slot name=\"link\"></slot>\n <slot name=\"primary-action\"></slot>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n return __awaiter(this, void 0, void 0, function* () {\n var _a, _b;\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const cardComponent = this;\n const cardBody = cardComponent.shadowRoot.querySelector('.card__body');\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n if (!window.customElements.get(`iam-menu`))\n window.customElements.define(`iam-menu`, iamMenu);\n setupCard(cardComponent);\n // Add Illustration HTML\n if (cardComponent.hasAttribute('data-illustration')) {\n cardBody.insertAdjacentHTML('afterbegin', `<div class=\"card__illustration\"><img src=\"${this.getAttribute('data-illustration')}\" alt=\"\" loading=\"lazy\" /></div>`);\n }\n // Add class that shows the right arrow icon\n if (!cardComponent.querySelector('[slot=\"btns\"]') && !cardComponent.querySelector('[slot=\"secondary\"]') && !cardComponent.classList.contains('card--article') && !cardComponent.closest('.carousel--article-cards')) {\n cardComponent.classList.add('show-icon');\n }\n // Secondary buttons and actions\n // Add the dialog wrapper HTML\n if (cardComponent.querySelector('[slot=\"btns\"]')) {\n cardComponent.shadowRoot.innerHTML += `<div class=\"menu__wrapper\">\n <button class=\"btn btn-secondary btn-compact fa-ellipsis-vertical m-0\" popovertarget=\"actions\" style=\"anchor-name: --anchor-el;\" title=\"Further actions\" type=\"button\">Open further actions</button>\n <iam-menu class=\"dialog--fix dialog--list\" id=\"actions\" style=\"position-anchor: --anchor-el;\" popover>\n <slot name=\"btns\"></slot>\n </iam-menu>\n </div>`;\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n const actionButton = (_a = this.shadowRoot) === null \|\| _a === void 0 ? void 0 : _a.querySelector('[popovertarget=\"actions\"]');\n const actionPopover = (_b = this.shadowRoot) === null \|\| _b === void 0 ? void 0 : _b.querySelector('[popover]');\n actionButton === null \|\| actionButton === void 0 ? void 0 : actionButton.addEventListener('click', (event) => {\n this.style.setProperty('overflow', 'visible');\n this.style.setProperty('z-index', '999999');\n const viewportOffset = actionButton.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n actionPopover.style.setProperty('display', 'block');\n actionPopover.style.setProperty('top', top + 'px');\n actionPopover.style.setProperty('left', left - 100 + 'px');\n });\n document.addEventListener('scroll', (event) => {\n actionPopover.style.setProperty('display', 'none');\n });\n }\n }\n // Make sure slotted buttons and links have correct button classes\n Array.from(cardComponent.querySelectorAll('[slot=\"btns\"]')).forEach((button) => {\n button.classList.add('btn');\n button.classList.add('btn-action');\n });\n // Hide the default hover and focus states when interacting with the checkbox, dialog wrapper or secondary button\n if (cardComponent.querySelector('[slot=\"checkbox\"],[slot=\"secondary\"]')) {\n const element = cardComponent.querySelector('[slot=\"checkbox\"],[slot=\"secondary\"]');\n element.addEventListener('mouseenter', () => {\n cardComponent.classList.add('prevent-hover');\n });\n element.addEventListener('mouseleave', () => {\n cardComponent.classList.remove('prevent-hover');\n });\n }\n if (cardComponent.shadowRoot.querySelector('.menu__wrapper')) {\n const element = cardComponent.shadowRoot.querySelector('.menu__wrapper');\n element.addEventListener('mouseenter', () => {\n cardComponent.classList.add('prevent-hover');\n });\n element.addEventListener('mouseleave', () => {\n cardComponent.classList.remove('prevent-hover');\n });\n }\n // Dispatch events of selecting checkboxes\n const checkbox = cardComponent.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.addEventListener('change', () => {\n if (checkbox.checked) {\n const customEvent = new CustomEvent('select-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n }\n else {\n const customEvent = new CustomEvent('unselect-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n }\n });\n }\n // Dispatch events of click onto secondary buttons\n const secondaryBtn = cardComponent.querySelector('[slot=\"secondary\"]');\n if (secondaryBtn) {\n secondaryBtn.addEventListener('click', () => {\n const customEvent = new CustomEvent('secondary-button-clicked', {\n detail: { Title: secondaryBtn.getAttribute('title') },\n });\n cardComponent.dispatchEvent(customEvent);\n });\n }\n // Dispatch events of click onto action buttons\n const actionBtns = cardComponent.querySelectorAll('[slot=\"btns\"]');\n Array.from(actionBtns).forEach((button) => {\n button.addEventListener('click', () => {\n const customEvent = new CustomEvent('action-button-clicked', {\n detail: { Title: button.getAttribute('title') },\n });\n cardComponent.dispatchEvent(customEvent);\n });\n });\n if (this.querySelector('[slot=\"link\"]'))\n this.classList.add('hasLink');\n trackComponent(cardComponent, 'iam-card', [\n 'select-card',\n 'unselect-card',\n 'secondary-button-clicked',\n 'action-button-clicked',\n ]);\n });\n }\n static get observedAttributes() {\n return ['data-image'];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n switch (attrName) {\n case 'data-total': {\n if (this.shadowRoot.querySelector('.card__total'))\n this.shadowRoot.querySelector('.card__total').innerHTML = newVal;\n break;\n }\n case 'data-image': {\n if (oldVal != newVal) {\n const cardHeadImg = this.shadowRoot.querySelector('.card__head img');\n if (cardHeadImg)\n cardHeadImg.setAttribute('src', newVal);\n }\n break;\n }\n }\n }\n}\nexport default iamCard;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","cardHTML","setupCard","cardComponent","cardHead","cardBody","cardTotal","iamMenu","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","activeItem","prevIndex","nextIndex","subMenuItems","e","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","rejected","result","iamCard","actionButton","actionPopover","element","checkbox","customEvent","secondaryBtn","actionBtns","attrName","oldVal","newVal","cardHeadImg"],"mappings":"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"}
1	+ {"version":3,"file":"card.component.min.js","sources":["../_global.js","../../modules/card.module.js","../menu/menu.component.js","card.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","export const cardHTML = `<div class=\"wrapper\">\n <div class=\"card__head\" part=\"head\">\n <slot name=\"head\"></slot>\n </div>\n <div class=\"card__badges\"><slot name=\"badges\"></slot></div>\n <slot name=\"checkbox\" class=\"activate-prevent-hover\"></slot>\n <div class=\"card__body\" part=\"body\">\n <slot></slot>\n <slot name=\"secondary\" part=\"secondary\"></slot>\n </div>\n <div class=\"card__details\" part=\"details\">\n <slot name=\"details\"></slot>\n </div>\n <div class=\"card__footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n </div>\n</div>`;\nconst getCardPart = (cardComponent, selector) => { var _a; return ((_a = cardComponent.shadowRoot) === null \|\| _a === void 0 ? void 0 : _a.querySelector(selector)) \|\| null; };\nexport const setupCard = (cardComponent) => {\n cardComponent.classList.add('card');\n const cardHead = getCardPart(cardComponent, '.card__head');\n const cardBody = getCardPart(cardComponent, '.card__body');\n const cardBadges = getCardPart(cardComponent, '.card__badges');\n if (cardComponent.hasAttribute('data-image')) {\n cardHead === null \|\| cardHead === void 0 ? void 0 : cardHead.insertAdjacentHTML('beforeend', `<img src=\"${cardComponent.getAttribute('data-image') \|\| ''}\" alt=\"\" loading=\"lazy\" part=\"image\" />`);\n }\n // Inset the HTML for the data total or icon fallback\n if (cardComponent.hasAttribute('data-total')) {\n const cardTotal = cardBody === null \|\| cardBody === void 0 ? void 0 : cardBody.querySelector('.card__total');\n if (!cardTotal)\n cardBody === null \|\| cardBody === void 0 ? void 0 : cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\">${cardComponent.getAttribute('data-total') \|\| ''}</div>`);\n else {\n cardTotal.innerHTML = cardComponent.getAttribute('data-total') \|\| '';\n }\n }\n else if (cardComponent.querySelector('[slot=\"total-icon\"]')) {\n cardBody === null \|\| cardBody === void 0 ? void 0 : cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\"><slot name=\"total-icon\"></slot></div>`);\n }\n if (!cardComponent.querySelector('[slot=\"badges\"]')) {\n cardBadges === null \|\| cardBadges === void 0 ? void 0 : cardBadges.classList.add('empty');\n }\n else {\n cardBadges === null \|\| cardBadges === void 0 ? void 0 : cardBadges.classList.remove('empty');\n }\n};\n","class iamMenu extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const menuCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${menuCSS}\n </style>\n <div class=\"menu--inner\" part=\"inner\">\n <slot></slot>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('dropdown');\n const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n let menuItems = this.querySelectorAll('a, button');\n if (this.closest('.menu__wrapper')) {\n menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n topLevelmenuItems = menuItems;\n }\n const subMenus = this.querySelectorAll('details');\n let subNextIndex;\n let subPrevIndex;\n // Set the needed CSS styles to connect the ID attribute to the anchor name\n if (menuID && menuButton) {\n this.setAttribute('role', 'menu');\n this.setAttribute('popover', 'auto');\n this.style['position-anchor'] = `--${menuID}`;\n menuButton === null \|\| menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n menuButton === null \|\| menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n menuButton === null \|\| menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n }\n menuItems.forEach((item, index) => {\n item.setAttribute('role', 'menuitem');\n item.setAttribute('tabindex', '0');\n if (index == 0) {\n item.setAttribute('autofocus', true);\n }\n });\n this.addEventListener('keydown', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n const activeItem = document.activeElement;\n const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n switch (event.keyCode // change to event.key to key to use the above variable\n ) {\n case 27: // Esc\n if (activeItem.closest('details')) {\n event.stopPropagation();\n event.preventDefault();\n activeItem.closest('details').removeAttribute('open');\n activeItem.closest('details').querySelector(':scope summary').focus();\n }\n else {\n event.stopPropagation();\n menuButton.focus();\n }\n break;\n case 32: // Space\n case 13: // Enter\n break;\n case 35: // end\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[menuItems.length - 1].focus();\n break;\n case 36: // home\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[0].focus();\n break;\n case 38: // up\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n Array.from(topLevelmenuItems)[prevIndex].focus();\n else\n Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n Array.from(subMenuItems)[subPrevIndex].focus();\n else\n Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n }\n break;\n case 40: // down\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n Array.from(topLevelmenuItems)[nextIndex].focus();\n else\n Array.from(topLevelmenuItems)[0].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n if (Array.from(subMenuItems)[subNextIndex] != undefined)\n Array.from(subMenuItems)[subNextIndex].focus();\n else\n Array.from(subMenuItems)[0].focus();\n }\n break;\n }\n }\n });\n this.addEventListener('toggle', (e) => {\n var _a, _b, _c, _d;\n const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n this.dispatchEvent(updateEvent);\n // Fix the focus\n if (this.closest('.menu__wrapper')) {\n menuItems[0].focus();\n }\n if (this.hasAttribute('popover-open')) {\n e.preventDefault();\n this.removeAttribute('popover-open');\n this.hidePopover();\n }\n if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _b === void 0 ? void 0 : _b.classList.add('active');\n }\n else {\n (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null \|\| _d === void 0 ? void 0 : _d.classList.remove('active');\n }\n });\n this.addEventListener('click', (event) => {\n if (event &&\n event.target instanceof HTMLElement &&\n event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n const button = event.target.closest('button:has(+ iam-menu)');\n button === null \|\| button === void 0 ? void 0 : button.classList.toggle('open');\n }\n else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n const button = event.target.closest('button.selectable');\n if (this.hasAttribute('multiple')) {\n button.classList.toggle('selected');\n }\n else if (button === null \|\| button === void 0 ? void 0 : button.classList.contains('selected')) {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n }\n else {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n button.classList.add('selected');\n }\n }\n });\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n document.addEventListener('click', (event) => {\n if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n const button = event.originalTarget;\n const popoverID = button.getAttribute('popovertarget');\n const popover = document.getElementById(popoverID);\n const viewportOffset = button.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n popover.style.setProperty('top', top + 'px');\n popover.style.setProperty('left', left + button.clientWidth + 'px');\n }\n });\n }\n }\n}\nexport default iamMenu;\n","import { trackComponent } from '../_global';\nimport { cardHTML, setupCard } from '../../modules/card.module';\nimport iamMenu from '../menu/menu.component';\nconst getAssetLocation = () => document.body.getAttribute('data-assets-location') \|\| '/assets';\nclass iamCard extends HTMLElement {\n constructor() {\n super();\n const shadowRoot = this.attachShadow({ mode: 'open' });\n const assetLocation = getAssetLocation();\n const loadCSS = `@import \"${assetLocation}/css/components/card.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n ${cardHTML}\n <slot name=\"link\"></slot>\n <slot name=\"primary-action\"></slot>\n `;\n shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const shadowRoot = this.shadowRoot;\n const cardBody = shadowRoot === null \|\| shadowRoot === void 0 ? void 0 : shadowRoot.querySelector('.card__body');\n if (!shadowRoot)\n return;\n if (!window.customElements.get(`iam-menu`))\n window.customElements.define(`iam-menu`, iamMenu);\n setupCard(this);\n // Add Illustration HTML\n if (this.hasAttribute('data-illustration')) {\n cardBody === null \|\| cardBody === void 0 ? void 0 : cardBody.insertAdjacentHTML('afterbegin', `<div class=\"card__illustration\"><img src=\"${this.getAttribute('data-illustration')}\" alt=\"\" loading=\"lazy\" /></div>`);\n }\n // Add class that shows the right arrow icon\n if (!this.querySelector('[slot=\"btns\"]') && !this.querySelector('[slot=\"secondary\"]') && !this.classList.contains('card--article') && !this.closest('.carousel--article-cards')) {\n this.classList.add('show-icon');\n }\n // Secondary buttons and actions\n // Add the dialog wrapper HTML\n if (this.querySelector('[slot=\"btns\"]')) {\n const menuTemplate = document.createElement('template');\n menuTemplate.innerHTML = `<div class=\"menu__wrapper\">\n <button class=\"btn btn-secondary btn-compact fa-ellipsis-vertical m-0\" popovertarget=\"actions\" style=\"anchor-name: --anchor-el;\" title=\"Further actions\" type=\"button\">Open further actions</button>\n <iam-menu class=\"dialog--fix dialog--list\" id=\"actions\" style=\"position-anchor: --anchor-el;\" popover>\n <slot name=\"btns\"></slot>\n </iam-menu>\n </div>`;\n shadowRoot.appendChild(menuTemplate.content.cloneNode(true));\n // safari and firefox anchor fix for cards\n if (typeof CSS === 'undefined' \|\| !CSS.supports('top', 'anchor(top)')) {\n const actionButton = shadowRoot.querySelector('[popovertarget=\"actions\"]');\n const actionPopover = shadowRoot.querySelector('[popover]');\n actionButton === null \|\| actionButton === void 0 ? void 0 : actionButton.addEventListener('click', () => {\n this.style.setProperty('overflow', 'visible');\n this.style.setProperty('z-index', '999999');\n const viewportOffset = actionButton.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n actionPopover === null \|\| actionPopover === void 0 ? void 0 : actionPopover.style.setProperty('display', 'block');\n actionPopover === null \|\| actionPopover === void 0 ? void 0 : actionPopover.style.setProperty('top', top + 'px');\n actionPopover === null \|\| actionPopover === void 0 ? void 0 : actionPopover.style.setProperty('left', left - 100 + 'px');\n });\n document.addEventListener('scroll', () => {\n actionPopover === null \|\| actionPopover === void 0 ? void 0 : actionPopover.style.setProperty('display', 'none');\n });\n }\n }\n // Make sure slotted buttons and links have correct button classes\n this.querySelectorAll('[slot=\"btns\"]').forEach((button) => {\n button.classList.add('btn');\n button.classList.add('btn-action');\n });\n // Hide the default hover and focus states when interacting with the checkbox, dialog wrapper or secondary button\n const preventHoverElement = this.querySelector('[slot=\"checkbox\"],[slot=\"secondary\"]');\n if (preventHoverElement) {\n preventHoverElement.addEventListener('mouseenter', () => {\n this.classList.add('prevent-hover');\n });\n preventHoverElement.addEventListener('mouseleave', () => {\n this.classList.remove('prevent-hover');\n });\n }\n const menuWrapper = shadowRoot.querySelector('.menu__wrapper');\n if (menuWrapper) {\n menuWrapper.addEventListener('mouseenter', () => {\n this.classList.add('prevent-hover');\n });\n menuWrapper.addEventListener('mouseleave', () => {\n this.classList.remove('prevent-hover');\n });\n }\n // Dispatch events of selecting checkboxes\n const checkbox = this.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.addEventListener('change', () => {\n if (checkbox.checked) {\n const customEvent = new CustomEvent('select-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n this.dispatchEvent(customEvent);\n }\n else {\n const customEvent = new CustomEvent('unselect-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n this.dispatchEvent(customEvent);\n }\n });\n }\n // Dispatch events of click onto secondary buttons\n const secondaryBtn = this.querySelector('[slot=\"secondary\"]');\n if (secondaryBtn) {\n secondaryBtn.addEventListener('click', () => {\n const customEvent = new CustomEvent('secondary-button-clicked', {\n detail: { Title: secondaryBtn.getAttribute('title') },\n });\n this.dispatchEvent(customEvent);\n });\n }\n // Dispatch events of click onto action buttons\n this.querySelectorAll('[slot=\"btns\"]').forEach((button) => {\n button.addEventListener('click', () => {\n const customEvent = new CustomEvent('action-button-clicked', {\n detail: { Title: button.getAttribute('title') },\n });\n this.dispatchEvent(customEvent);\n });\n });\n if (this.querySelector('[slot=\"link\"]'))\n this.classList.add('hasLink');\n trackComponent(this, 'iam-card', [\n 'select-card',\n 'unselect-card',\n 'secondary-button-clicked',\n 'action-button-clicked',\n ]);\n }\n static get observedAttributes() {\n return ['data-image'];\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n const shadowRoot = this.shadowRoot;\n if (!shadowRoot)\n return;\n switch (attrName) {\n case 'data-total': {\n const cardTotal = shadowRoot.querySelector('.card__total');\n if (cardTotal)\n cardTotal.innerHTML = newVal \|\| '';\n break;\n }\n case 'data-image': {\n if (oldVal != newVal) {\n const cardHeadImg = shadowRoot.querySelector('.card__head img');\n if (cardHeadImg)\n cardHeadImg.setAttribute('src', newVal \|\| '');\n }\n break;\n }\n }\n }\n}\nexport default iamCard;\n"],"names":["trackComponent","component","componentName","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","cardHTML","getCardPart","cardComponent","selector","_a","setupCard","cardHead","cardBody","cardBadges","cardTotal","iamMenu","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","activeItem","prevIndex","nextIndex","subMenuItems","e","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left","getAssetLocation","iamCard","shadowRoot","menuTemplate","actionButton","actionPopover","preventHoverElement","menuWrapper","checkbox","customEvent","secondaryBtn","attrName","oldVal","newVal","cardHeadImg"],"mappings":"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"}

package/assets/js/components/carousel/carousel.component.js CHANGED Viewed

@@ -2,6 +2,7 @@ import { trackComponentRegistered } from '../_global';
 trackComponentRegistered('iam-carousel');
 class iamCarousel extends HTMLElement {
     constructor() {
+        var _a;
         super();
         this.generateThumbnailList = (carouselComponent) => {
             const thumbnailImages = [];
@@ -32,29 +33,80 @@ class iamCarousel extends HTMLElement {
         this.progressPercent = (value, total) => {
             return ((value) / (total)) * 100 + '%';
         };
-    }
-    connectedCallback() {
-        this.insertAdjacentHTML('beforeend', `
-      <div class="carousel__controls">
-        <div class="carousel__pips"></div>
-        <div class="carousel__progress carousel__progress-xs">
-          <input type="range" min="0" max="100" value="0" step="1" />
+        this.attachShadow({ mode: 'open' });
+        const assetLocation = document.body.hasAttribute('data-assets-location')
+            ? document.body.getAttribute('data-assets-location')
+            : '/assets';
+        const loadCSS = `@import "${assetLocation}/css/components/carousel.component.css";`;
+        const template = document.createElement('template');
+        template.innerHTML = /* HTML */ `
+      <style>
+        ${loadCSS}
+      </style>
+      <slot></slot>
+      <div class="carousel__controls" part="carousel__controls">
+        <div class="carousel__pips" part="carousel__pips"></div>
+        <div class="carousel__progress carousel__progress-xs" part="carousel__progress-xs">
+          <input type="range" min="1" max="100" value="1" step="1" />
         </div>
-        <div class="carousel__progress carousel__progress-sm">
-          <input type="range" min="0" max="100" value="0" step="1" />
+        <div class="carousel__progress carousel__progress-sm" part="carousel__progress-sm">
+          <input type="range" min="1" max="100" value="1" step="1" />
         </div>
-        <div class="carousel__progress carousel__progress-md">
-          <input type="range" min="0" max="100" value="0" step="1" />
+        <div class="carousel__progress carousel__progress-md" part="carousel__progress-md">
+          <input type="range" min="1" max="100" value="1" step="1" />
         </div>
       </div>
-    `);
+    `;
+        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
+    }
+    connectedCallback() {
+        /*
+        this.insertAdjacentHTML('beforeend',`
+          <div class="carousel__controls">
+            <div class="carousel__pips"></div>
+            <div class="carousel__progress carousel__progress-xs">
+              <input type="range" min="0" max="100" value="0" step="1" />
+            </div>
+            <div class="carousel__progress carousel__progress-sm">
+              <input type="range" min="0" max="100" value="0" step="1" />
+            </div>
+            <div class="carousel__progress carousel__progress-md">
+              <input type="range" min="0" max="100" value="0" step="1" />
+            </div>
+          </div>
+        `)
+        */
         // eslint-disable-next-line @typescript-eslint/no-this-alias
         const carouselElement = this;
-        const carouselProgress = this.querySelector('.carousel__progress-xs [type="range"]');
-        const carouselProgressSM = this.querySelector('.carousel__progress-sm [type="range"]');
-        const carouselProgressMD = this.querySelector('.carousel__progress-md [type="range"]');
+        const carouselProgress = this.shadowRoot.querySelector('.carousel__progress-xs [type="range"]');
+        const carouselProgressSM = this.shadowRoot.querySelector('.carousel__progress-sm [type="range"]');
+        const carouselProgressMD = this.shadowRoot.querySelector('.carousel__progress-md [type="range"]');
         const itemCount = this.querySelectorAll(':scope > *:not(.carousel__controls)').length;
         const progressPercent = this.progressPercent;
+        this.querySelectorAll(':scope > *').forEach((item, index) => {
+            item.setAttribute('data-child', index + 1);
+        });
+        this.setAttribute('data-current', 1);
+        this.addEventListener("scrollsnapchange", (event) => {
+            const snapTargetInlineElement = event.snapTargetInline;
+            const child = Array.from(snapTargetInlineElement.parentElement.children).indexOf(snapTargetInlineElement) + 1;
+            if (child != this.getAttribute('data-current')) {
+                const customEvent = new CustomEvent(`snap-to`, {
+                    detail: {
+                        item: child,
+                    },
+                });
+                this.dispatchEvent(customEvent);
+                this.setAttribute('data-current', child);
+            }
+            console.log(child);
+            carouselProgress.value = child;
+            carouselProgress.style.setProperty('--percent', progressPercent(child, itemCount));
+            carouselProgressSM.value = child;
+            carouselProgressSM.style.setProperty('--percent', progressPercent(child, carouselProgressSM === null || carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));
+            carouselProgressMD.value = child;
+            carouselProgressMD.style.setProperty('--percent', progressPercent(child, carouselProgressMD === null || carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));
+        });
         let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';
         if ('ontouchstart' in document.documentElement) {
             stepperEvent = 'touchend';
@@ -83,14 +135,15 @@ class iamCarousel extends HTMLElement {
         });
         // SM Progress bar
         const smStep = this.getAttribute('data-smcols') ? this.getAttribute('data-smcols') : 1;
-        const smItemCount = Math.floor(itemCount / smStep) * smStep;
-        carouselProgressSM.setAttribute('max', smItemCount);
+        //const smItemCount = Math.floor(itemCount / smStep) * smStep;
+        const SMMax = ((Math.floor(itemCount / smStep) - 1) * smStep) + 1;
+        carouselProgressSM.setAttribute('max', SMMax);
         carouselProgressSM.setAttribute('step', smStep);
-        carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, smItemCount));
+        carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, carouselProgressSM === null || carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));
         carouselProgressSM.addEventListener(stepperStart, () => {
             clearInterval(stepperInterval);
             stepperInterval = setInterval(function () {
-                carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, smItemCount));
+                carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, carouselProgressSM === null || carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));
             });
         });
         carouselProgressSM.addEventListener(stepperEvent, function () {
@@ -98,8 +151,8 @@ class iamCarousel extends HTMLElement {
         });
         carouselProgressSM.addEventListener('change', () => {
             clearInterval(stepperInterval);
-            carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, smItemCount));
-            const scrollTo = Math.floor((carouselElement.scrollWidth / smItemCount) * carouselProgressSM.value);
+            carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, carouselProgressSM === null || carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));
+            const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) * carouselProgressSM.value);
             carouselElement.scrollTo({
                 top: 0,
                 left: scrollTo,
@@ -107,15 +160,15 @@ class iamCarousel extends HTMLElement {
             });
         });
         // MD Progress bar
-        const mdStep = this.getAttribute('data-smcols') ? this.getAttribute('data-smcols') : 1;
-        const mdItemCount = Math.floor(itemCount / mdStep) * mdStep;
-        carouselProgressMD.setAttribute('max', mdItemCount);
+        const mdStep = this.getAttribute('data-mdcols') ? this.getAttribute('data-mdcols') : 1;
+        const mdMax = ((Math.floor(itemCount / mdStep) - 1) * mdStep) + 1;
+        carouselProgressMD.setAttribute('max', mdMax);
         carouselProgressMD.setAttribute('step', mdStep);
-        carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, mdItemCount));
+        carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, carouselProgressMD === null || carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));
         carouselProgressMD.addEventListener(stepperStart, () => {
             clearInterval(stepperInterval);
             stepperInterval = setInterval(function () {
-                carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, mdItemCount));
+                carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, carouselProgressMD === null || carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));
             });
         });
         carouselProgressMD.addEventListener(stepperEvent, function () {
@@ -123,8 +176,9 @@ class iamCarousel extends HTMLElement {
         });
         carouselProgressMD.addEventListener('change', () => {
             clearInterval(stepperInterval);
-            carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, mdItemCount));
-            const scrollTo = Math.floor((carouselElement.scrollWidth / mdItemCount) * carouselProgressMD.value);
+            carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, carouselProgressMD === null || carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));
+            const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) * carouselProgressMD.value);
+            console.log(carouselProgressMD.value);
             carouselElement.scrollTo({
                 top: 0,
                 left: scrollTo,
@@ -132,7 +186,7 @@ class iamCarousel extends HTMLElement {
             });
         });
         // Thumbnails
-        const carouselPips = this.querySelector('.carousel__pips');
+        const carouselPips = this.shadowRoot.querySelector('.carousel__pips');
         if (carouselElement.querySelector('[data-thumbnail]')) {
             const thumbnailImages = this.generateThumbnailList(carouselElement);
             carouselElement.classList.add('thumbnails');

package/assets/js/components/carousel/carousel.component.min.js CHANGED Viewed

@@ -1,18 +1,23 @@
 /*!
-  * iamKey v7.8.2--beta3
+  * iamKey v7.8.2--beta4
   * Copyright 2022-2026 iamproperty
-  */const b=g=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:g})};b("iam-carousel");class _ extends HTMLElement{constructor(){super(),this.generateThumbnailList=t=>{const e=[];return Array.from(t.querySelectorAll(":scope > :is(div,iam-card)")).forEach((s,o)=>{s.hasAttribute("data-thumbnail")&&(e[o]=s.getAttribute("data-thumbnail"))}),e},this.generatePipsHTML=(t,e)=>{const s=t.querySelectorAll(":scope > :is(div,iam-card)").length;let o="";for(let r=1;r<=s;r++){let l=null,a="";e.length&&e[r-1]?(a="has-thumbnail",l=`<img src="${e[r-1]}" alt="Slide ${r}" height="148"/>`):l=`Slide ${r}`,o+=`<button class="control-${r} ${a}" data-slide="${r}" ${r==1?"aria-current":""}>${l}</button>`}return o},this.progressPercent=(t,e)=>t/e*100+"%"}connectedCallback(){this.insertAdjacentHTML("beforeend",`
-      <div class="carousel__controls">
-        <div class="carousel__pips"></div>
-        <div class="carousel__progress carousel__progress-xs">
-          <input type="range" min="0" max="100" value="0" step="1" />
+  */const y=g=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:g})};y("iam-carousel");class w extends HTMLElement{constructor(){var a;super(),this.generateThumbnailList=e=>{const t=[];return Array.from(e.querySelectorAll(":scope > :is(div,iam-card)")).forEach((i,o)=>{i.hasAttribute("data-thumbnail")&&(t[o]=i.getAttribute("data-thumbnail"))}),t},this.generatePipsHTML=(e,t)=>{const i=e.querySelectorAll(":scope > :is(div,iam-card)").length;let o="";for(let r=1;r<=i;r++){let c=null,m="";t.length&&t[r-1]?(m="has-thumbnail",c=`<img src="${t[r-1]}" alt="Slide ${r}" height="148"/>`):c=`Slide ${r}`,o+=`<button class="control-${r} ${m}" data-slide="${r}" ${r==1?"aria-current":""}>${c}</button>`}return o},this.progressPercent=(e,t)=>e/t*100+"%",this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
+      <style>
+        @layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:var(--fa-family-classic);margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:var(--fa-family-classic)}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:var(--fa-family-classic);margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:var(--fa-family-classic)}}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary);&:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:transparent;border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative;&:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}&.text-decoration-none:after{width:0%}&[class*=fa-]{margin-left:0;margin-right:.5rem}&[class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}&:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active){&:after{width:60% !important}}&:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2;&>.fa-chevron-down{display:none}&:not(:has(i)):not(.no-icon):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}&[aria-pressed]:after{transform:rotate(270deg)}}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content;select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important}&:after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em;select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}&:after{top:.2rem;right:.5rem}}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}*,*::before,*::after{box-sizing:border-box}@layer components{.carousel__controls{display:var(--carousel-controls-display, none);position:absolute;position-anchor:--carousel;top:auto;left:anchor(left);right:anchor(right);bottom:anchor(bottom);min-height:0;width:auto;z-index:99}.carousel__progress{margin-inline:auto;text-align:center;display:none;padding-bottom:0}.carousel__progress input[type=range]{--track-size: 0.5rem;--track-colour: #a5ecfd;--thumb-colour: var(--colour-info);--thumb-size: 1rem;--thumb-size-outline: 0;width:90%;max-width:10.75rem;background:rgba(0,0,0,0);cursor:pointer;margin:0;height:1rem;border-radius:50%;accent-color:var(--thumb-colour);-webkit-appearance:none;appearance:none}.carousel__progress input[type=range]::-webkit-slider-runnable-track{background:var(--track-colour);height:var(--track-size);border-radius:.5625rem}.carousel__progress input[type=range]::-moz-range-track{background:var(--track-colour);height:var(--track-size);border-radius:.5625rem}.carousel__progress 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) calc(var(--percent, 0%)), var(--track-colour) calc(var(--percent, 0%)))}.carousel__progress 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) calc(var(--percent, 0%)), var(--track-colour) calc(var(--percent, 0%)))}.carousel__progress input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-0.25rem;background-color:var(--thumb-colour);height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;position:relative;z-index:99;pointer-events:all}.carousel__progress input[type=range]::-moz-range-thumb{border:none;background-color:var(--thumb-colour);height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;position:relative;z-index:99;pointer-events:all}.carousel__progress input[type=range]:focus{outline:none}.carousel__progress input[type=range]:hover::-webkit-slider-thumb,.carousel__progress input[type=range]:focus::-webkit-slider-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}.carousel__progress input[type=range]:active::-webkit-slider-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}.carousel__progress input[type=range]:hover::-moz-range-thumb,.carousel__progress input[type=range]:focus::-moz-range-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}.carousel__progress input[type=range]:focus::-moz-range-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}.carousel__pips{display:flex !important;flex-wrap:nowrap;max-width:100%;overflow:hidden;overflow-x:auto}.carousel__pips button{padding:0;margin:0 .2rem .4rem;width:6rem;height:4rem;aspect-ratio:3/2;border-radius:0;position:relative;border-radius:.25rem}.carousel__pips button img{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;margin:0}.carousel__pips button[aria-current]{outline:2px solid var(--colour-info)}}/*# sourceMappingURL=assets/css/components/carousel.component.css.map */
+      </style>
+      <slot></slot>
+      <div class="carousel__controls" part="carousel__controls">
+        <div class="carousel__pips" part="carousel__pips"></div>
+        <div class="carousel__progress carousel__progress-xs" part="carousel__progress-xs">
+          <input type="range" min="1" max="100" value="1" step="1" />
         </div>
-        <div class="carousel__progress carousel__progress-sm">
-          <input type="range" min="0" max="100" value="0" step="1" />
+        <div class="carousel__progress carousel__progress-sm" part="carousel__progress-sm">
+          <input type="range" min="1" max="100" value="1" step="1" />
         </div>
-        <div class="carousel__progress carousel__progress-md">
-          <input type="range" min="0" max="100" value="0" step="1" />
+        <div class="carousel__progress carousel__progress-md" part="carousel__progress-md">
+          <input type="range" min="1" max="100" value="1" step="1" />
         </div>
       </div>
-    `);const t=this,e=this.querySelector('.carousel__progress-xs [type="range"]'),s=this.querySelector('.carousel__progress-sm [type="range"]'),o=this.querySelector('.carousel__progress-md [type="range"]'),r=this.querySelectorAll(":scope > *:not(.carousel__controls)").length,l=this.progressPercent;let a,d="mouseup",p="mousedown";"ontouchstart"in document.documentElement&&(d="touchend",p="touchstart"),e.setAttribute("max",r),e.style.setProperty("--percent",l(e.value,r)),e.addEventListener(p,()=>{clearInterval(a),a=setInterval(function(){e.style.setProperty("--percent",l(e.value,r))},10)}),e.addEventListener(d,function(){clearInterval(a)}),e.addEventListener("change",()=>{clearInterval(a),e.style.setProperty("--percent",l(e.value,r));const n=Math.floor(t.scrollWidth/r*(e.value-1));t.scrollTo({top:0,left:n,behavior:"smooth"})});const v=this.getAttribute("data-smcols")?this.getAttribute("data-smcols"):1,c=Math.floor(r/v)*v;s.setAttribute("max",c),s.setAttribute("step",v),s.style.setProperty("--percent",l(s.value,c)),s.addEventListener(p,()=>{clearInterval(a),a=setInterval(function(){s.style.setProperty("--percent",l(s.value,c))})}),s.addEventListener(d,function(){clearInterval(a)}),s.addEventListener("change",()=>{clearInterval(a),s.style.setProperty("--percent",l(s.value,c));const n=Math.floor(t.scrollWidth/c*s.value);t.scrollTo({top:0,left:n,behavior:"smooth"})});const h=this.getAttribute("data-smcols")?this.getAttribute("data-smcols"):1,i=Math.floor(r/h)*h;o.setAttribute("max",i),o.setAttribute("step",h),o.style.setProperty("--percent",l(o.value,i)),o.addEventListener(p,()=>{clearInterval(a),a=setInterval(function(){o.style.setProperty("--percent",l(o.value,i))})}),o.addEventListener(d,function(){clearInterval(a)}),o.addEventListener("change",()=>{clearInterval(a),o.style.setProperty("--percent",l(o.value,i));const n=Math.floor(t.scrollWidth/i*o.value);t.scrollTo({top:0,left:n,behavior:"smooth"})});const u=this.querySelector(".carousel__pips");if(t.querySelector("[data-thumbnail]")){const n=this.generateThumbnailList(t);t.classList.add("thumbnails"),u.innerHTML=this.generatePipsHTML(t,n)}u.addEventListener("click",n=>{var m;if((m=u?.querySelector("[aria-current]"))===null||m===void 0||m.removeAttribute("aria-current"),n.target.closest("button[data-slide]")){n.target.closest("button[data-slide]").setAttribute("aria-current","true");const y=Math.floor(t.scrollWidth/r*n.target.closest("button[data-slide]").getAttribute("data-slide"));t.scrollTo({top:0,left:y,behavior:"smooth"})}})}}export{_ as default};
+    `,(a=this.shadowRoot)===null||a===void 0||a.appendChild(n.content.cloneNode(!0))}connectedCallback(){const a=this,n=this.shadowRoot.querySelector('.carousel__progress-xs [type="range"]'),e=this.shadowRoot.querySelector('.carousel__progress-sm [type="range"]'),t=this.shadowRoot.querySelector('.carousel__progress-md [type="range"]'),i=this.querySelectorAll(":scope > *:not(.carousel__controls)").length,o=this.progressPercent;this.querySelectorAll(":scope > *").forEach((s,d)=>{s.setAttribute("data-child",d+1)}),this.setAttribute("data-current",1),this.addEventListener("scrollsnapchange",s=>{const d=s.snapTargetInline,l=Array.from(d.parentElement.children).indexOf(d)+1;if(l!=this.getAttribute("data-current")){const f=new CustomEvent("snap-to",{detail:{item:l}});this.dispatchEvent(f),this.setAttribute("data-current",l)}console.log(l),n.value=l,n.style.setProperty("--percent",o(l,i)),e.value=l,e.style.setProperty("--percent",o(l,e?.getAttribute("max"))),t.value=l,t.style.setProperty("--percent",o(l,t?.getAttribute("max")))});let r,c="mouseup",m="mousedown";"ontouchstart"in document.documentElement&&(c="touchend",m="touchstart"),n.setAttribute("max",i),n.style.setProperty("--percent",o(n.value,i)),n.addEventListener(m,()=>{clearInterval(r),r=setInterval(function(){n.style.setProperty("--percent",o(n.value,i))},10)}),n.addEventListener(c,function(){clearInterval(r)}),n.addEventListener("change",()=>{clearInterval(r),n.style.setProperty("--percent",o(n.value,i));const s=Math.floor(a.scrollWidth/i*(n.value-1));a.scrollTo({top:0,left:s,behavior:"smooth"})});const b=this.getAttribute("data-smcols")?this.getAttribute("data-smcols"):1,h=(Math.floor(i/b)-1)*b+1;e.setAttribute("max",h),e.setAttribute("step",b),e.style.setProperty("--percent",o(e.value,e?.getAttribute("max"))),e.addEventListener(m,()=>{clearInterval(r),r=setInterval(function(){e.style.setProperty("--percent",o(e.value,e?.getAttribute("max")))})}),e.addEventListener(c,function(){clearInterval(r)}),e.addEventListener("change",()=>{clearInterval(r),e.style.setProperty("--percent",o(e.value,e?.getAttribute("max")));const s=Math.floor(a.scrollWidth/i*e.value);a.scrollTo({top:0,left:s,behavior:"smooth"})});const p=this.getAttribute("data-mdcols")?this.getAttribute("data-mdcols"):1,v=(Math.floor(i/p)-1)*p+1;t.setAttribute("max",v),t.setAttribute("step",p),t.style.setProperty("--percent",o(t.value,t?.getAttribute("max"))),t.addEventListener(m,()=>{clearInterval(r),r=setInterval(function(){t.style.setProperty("--percent",o(t.value,t?.getAttribute("max")))})}),t.addEventListener(c,function(){clearInterval(r)}),t.addEventListener("change",()=>{clearInterval(r),t.style.setProperty("--percent",o(t.value,t?.getAttribute("max")));const s=Math.floor(a.scrollWidth/i*t.value);console.log(t.value),a.scrollTo({top:0,left:s,behavior:"smooth"})});const u=this.shadowRoot.querySelector(".carousel__pips");if(a.querySelector("[data-thumbnail]")){const s=this.generateThumbnailList(a);a.classList.add("thumbnails"),u.innerHTML=this.generatePipsHTML(a,s)}u.addEventListener("click",s=>{var d;if((d=u?.querySelector("[aria-current]"))===null||d===void 0||d.removeAttribute("aria-current"),s.target.closest("button[data-slide]")){s.target.closest("button[data-slide]").setAttribute("aria-current","true");const l=Math.floor(a.scrollWidth/i*s.target.closest("button[data-slide]").getAttribute("data-slide"));a.scrollTo({top:0,left:l,behavior:"smooth"})}})}}export{w as default};
 //# sourceMappingURL=carousel.component.min.js.map

package/assets/js/components/carousel/carousel.component.min.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"carousel.component.min.js","sources":["../_global.js","carousel.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","import { trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-carousel');\nclass iamCarousel extends HTMLElement {\n constructor() {\n super();\n this.generateThumbnailList = (carouselComponent) => {\n const thumbnailImages = [];\n Array.from(carouselComponent.querySelectorAll(':scope > :is(div,iam-card)')).forEach((slide, index) => {\n if (slide.hasAttribute('data-thumbnail')) {\n thumbnailImages[index] = slide.getAttribute('data-thumbnail');\n }\n });\n return thumbnailImages;\n };\n this.generatePipsHTML = (carouselComponent, thumbnailImages) => {\n const itemCount = carouselComponent.querySelectorAll(':scope > :is(div,iam-card)').length;\n let pips = '';\n for (let i = 1; i <= itemCount; i++) {\n let pipContent = null;\n let pipClass = '';\n if (thumbnailImages.length && thumbnailImages[i - 1]) {\n pipClass = 'has-thumbnail';\n pipContent = `<img src=\"${thumbnailImages[i - 1]}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n }\n else {\n pipContent = `Slide ${i}`;\n }\n pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? 'aria-current' : ''}>${pipContent}</button>`;\n }\n return pips;\n };\n this.progressPercent = (value, total) => {\n return ((value) / (total)) * 100 + '%';\n };\n }\n connectedCallback() {\n this.insertAdjacentHTML('beforeend', `\n <div class=\"carousel__controls\">\n <div class=\"carousel__pips\"></div>\n <div class=\"carousel__progress carousel__progress-xs\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"0\" step=\"1\" />\n </div>\n <div class=\"carousel__progress carousel__progress-sm\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"0\" step=\"1\" />\n </div>\n <div class=\"carousel__progress carousel__progress-md\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"0\" step=\"1\" />\n </div>\n </div>\n `);\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const carouselElement = this;\n const carouselProgress = this.querySelector('.carousel__progress-xs [type=\"range\"]');\n const carouselProgressSM = this.querySelector('.carousel__progress-sm [type=\"range\"]');\n const carouselProgressMD = this.querySelector('.carousel__progress-md [type=\"range\"]');\n const itemCount = this.querySelectorAll(':scope > :not(.carousel__controls)').length;\n const progressPercent = this.progressPercent;\n let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';\n if ('ontouchstart' in document.documentElement) {\n stepperEvent = 'touchend';\n stepperStart = 'touchstart';\n }\n carouselProgress.setAttribute('max', itemCount);\n carouselProgress.style.setProperty('--percent', progressPercent(carouselProgress.value, itemCount));\n carouselProgress.addEventListener(stepperStart, () => {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n carouselProgress.style.setProperty('--percent', progressPercent(carouselProgress.value, itemCount));\n }, 10);\n });\n carouselProgress.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgress.addEventListener('change', () => {\n clearInterval(stepperInterval);\n carouselProgress.style.setProperty('--percent', progressPercent(carouselProgress.value, itemCount));\n const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) (carouselProgress.value - 1));\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n });\n // SM Progress bar\n const smStep = this.getAttribute('data-smcols') ? this.getAttribute('data-smcols') : 1;\n const smItemCount = Math.floor(itemCount / smStep) * smStep;\n carouselProgressSM.setAttribute('max', smItemCount);\n carouselProgressSM.setAttribute('step', smStep);\n carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, smItemCount));\n carouselProgressSM.addEventListener(stepperStart, () => {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, smItemCount));\n });\n });\n carouselProgressSM.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgressSM.addEventListener('change', () => {\n clearInterval(stepperInterval);\n carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, smItemCount));\n const scrollTo = Math.floor((carouselElement.scrollWidth / smItemCount) * carouselProgressSM.value);\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n });\n // MD Progress bar\n const mdStep = this.getAttribute('data-smcols') ? this.getAttribute('data-smcols') : 1;\n const mdItemCount = Math.floor(itemCount / mdStep) * mdStep;\n carouselProgressMD.setAttribute('max', mdItemCount);\n carouselProgressMD.setAttribute('step', mdStep);\n carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, mdItemCount));\n carouselProgressMD.addEventListener(stepperStart, () => {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, mdItemCount));\n });\n });\n carouselProgressMD.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgressMD.addEventListener('change', () => {\n clearInterval(stepperInterval);\n carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, mdItemCount));\n const scrollTo = Math.floor((carouselElement.scrollWidth / mdItemCount) * carouselProgressMD.value);\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n });\n // Thumbnails\n const carouselPips = this.querySelector('.carousel__pips');\n if (carouselElement.querySelector('[data-thumbnail]')) {\n const thumbnailImages = this.generateThumbnailList(carouselElement);\n carouselElement.classList.add('thumbnails');\n carouselPips.innerHTML = this.generatePipsHTML(carouselElement, thumbnailImages);\n }\n carouselPips.addEventListener('click', (event) => {\n var _a;\n (_a = carouselPips === null \|\| carouselPips === void 0 ? void 0 : carouselPips.querySelector('[aria-current]')) === null \|\| _a === void 0 ? void 0 : _a.removeAttribute('aria-current');\n if (event.target.closest('button[data-slide]')) {\n event.target.closest('button[data-slide]').setAttribute('aria-current', 'true');\n const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) * event.target.closest('button[data-slide]').getAttribute('data-slide'));\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n }\n });\n }\n}\nexport default iamCarousel;\n"],"names":["trackComponentRegistered","componentName","iamCarousel","carouselComponent","thumbnailImages","slide","index","itemCount","pips","i","pipContent","pipClass","value","total","carouselElement","carouselProgress","carouselProgressSM","carouselProgressMD","progressPercent","stepperInterval","stepperEvent","stepperStart","scrollTo","smStep","smItemCount","mdStep","mdItemCount","carouselPips","event","_a"],"mappings":"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"}
1	+ {"version":3,"file":"carousel.component.min.js","sources":["../_global.js","carousel.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer \|\| [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","import { trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-carousel');\nclass iamCarousel extends HTMLElement {\n constructor() {\n var _a;\n super();\n this.generateThumbnailList = (carouselComponent) => {\n const thumbnailImages = [];\n Array.from(carouselComponent.querySelectorAll(':scope > :is(div,iam-card)')).forEach((slide, index) => {\n if (slide.hasAttribute('data-thumbnail')) {\n thumbnailImages[index] = slide.getAttribute('data-thumbnail');\n }\n });\n return thumbnailImages;\n };\n this.generatePipsHTML = (carouselComponent, thumbnailImages) => {\n const itemCount = carouselComponent.querySelectorAll(':scope > :is(div,iam-card)').length;\n let pips = '';\n for (let i = 1; i <= itemCount; i++) {\n let pipContent = null;\n let pipClass = '';\n if (thumbnailImages.length && thumbnailImages[i - 1]) {\n pipClass = 'has-thumbnail';\n pipContent = `<img src=\"${thumbnailImages[i - 1]}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n }\n else {\n pipContent = `Slide ${i}`;\n }\n pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? 'aria-current' : ''}>${pipContent}</button>`;\n }\n return pips;\n };\n this.progressPercent = (value, total) => {\n return ((value) / (total)) * 100 + '%';\n };\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/carousel.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = /* HTML / `\n <style>\n ${loadCSS}\n </style>\n <slot></slot>\n <div class=\"carousel__controls\" part=\"carousel__controls\">\n <div class=\"carousel__pips\" part=\"carousel__pips\"></div>\n <div class=\"carousel__progress carousel__progress-xs\" part=\"carousel__progress-xs\">\n <input type=\"range\" min=\"1\" max=\"100\" value=\"1\" step=\"1\" />\n </div>\n <div class=\"carousel__progress carousel__progress-sm\" part=\"carousel__progress-sm\">\n <input type=\"range\" min=\"1\" max=\"100\" value=\"1\" step=\"1\" />\n </div>\n <div class=\"carousel__progress carousel__progress-md\" part=\"carousel__progress-md\">\n <input type=\"range\" min=\"1\" max=\"100\" value=\"1\" step=\"1\" />\n </div>\n </div>\n `;\n (_a = this.shadowRoot) === null \|\| _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n /\n this.insertAdjacentHTML('beforeend',`\n <div class=\"carousel__controls\">\n <div class=\"carousel__pips\"></div>\n <div class=\"carousel__progress carousel__progress-xs\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"0\" step=\"1\" />\n </div>\n <div class=\"carousel__progress carousel__progress-sm\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"0\" step=\"1\" />\n </div>\n <div class=\"carousel__progress carousel__progress-md\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"0\" step=\"1\" />\n </div>\n </div>\n `)\n /\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const carouselElement = this;\n const carouselProgress = this.shadowRoot.querySelector('.carousel__progress-xs [type=\"range\"]');\n const carouselProgressSM = this.shadowRoot.querySelector('.carousel__progress-sm [type=\"range\"]');\n const carouselProgressMD = this.shadowRoot.querySelector('.carousel__progress-md [type=\"range\"]');\n const itemCount = this.querySelectorAll(':scope > :not(.carousel__controls)').length;\n const progressPercent = this.progressPercent;\n this.querySelectorAll(':scope > ').forEach((item, index) => {\n item.setAttribute('data-child', index + 1);\n });\n this.setAttribute('data-current', 1);\n this.addEventListener(\"scrollsnapchange\", (event) => {\n const snapTargetInlineElement = event.snapTargetInline;\n const child = Array.from(snapTargetInlineElement.parentElement.children).indexOf(snapTargetInlineElement) + 1;\n if (child != this.getAttribute('data-current')) {\n const customEvent = new CustomEvent(`snap-to`, {\n detail: {\n item: child,\n },\n });\n this.dispatchEvent(customEvent);\n this.setAttribute('data-current', child);\n }\n console.log(child);\n carouselProgress.value = child;\n carouselProgress.style.setProperty('--percent', progressPercent(child, itemCount));\n carouselProgressSM.value = child;\n carouselProgressSM.style.setProperty('--percent', progressPercent(child, carouselProgressSM === null \|\| carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));\n carouselProgressMD.value = child;\n carouselProgressMD.style.setProperty('--percent', progressPercent(child, carouselProgressMD === null \|\| carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));\n });\n let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';\n if ('ontouchstart' in document.documentElement) {\n stepperEvent = 'touchend';\n stepperStart = 'touchstart';\n }\n carouselProgress.setAttribute('max', itemCount);\n carouselProgress.style.setProperty('--percent', progressPercent(carouselProgress.value, itemCount));\n carouselProgress.addEventListener(stepperStart, () => {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n carouselProgress.style.setProperty('--percent', progressPercent(carouselProgress.value, itemCount));\n }, 10);\n });\n carouselProgress.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgress.addEventListener('change', () => {\n clearInterval(stepperInterval);\n carouselProgress.style.setProperty('--percent', progressPercent(carouselProgress.value, itemCount));\n const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) (carouselProgress.value - 1));\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n });\n // SM Progress bar\n const smStep = this.getAttribute('data-smcols') ? this.getAttribute('data-smcols') : 1;\n //const smItemCount = Math.floor(itemCount / smStep) * smStep;\n const SMMax = ((Math.floor(itemCount / smStep) - 1) * smStep) + 1;\n carouselProgressSM.setAttribute('max', SMMax);\n carouselProgressSM.setAttribute('step', smStep);\n carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, carouselProgressSM === null \|\| carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));\n carouselProgressSM.addEventListener(stepperStart, () => {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, carouselProgressSM === null \|\| carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));\n });\n });\n carouselProgressSM.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgressSM.addEventListener('change', () => {\n clearInterval(stepperInterval);\n carouselProgressSM.style.setProperty('--percent', progressPercent(carouselProgressSM.value, carouselProgressSM === null \|\| carouselProgressSM === void 0 ? void 0 : carouselProgressSM.getAttribute('max')));\n const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) * carouselProgressSM.value);\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n });\n // MD Progress bar\n const mdStep = this.getAttribute('data-mdcols') ? this.getAttribute('data-mdcols') : 1;\n const mdMax = ((Math.floor(itemCount / mdStep) - 1) * mdStep) + 1;\n carouselProgressMD.setAttribute('max', mdMax);\n carouselProgressMD.setAttribute('step', mdStep);\n carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, carouselProgressMD === null \|\| carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));\n carouselProgressMD.addEventListener(stepperStart, () => {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, carouselProgressMD === null \|\| carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));\n });\n });\n carouselProgressMD.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgressMD.addEventListener('change', () => {\n clearInterval(stepperInterval);\n carouselProgressMD.style.setProperty('--percent', progressPercent(carouselProgressMD.value, carouselProgressMD === null \|\| carouselProgressMD === void 0 ? void 0 : carouselProgressMD.getAttribute('max')));\n const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) * carouselProgressMD.value);\n console.log(carouselProgressMD.value);\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n });\n // Thumbnails\n const carouselPips = this.shadowRoot.querySelector('.carousel__pips');\n if (carouselElement.querySelector('[data-thumbnail]')) {\n const thumbnailImages = this.generateThumbnailList(carouselElement);\n carouselElement.classList.add('thumbnails');\n carouselPips.innerHTML = this.generatePipsHTML(carouselElement, thumbnailImages);\n }\n carouselPips.addEventListener('click', (event) => {\n var _a;\n (_a = carouselPips === null \|\| carouselPips === void 0 ? void 0 : carouselPips.querySelector('[aria-current]')) === null \|\| _a === void 0 ? void 0 : _a.removeAttribute('aria-current');\n if (event.target.closest('button[data-slide]')) {\n event.target.closest('button[data-slide]').setAttribute('aria-current', 'true');\n const scrollTo = Math.floor((carouselElement.scrollWidth / itemCount) * event.target.closest('button[data-slide]').getAttribute('data-slide'));\n carouselElement.scrollTo({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n }\n });\n }\n}\nexport default iamCarousel;\n"],"names":["trackComponentRegistered","componentName","iamCarousel","_a","carouselComponent","thumbnailImages","slide","index","itemCount","pips","i","pipContent","pipClass","value","total","template","carouselElement","carouselProgress","carouselProgressSM","carouselProgressMD","progressPercent","item","event","snapTargetInlineElement","child","customEvent","stepperInterval","stepperEvent","stepperStart","scrollTo","smStep","SMMax","mdStep","mdMax","carouselPips"],"mappings":"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"}

package/assets/js/components/collapsible-side/collapsible-side.component.min.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.8.2--beta3
+  * iamKey v7.8.2--beta4
   * Copyright 2022-2026 iamproperty
   */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"collapsible side menu"});class c extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const o=document.createElement("template");o.innerHTML=`
     <style class="styles">