@aurodesignsystem-dev/auro-slideshow 0.0.0-pr18.0 → 0.0.0-pr19.0

package/demo/demo-index.min.js

@@ -1,2225 +1,4 @@
-import { x, e as elementChildren, c as createElement, m as makeElementsArray, a as elementParents, b as elementOuterSize, d as elementIndex, g as getDocument, T, E, i as i$2, s as styleCss, f as i$3, h as colorCss, t as tokensCss, j as tokensCss$1, k as styleCss$1, l as colorCss$1, n as styleCss$2, o as tokensCss$2, p as colorCss$2, q as styleCss$3, S as Swiper } from './api.min.js';
-
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const a=Symbol.for(""),o$1=t=>{if(t?.r===a)return t?._$litStatic$},s=t=>({_$litStatic$:t,r:a}),i$1=(t,...r)=>({_$litStatic$:r.reduce(((r,e,a)=>r+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n            take care to ensure page security.`)})(e)+t[a+1]),t[0]),r:a}),l=new Map,n=t=>(r,...e)=>{const a=e.length;let s,i;const n=[],u=[];let c,$=0,f=false;for(;$<a;){for(c=r[$];$<a&&void 0!==(i=e[$],s=o$1(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l.get(t))&&(n.raw=n,l.set(t,r=n)),e=u;}return t(r,...e)},u=n(x);
-
-function createElementIfNotDefined(swiper, originalParams, params, checkProps) {
-  if (swiper.params.createElements) {
-    Object.keys(checkProps).forEach(key => {
-      if (!params[key] && params.auto === true) {
-        let element = elementChildren(swiper.el, `.${checkProps[key]}`)[0];
-        if (!element) {
-          element = createElement('div', checkProps[key]);
-          element.className = checkProps[key];
-          swiper.el.append(element);
-        }
-        params[key] = element;
-        originalParams[key] = element;
-      }
-    });
-  }
-  return params;
-}
-
-function Navigation(_ref) {
-  let {
-    swiper,
-    extendParams,
-    on,
-    emit
-  } = _ref;
-  extendParams({
-    navigation: {
-      nextEl: null,
-      prevEl: null,
-      hideOnClick: false,
-      disabledClass: 'swiper-button-disabled',
-      hiddenClass: 'swiper-button-hidden',
-      lockClass: 'swiper-button-lock',
-      navigationDisabledClass: 'swiper-navigation-disabled'
-    }
-  });
-  swiper.navigation = {
-    nextEl: null,
-    prevEl: null
-  };
-  function getEl(el) {
-    let res;
-    if (el && typeof el === 'string' && swiper.isElement) {
-      res = swiper.el.querySelector(el) || swiper.hostEl.querySelector(el);
-      if (res) return res;
-    }
-    if (el) {
-      if (typeof el === 'string') res = [...document.querySelectorAll(el)];
-      if (swiper.params.uniqueNavElements && typeof el === 'string' && res && res.length > 1 && swiper.el.querySelectorAll(el).length === 1) {
-        res = swiper.el.querySelector(el);
-      } else if (res && res.length === 1) {
-        res = res[0];
-      }
-    }
-    if (el && !res) return el;
-    // if (Array.isArray(res) && res.length === 1) res = res[0];
-    return res;
-  }
-  function toggleEl(el, disabled) {
-    const params = swiper.params.navigation;
-    el = makeElementsArray(el);
-    el.forEach(subEl => {
-      if (subEl) {
-        subEl.classList[disabled ? 'add' : 'remove'](...params.disabledClass.split(' '));
-        if (subEl.tagName === 'BUTTON') subEl.disabled = disabled;
-        if (swiper.params.watchOverflow && swiper.enabled) {
-          subEl.classList[swiper.isLocked ? 'add' : 'remove'](params.lockClass);
-        }
-      }
-    });
-  }
-  function update() {
-    // Update Navigation Buttons
-    const {
-      nextEl,
-      prevEl
-    } = swiper.navigation;
-    if (swiper.params.loop) {
-      toggleEl(prevEl, false);
-      toggleEl(nextEl, false);
-      return;
-    }
-    toggleEl(prevEl, swiper.isBeginning && !swiper.params.rewind);
-    toggleEl(nextEl, swiper.isEnd && !swiper.params.rewind);
-  }
-  function onPrevClick(e) {
-    e.preventDefault();
-    if (swiper.isBeginning && !swiper.params.loop && !swiper.params.rewind) return;
-    swiper.slidePrev();
-    emit('navigationPrev');
-  }
-  function onNextClick(e) {
-    e.preventDefault();
-    if (swiper.isEnd && !swiper.params.loop && !swiper.params.rewind) return;
-    swiper.slideNext();
-    emit('navigationNext');
-  }
-  function init() {
-    const params = swiper.params.navigation;
-    swiper.params.navigation = createElementIfNotDefined(swiper, swiper.originalParams.navigation, swiper.params.navigation, {
-      nextEl: 'swiper-button-next',
-      prevEl: 'swiper-button-prev'
-    });
-    if (!(params.nextEl || params.prevEl)) return;
-    let nextEl = getEl(params.nextEl);
-    let prevEl = getEl(params.prevEl);
-    Object.assign(swiper.navigation, {
-      nextEl,
-      prevEl
-    });
-    nextEl = makeElementsArray(nextEl);
-    prevEl = makeElementsArray(prevEl);
-    const initButton = (el, dir) => {
-      if (el) {
-        el.addEventListener('click', dir === 'next' ? onNextClick : onPrevClick);
-      }
-      if (!swiper.enabled && el) {
-        el.classList.add(...params.lockClass.split(' '));
-      }
-    };
-    nextEl.forEach(el => initButton(el, 'next'));
-    prevEl.forEach(el => initButton(el, 'prev'));
-  }
-  function destroy() {
-    let {
-      nextEl,
-      prevEl
-    } = swiper.navigation;
-    nextEl = makeElementsArray(nextEl);
-    prevEl = makeElementsArray(prevEl);
-    const destroyButton = (el, dir) => {
-      el.removeEventListener('click', dir === 'next' ? onNextClick : onPrevClick);
-      el.classList.remove(...swiper.params.navigation.disabledClass.split(' '));
-    };
-    nextEl.forEach(el => destroyButton(el, 'next'));
-    prevEl.forEach(el => destroyButton(el, 'prev'));
-  }
-  on('init', () => {
-    if (swiper.params.navigation.enabled === false) {
-      // eslint-disable-next-line
-      disable();
-    } else {
-      init();
-      update();
-    }
-  });
-  on('toEdge fromEdge lock unlock', () => {
-    update();
-  });
-  on('destroy', () => {
-    destroy();
-  });
-  on('enable disable', () => {
-    let {
-      nextEl,
-      prevEl
-    } = swiper.navigation;
-    nextEl = makeElementsArray(nextEl);
-    prevEl = makeElementsArray(prevEl);
-    if (swiper.enabled) {
-      update();
-      return;
-    }
-    [...nextEl, ...prevEl].filter(el => !!el).forEach(el => el.classList.add(swiper.params.navigation.lockClass));
-  });
-  on('click', (_s, e) => {
-    let {
-      nextEl,
-      prevEl
-    } = swiper.navigation;
-    nextEl = makeElementsArray(nextEl);
-    prevEl = makeElementsArray(prevEl);
-    const targetEl = e.target;
-    let targetIsButton = prevEl.includes(targetEl) || nextEl.includes(targetEl);
-    if (swiper.isElement && !targetIsButton) {
-      const path = e.path || e.composedPath && e.composedPath();
-      if (path) {
-        targetIsButton = path.find(pathEl => nextEl.includes(pathEl) || prevEl.includes(pathEl));
-      }
-    }
-    if (swiper.params.navigation.hideOnClick && !targetIsButton) {
-      if (swiper.pagination && swiper.params.pagination && swiper.params.pagination.clickable && (swiper.pagination.el === targetEl || swiper.pagination.el.contains(targetEl))) return;
-      let isHidden;
-      if (nextEl.length) {
-        isHidden = nextEl[0].classList.contains(swiper.params.navigation.hiddenClass);
-      } else if (prevEl.length) {
-        isHidden = prevEl[0].classList.contains(swiper.params.navigation.hiddenClass);
-      }
-      if (isHidden === true) {
-        emit('navigationShow');
-      } else {
-        emit('navigationHide');
-      }
-      [...nextEl, ...prevEl].filter(el => !!el).forEach(el => el.classList.toggle(swiper.params.navigation.hiddenClass));
-    }
-  });
-  const enable = () => {
-    swiper.el.classList.remove(...swiper.params.navigation.navigationDisabledClass.split(' '));
-    init();
-    update();
-  };
-  const disable = () => {
-    swiper.el.classList.add(...swiper.params.navigation.navigationDisabledClass.split(' '));
-    destroy();
-  };
-  Object.assign(swiper.navigation, {
-    enable,
-    disable,
-    update,
-    init,
-    destroy
-  });
-}
-
-function classesToSelector(classes) {
-  if (classes === void 0) {
-    classes = '';
-  }
-  return `.${classes.trim().replace(/([\.:!+\/])/g, '\\$1') // eslint-disable-line
-  .replace(/ /g, '.')}`;
-}
-
-function Pagination(_ref) {
-  let {
-    swiper,
-    extendParams,
-    on,
-    emit
-  } = _ref;
-  const pfx = 'swiper-pagination';
-  extendParams({
-    pagination: {
-      el: null,
-      bulletElement: 'span',
-      clickable: false,
-      hideOnClick: false,
-      renderBullet: null,
-      renderProgressbar: null,
-      renderFraction: null,
-      renderCustom: null,
-      progressbarOpposite: false,
-      type: 'bullets',
-      // 'bullets' or 'progressbar' or 'fraction' or 'custom'
-      dynamicBullets: false,
-      dynamicMainBullets: 1,
-      formatFractionCurrent: number => number,
-      formatFractionTotal: number => number,
-      bulletClass: `${pfx}-bullet`,
-      bulletActiveClass: `${pfx}-bullet-active`,
-      modifierClass: `${pfx}-`,
-      currentClass: `${pfx}-current`,
-      totalClass: `${pfx}-total`,
-      hiddenClass: `${pfx}-hidden`,
-      progressbarFillClass: `${pfx}-progressbar-fill`,
-      progressbarOppositeClass: `${pfx}-progressbar-opposite`,
-      clickableClass: `${pfx}-clickable`,
-      lockClass: `${pfx}-lock`,
-      horizontalClass: `${pfx}-horizontal`,
-      verticalClass: `${pfx}-vertical`,
-      paginationDisabledClass: `${pfx}-disabled`
-    }
-  });
-  swiper.pagination = {
-    el: null,
-    bullets: []
-  };
-  let bulletSize;
-  let dynamicBulletIndex = 0;
-  function isPaginationDisabled() {
-    return !swiper.params.pagination.el || !swiper.pagination.el || Array.isArray(swiper.pagination.el) && swiper.pagination.el.length === 0;
-  }
-  function setSideBullets(bulletEl, position) {
-    const {
-      bulletActiveClass
-    } = swiper.params.pagination;
-    if (!bulletEl) return;
-    bulletEl = bulletEl[`${position === 'prev' ? 'previous' : 'next'}ElementSibling`];
-    if (bulletEl) {
-      bulletEl.classList.add(`${bulletActiveClass}-${position}`);
-      bulletEl = bulletEl[`${position === 'prev' ? 'previous' : 'next'}ElementSibling`];
-      if (bulletEl) {
-        bulletEl.classList.add(`${bulletActiveClass}-${position}-${position}`);
-      }
-    }
-  }
-  function getMoveDirection(prevIndex, nextIndex, length) {
-    prevIndex = prevIndex % length;
-    nextIndex = nextIndex % length;
-    if (nextIndex === prevIndex + 1) {
-      return 'next';
-    } else if (nextIndex === prevIndex - 1) {
-      return 'previous';
-    }
-    return;
-  }
-  function onBulletClick(e) {
-    const bulletEl = e.target.closest(classesToSelector(swiper.params.pagination.bulletClass));
-    if (!bulletEl) {
-      return;
-    }
-    e.preventDefault();
-    const index = elementIndex(bulletEl) * swiper.params.slidesPerGroup;
-    if (swiper.params.loop) {
-      if (swiper.realIndex === index) return;
-      const moveDirection = getMoveDirection(swiper.realIndex, index, swiper.slides.length);
-      if (moveDirection === 'next') {
-        swiper.slideNext();
-      } else if (moveDirection === 'previous') {
-        swiper.slidePrev();
-      } else {
-        swiper.slideToLoop(index);
-      }
-    } else {
-      swiper.slideTo(index);
-    }
-  }
-  function update() {
-    // Render || Update Pagination bullets/items
-    const rtl = swiper.rtl;
-    const params = swiper.params.pagination;
-    if (isPaginationDisabled()) return;
-    let el = swiper.pagination.el;
-    el = makeElementsArray(el);
-    // Current/Total
-    let current;
-    let previousIndex;
-    const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
-    const total = swiper.params.loop ? Math.ceil(slidesLength / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
-    if (swiper.params.loop) {
-      previousIndex = swiper.previousRealIndex || 0;
-      current = swiper.params.slidesPerGroup > 1 ? Math.floor(swiper.realIndex / swiper.params.slidesPerGroup) : swiper.realIndex;
-    } else if (typeof swiper.snapIndex !== 'undefined') {
-      current = swiper.snapIndex;
-      previousIndex = swiper.previousSnapIndex;
-    } else {
-      previousIndex = swiper.previousIndex || 0;
-      current = swiper.activeIndex || 0;
-    }
-    // Types
-    if (params.type === 'bullets' && swiper.pagination.bullets && swiper.pagination.bullets.length > 0) {
-      const bullets = swiper.pagination.bullets;
-      let firstIndex;
-      let lastIndex;
-      let midIndex;
-      if (params.dynamicBullets) {
-        bulletSize = elementOuterSize(bullets[0], swiper.isHorizontal() ? 'width' : 'height');
-        el.forEach(subEl => {
-          subEl.style[swiper.isHorizontal() ? 'width' : 'height'] = `${bulletSize * (params.dynamicMainBullets + 4)}px`;
-        });
-        if (params.dynamicMainBullets > 1 && previousIndex !== undefined) {
-          dynamicBulletIndex += current - (previousIndex || 0);
-          if (dynamicBulletIndex > params.dynamicMainBullets - 1) {
-            dynamicBulletIndex = params.dynamicMainBullets - 1;
-          } else if (dynamicBulletIndex < 0) {
-            dynamicBulletIndex = 0;
-          }
-        }
-        firstIndex = Math.max(current - dynamicBulletIndex, 0);
-        lastIndex = firstIndex + (Math.min(bullets.length, params.dynamicMainBullets) - 1);
-        midIndex = (lastIndex + firstIndex) / 2;
-      }
-      bullets.forEach(bulletEl => {
-        const classesToRemove = [...['', '-next', '-next-next', '-prev', '-prev-prev', '-main'].map(suffix => `${params.bulletActiveClass}${suffix}`)].map(s => typeof s === 'string' && s.includes(' ') ? s.split(' ') : s).flat();
-        bulletEl.classList.remove(...classesToRemove);
-      });
-      if (el.length > 1) {
-        bullets.forEach(bullet => {
-          const bulletIndex = elementIndex(bullet);
-          if (bulletIndex === current) {
-            bullet.classList.add(...params.bulletActiveClass.split(' '));
-          } else if (swiper.isElement) {
-            bullet.setAttribute('part', 'bullet');
-          }
-          if (params.dynamicBullets) {
-            if (bulletIndex >= firstIndex && bulletIndex <= lastIndex) {
-              bullet.classList.add(...`${params.bulletActiveClass}-main`.split(' '));
-            }
-            if (bulletIndex === firstIndex) {
-              setSideBullets(bullet, 'prev');
-            }
-            if (bulletIndex === lastIndex) {
-              setSideBullets(bullet, 'next');
-            }
-          }
-        });
-      } else {
-        const bullet = bullets[current];
-        if (bullet) {
-          bullet.classList.add(...params.bulletActiveClass.split(' '));
-        }
-        if (swiper.isElement) {
-          bullets.forEach((bulletEl, bulletIndex) => {
-            bulletEl.setAttribute('part', bulletIndex === current ? 'bullet-active' : 'bullet');
-          });
-        }
-        if (params.dynamicBullets) {
-          const firstDisplayedBullet = bullets[firstIndex];
-          const lastDisplayedBullet = bullets[lastIndex];
-          for (let i = firstIndex; i <= lastIndex; i += 1) {
-            if (bullets[i]) {
-              bullets[i].classList.add(...`${params.bulletActiveClass}-main`.split(' '));
-            }
-          }
-          setSideBullets(firstDisplayedBullet, 'prev');
-          setSideBullets(lastDisplayedBullet, 'next');
-        }
-      }
-      if (params.dynamicBullets) {
-        const dynamicBulletsLength = Math.min(bullets.length, params.dynamicMainBullets + 4);
-        const bulletsOffset = (bulletSize * dynamicBulletsLength - bulletSize) / 2 - midIndex * bulletSize;
-        const offsetProp = rtl ? 'right' : 'left';
-        bullets.forEach(bullet => {
-          bullet.style[swiper.isHorizontal() ? offsetProp : 'top'] = `${bulletsOffset}px`;
-        });
-      }
-    }
-    el.forEach((subEl, subElIndex) => {
-      if (params.type === 'fraction') {
-        subEl.querySelectorAll(classesToSelector(params.currentClass)).forEach(fractionEl => {
-          fractionEl.textContent = params.formatFractionCurrent(current + 1);
-        });
-        subEl.querySelectorAll(classesToSelector(params.totalClass)).forEach(totalEl => {
-          totalEl.textContent = params.formatFractionTotal(total);
-        });
-      }
-      if (params.type === 'progressbar') {
-        let progressbarDirection;
-        if (params.progressbarOpposite) {
-          progressbarDirection = swiper.isHorizontal() ? 'vertical' : 'horizontal';
-        } else {
-          progressbarDirection = swiper.isHorizontal() ? 'horizontal' : 'vertical';
-        }
-        const scale = (current + 1) / total;
-        let scaleX = 1;
-        let scaleY = 1;
-        if (progressbarDirection === 'horizontal') {
-          scaleX = scale;
-        } else {
-          scaleY = scale;
-        }
-        subEl.querySelectorAll(classesToSelector(params.progressbarFillClass)).forEach(progressEl => {
-          progressEl.style.transform = `translate3d(0,0,0) scaleX(${scaleX}) scaleY(${scaleY})`;
-          progressEl.style.transitionDuration = `${swiper.params.speed}ms`;
-        });
-      }
-      if (params.type === 'custom' && params.renderCustom) {
-        subEl.innerHTML = params.renderCustom(swiper, current + 1, total);
-        if (subElIndex === 0) emit('paginationRender', subEl);
-      } else {
-        if (subElIndex === 0) emit('paginationRender', subEl);
-        emit('paginationUpdate', subEl);
-      }
-      if (swiper.params.watchOverflow && swiper.enabled) {
-        subEl.classList[swiper.isLocked ? 'add' : 'remove'](params.lockClass);
-      }
-    });
-  }
-  function render() {
-    // Render Container
-    const params = swiper.params.pagination;
-    if (isPaginationDisabled()) return;
-    const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.grid && swiper.params.grid.rows > 1 ? swiper.slides.length / Math.ceil(swiper.params.grid.rows) : swiper.slides.length;
-    let el = swiper.pagination.el;
-    el = makeElementsArray(el);
-    let paginationHTML = '';
-    if (params.type === 'bullets') {
-      let numberOfBullets = swiper.params.loop ? Math.ceil(slidesLength / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
-      if (swiper.params.freeMode && swiper.params.freeMode.enabled && numberOfBullets > slidesLength) {
-        numberOfBullets = slidesLength;
-      }
-      for (let i = 0; i < numberOfBullets; i += 1) {
-        if (params.renderBullet) {
-          paginationHTML += params.renderBullet.call(swiper, i, params.bulletClass);
-        } else {
-          // prettier-ignore
-          paginationHTML += `<${params.bulletElement} ${swiper.isElement ? 'part="bullet"' : ''} class="${params.bulletClass}"></${params.bulletElement}>`;
-        }
-      }
-    }
-    if (params.type === 'fraction') {
-      if (params.renderFraction) {
-        paginationHTML = params.renderFraction.call(swiper, params.currentClass, params.totalClass);
-      } else {
-        paginationHTML = `<span class="${params.currentClass}"></span>` + ' / ' + `<span class="${params.totalClass}"></span>`;
-      }
-    }
-    if (params.type === 'progressbar') {
-      if (params.renderProgressbar) {
-        paginationHTML = params.renderProgressbar.call(swiper, params.progressbarFillClass);
-      } else {
-        paginationHTML = `<span class="${params.progressbarFillClass}"></span>`;
-      }
-    }
-    swiper.pagination.bullets = [];
-    el.forEach(subEl => {
-      if (params.type !== 'custom') {
-        subEl.innerHTML = paginationHTML || '';
-      }
-      if (params.type === 'bullets') {
-        swiper.pagination.bullets.push(...subEl.querySelectorAll(classesToSelector(params.bulletClass)));
-      }
-    });
-    if (params.type !== 'custom') {
-      emit('paginationRender', el[0]);
-    }
-  }
-  function init() {
-    swiper.params.pagination = createElementIfNotDefined(swiper, swiper.originalParams.pagination, swiper.params.pagination, {
-      el: 'swiper-pagination'
-    });
-    const params = swiper.params.pagination;
-    if (!params.el) return;
-    let el;
-    if (typeof params.el === 'string' && swiper.isElement) {
-      el = swiper.el.querySelector(params.el);
-    }
-    if (!el && typeof params.el === 'string') {
-      el = [...document.querySelectorAll(params.el)];
-    }
-    if (!el) {
-      el = params.el;
-    }
-    if (!el || el.length === 0) return;
-    if (swiper.params.uniqueNavElements && typeof params.el === 'string' && Array.isArray(el) && el.length > 1) {
-      el = [...swiper.el.querySelectorAll(params.el)];
-      // check if it belongs to another nested Swiper
-      if (el.length > 1) {
-        el = el.find(subEl => {
-          if (elementParents(subEl, '.swiper')[0] !== swiper.el) return false;
-          return true;
-        });
-      }
-    }
-    if (Array.isArray(el) && el.length === 1) el = el[0];
-    Object.assign(swiper.pagination, {
-      el
-    });
-    el = makeElementsArray(el);
-    el.forEach(subEl => {
-      if (params.type === 'bullets' && params.clickable) {
-        subEl.classList.add(...(params.clickableClass || '').split(' '));
-      }
-      subEl.classList.add(params.modifierClass + params.type);
-      subEl.classList.add(swiper.isHorizontal() ? params.horizontalClass : params.verticalClass);
-      if (params.type === 'bullets' && params.dynamicBullets) {
-        subEl.classList.add(`${params.modifierClass}${params.type}-dynamic`);
-        dynamicBulletIndex = 0;
-        if (params.dynamicMainBullets < 1) {
-          params.dynamicMainBullets = 1;
-        }
-      }
-      if (params.type === 'progressbar' && params.progressbarOpposite) {
-        subEl.classList.add(params.progressbarOppositeClass);
-      }
-      if (params.clickable) {
-        subEl.addEventListener('click', onBulletClick);
-      }
-      if (!swiper.enabled) {
-        subEl.classList.add(params.lockClass);
-      }
-    });
-  }
-  function destroy() {
-    const params = swiper.params.pagination;
-    if (isPaginationDisabled()) return;
-    let el = swiper.pagination.el;
-    if (el) {
-      el = makeElementsArray(el);
-      el.forEach(subEl => {
-        subEl.classList.remove(params.hiddenClass);
-        subEl.classList.remove(params.modifierClass + params.type);
-        subEl.classList.remove(swiper.isHorizontal() ? params.horizontalClass : params.verticalClass);
-        if (params.clickable) {
-          subEl.classList.remove(...(params.clickableClass || '').split(' '));
-          subEl.removeEventListener('click', onBulletClick);
-        }
-      });
-    }
-    if (swiper.pagination.bullets) swiper.pagination.bullets.forEach(subEl => subEl.classList.remove(...params.bulletActiveClass.split(' ')));
-  }
-  on('changeDirection', () => {
-    if (!swiper.pagination || !swiper.pagination.el) return;
-    const params = swiper.params.pagination;
-    let {
-      el
-    } = swiper.pagination;
-    el = makeElementsArray(el);
-    el.forEach(subEl => {
-      subEl.classList.remove(params.horizontalClass, params.verticalClass);
-      subEl.classList.add(swiper.isHorizontal() ? params.horizontalClass : params.verticalClass);
-    });
-  });
-  on('init', () => {
-    if (swiper.params.pagination.enabled === false) {
-      // eslint-disable-next-line
-      disable();
-    } else {
-      init();
-      render();
-      update();
-    }
-  });
-  on('activeIndexChange', () => {
-    if (typeof swiper.snapIndex === 'undefined') {
-      update();
-    }
-  });
-  on('snapIndexChange', () => {
-    update();
-  });
-  on('snapGridLengthChange', () => {
-    render();
-    update();
-  });
-  on('destroy', () => {
-    destroy();
-  });
-  on('enable disable', () => {
-    let {
-      el
-    } = swiper.pagination;
-    if (el) {
-      el = makeElementsArray(el);
-      el.forEach(subEl => subEl.classList[swiper.enabled ? 'remove' : 'add'](swiper.params.pagination.lockClass));
-    }
-  });
-  on('lock unlock', () => {
-    update();
-  });
-  on('click', (_s, e) => {
-    const targetEl = e.target;
-    const el = makeElementsArray(swiper.pagination.el);
-    if (swiper.params.pagination.el && swiper.params.pagination.hideOnClick && el && el.length > 0 && !targetEl.classList.contains(swiper.params.pagination.bulletClass)) {
-      if (swiper.navigation && (swiper.navigation.nextEl && targetEl === swiper.navigation.nextEl || swiper.navigation.prevEl && targetEl === swiper.navigation.prevEl)) return;
-      const isHidden = el[0].classList.contains(swiper.params.pagination.hiddenClass);
-      if (isHidden === true) {
-        emit('paginationShow');
-      } else {
-        emit('paginationHide');
-      }
-      el.forEach(subEl => subEl.classList.toggle(swiper.params.pagination.hiddenClass));
-    }
-  });
-  const enable = () => {
-    swiper.el.classList.remove(swiper.params.pagination.paginationDisabledClass);
-    let {
-      el
-    } = swiper.pagination;
-    if (el) {
-      el = makeElementsArray(el);
-      el.forEach(subEl => subEl.classList.remove(swiper.params.pagination.paginationDisabledClass));
-    }
-    init();
-    render();
-    update();
-  };
-  const disable = () => {
-    swiper.el.classList.add(swiper.params.pagination.paginationDisabledClass);
-    let {
-      el
-    } = swiper.pagination;
-    if (el) {
-      el = makeElementsArray(el);
-      el.forEach(subEl => subEl.classList.add(swiper.params.pagination.paginationDisabledClass));
-    }
-    destroy();
-  };
-  Object.assign(swiper.pagination, {
-    enable,
-    disable,
-    render,
-    update,
-    init,
-    destroy
-  });
-}
-
-/* eslint no-underscore-dangle: "off" */
-/* eslint no-use-before-define: "off" */
-function Autoplay(_ref) {
-  let {
-    swiper,
-    extendParams,
-    on,
-    emit,
-    params
-  } = _ref;
-  swiper.autoplay = {
-    running: false,
-    paused: false,
-    timeLeft: 0
-  };
-  extendParams({
-    autoplay: {
-      enabled: false,
-      delay: 3000,
-      waitForTransition: true,
-      disableOnInteraction: false,
-      stopOnLastSlide: false,
-      reverseDirection: false,
-      pauseOnMouseEnter: false
-    }
-  });
-  let timeout;
-  let raf;
-  let autoplayDelayTotal = params && params.autoplay ? params.autoplay.delay : 3000;
-  let autoplayDelayCurrent = params && params.autoplay ? params.autoplay.delay : 3000;
-  let autoplayTimeLeft;
-  let autoplayStartTime = new Date().getTime();
-  let wasPaused;
-  let isTouched;
-  let pausedByTouch;
-  let touchStartTimeout;
-  let slideChanged;
-  let pausedByInteraction;
-  let pausedByPointerEnter;
-  function onTransitionEnd(e) {
-    if (!swiper || swiper.destroyed || !swiper.wrapperEl) return;
-    if (e.target !== swiper.wrapperEl) return;
-    swiper.wrapperEl.removeEventListener('transitionend', onTransitionEnd);
-    if (pausedByPointerEnter || e.detail && e.detail.bySwiperTouchMove) {
-      return;
-    }
-    resume();
-  }
-  const calcTimeLeft = () => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    if (swiper.autoplay.paused) {
-      wasPaused = true;
-    } else if (wasPaused) {
-      autoplayDelayCurrent = autoplayTimeLeft;
-      wasPaused = false;
-    }
-    const timeLeft = swiper.autoplay.paused ? autoplayTimeLeft : autoplayStartTime + autoplayDelayCurrent - new Date().getTime();
-    swiper.autoplay.timeLeft = timeLeft;
-    emit('autoplayTimeLeft', timeLeft, timeLeft / autoplayDelayTotal);
-    raf = requestAnimationFrame(() => {
-      calcTimeLeft();
-    });
-  };
-  const getSlideDelay = () => {
-    let activeSlideEl;
-    if (swiper.virtual && swiper.params.virtual.enabled) {
-      activeSlideEl = swiper.slides.find(slideEl => slideEl.classList.contains('swiper-slide-active'));
-    } else {
-      activeSlideEl = swiper.slides[swiper.activeIndex];
-    }
-    if (!activeSlideEl) return undefined;
-    const currentSlideDelay = parseInt(activeSlideEl.getAttribute('data-swiper-autoplay'), 10);
-    return currentSlideDelay;
-  };
-  const run = delayForce => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    cancelAnimationFrame(raf);
-    calcTimeLeft();
-    let delay = typeof delayForce === 'undefined' ? swiper.params.autoplay.delay : delayForce;
-    autoplayDelayTotal = swiper.params.autoplay.delay;
-    autoplayDelayCurrent = swiper.params.autoplay.delay;
-    const currentSlideDelay = getSlideDelay();
-    if (!Number.isNaN(currentSlideDelay) && currentSlideDelay > 0 && typeof delayForce === 'undefined') {
-      delay = currentSlideDelay;
-      autoplayDelayTotal = currentSlideDelay;
-      autoplayDelayCurrent = currentSlideDelay;
-    }
-    autoplayTimeLeft = delay;
-    const speed = swiper.params.speed;
-    const proceed = () => {
-      if (!swiper || swiper.destroyed) return;
-      if (swiper.params.autoplay.reverseDirection) {
-        if (!swiper.isBeginning || swiper.params.loop || swiper.params.rewind) {
-          swiper.slidePrev(speed, true, true);
-          emit('autoplay');
-        } else if (!swiper.params.autoplay.stopOnLastSlide) {
-          swiper.slideTo(swiper.slides.length - 1, speed, true, true);
-          emit('autoplay');
-        }
-      } else {
-        if (!swiper.isEnd || swiper.params.loop || swiper.params.rewind) {
-          swiper.slideNext(speed, true, true);
-          emit('autoplay');
-        } else if (!swiper.params.autoplay.stopOnLastSlide) {
-          swiper.slideTo(0, speed, true, true);
-          emit('autoplay');
-        }
-      }
-      if (swiper.params.cssMode) {
-        autoplayStartTime = new Date().getTime();
-        requestAnimationFrame(() => {
-          run();
-        });
-      }
-    };
-    if (delay > 0) {
-      clearTimeout(timeout);
-      timeout = setTimeout(() => {
-        proceed();
-      }, delay);
-    } else {
-      requestAnimationFrame(() => {
-        proceed();
-      });
-    }
-
-    // eslint-disable-next-line
-    return delay;
-  };
-  const start = () => {
-    autoplayStartTime = new Date().getTime();
-    swiper.autoplay.running = true;
-    run();
-    emit('autoplayStart');
-  };
-  const stop = () => {
-    swiper.autoplay.running = false;
-    clearTimeout(timeout);
-    cancelAnimationFrame(raf);
-    emit('autoplayStop');
-  };
-  const pause = (internal, reset) => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    clearTimeout(timeout);
-    if (!internal) {
-      pausedByInteraction = true;
-    }
-    const proceed = () => {
-      emit('autoplayPause');
-      if (swiper.params.autoplay.waitForTransition) {
-        swiper.wrapperEl.addEventListener('transitionend', onTransitionEnd);
-      } else {
-        resume();
-      }
-    };
-    swiper.autoplay.paused = true;
-    if (reset) {
-      if (slideChanged) {
-        autoplayTimeLeft = swiper.params.autoplay.delay;
-      }
-      slideChanged = false;
-      proceed();
-      return;
-    }
-    const delay = autoplayTimeLeft || swiper.params.autoplay.delay;
-    autoplayTimeLeft = delay - (new Date().getTime() - autoplayStartTime);
-    if (swiper.isEnd && autoplayTimeLeft < 0 && !swiper.params.loop) return;
-    if (autoplayTimeLeft < 0) autoplayTimeLeft = 0;
-    proceed();
-  };
-  const resume = () => {
-    if (swiper.isEnd && autoplayTimeLeft < 0 && !swiper.params.loop || swiper.destroyed || !swiper.autoplay.running) return;
-    autoplayStartTime = new Date().getTime();
-    if (pausedByInteraction) {
-      pausedByInteraction = false;
-      run(autoplayTimeLeft);
-    } else {
-      run();
-    }
-    swiper.autoplay.paused = false;
-    emit('autoplayResume');
-  };
-  const onVisibilityChange = () => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    const document = getDocument();
-    if (document.visibilityState === 'hidden') {
-      pausedByInteraction = true;
-      pause(true);
-    }
-    if (document.visibilityState === 'visible') {
-      resume();
-    }
-  };
-  const onPointerEnter = e => {
-    if (e.pointerType !== 'mouse') return;
-    pausedByInteraction = true;
-    pausedByPointerEnter = true;
-    if (swiper.animating || swiper.autoplay.paused) return;
-    pause(true);
-  };
-  const onPointerLeave = e => {
-    if (e.pointerType !== 'mouse') return;
-    pausedByPointerEnter = false;
-    if (swiper.autoplay.paused) {
-      resume();
-    }
-  };
-  const attachMouseEvents = () => {
-    if (swiper.params.autoplay.pauseOnMouseEnter) {
-      swiper.el.addEventListener('pointerenter', onPointerEnter);
-      swiper.el.addEventListener('pointerleave', onPointerLeave);
-    }
-  };
-  const detachMouseEvents = () => {
-    if (swiper.el && typeof swiper.el !== 'string') {
-      swiper.el.removeEventListener('pointerenter', onPointerEnter);
-      swiper.el.removeEventListener('pointerleave', onPointerLeave);
-    }
-  };
-  const attachDocumentEvents = () => {
-    const document = getDocument();
-    document.addEventListener('visibilitychange', onVisibilityChange);
-  };
-  const detachDocumentEvents = () => {
-    const document = getDocument();
-    document.removeEventListener('visibilitychange', onVisibilityChange);
-  };
-  on('init', () => {
-    if (swiper.params.autoplay.enabled) {
-      attachMouseEvents();
-      attachDocumentEvents();
-      start();
-    }
-  });
-  on('destroy', () => {
-    detachMouseEvents();
-    detachDocumentEvents();
-    if (swiper.autoplay.running) {
-      stop();
-    }
-  });
-  on('_freeModeStaticRelease', () => {
-    if (pausedByTouch || pausedByInteraction) {
-      resume();
-    }
-  });
-  on('_freeModeNoMomentumRelease', () => {
-    if (!swiper.params.autoplay.disableOnInteraction) {
-      pause(true, true);
-    } else {
-      stop();
-    }
-  });
-  on('beforeTransitionStart', (_s, speed, internal) => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    if (internal || !swiper.params.autoplay.disableOnInteraction) {
-      pause(true, true);
-    } else {
-      stop();
-    }
-  });
-  on('sliderFirstMove', () => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    if (swiper.params.autoplay.disableOnInteraction) {
-      stop();
-      return;
-    }
-    isTouched = true;
-    pausedByTouch = false;
-    pausedByInteraction = false;
-    touchStartTimeout = setTimeout(() => {
-      pausedByInteraction = true;
-      pausedByTouch = true;
-      pause(true);
-    }, 200);
-  });
-  on('touchEnd', () => {
-    if (swiper.destroyed || !swiper.autoplay.running || !isTouched) return;
-    clearTimeout(touchStartTimeout);
-    clearTimeout(timeout);
-    if (swiper.params.autoplay.disableOnInteraction) {
-      pausedByTouch = false;
-      isTouched = false;
-      return;
-    }
-    if (pausedByTouch && swiper.params.cssMode) resume();
-    pausedByTouch = false;
-    isTouched = false;
-  });
-  on('slideChange', () => {
-    if (swiper.destroyed || !swiper.autoplay.running) return;
-    slideChanged = true;
-  });
-  Object.assign(swiper.autoplay, {
-    start,
-    stop,
-    pause,
-    resume
-  });
-}
-
-// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-class AuroDependencyVersioning {
-
-  /**
-   * Generates a unique string to be used for child auro element naming.
-   * @private
-   * @param {string} baseName - Defines the first part of the unique element name.
-   * @param {string} version - Version of the component that will be appended to the baseName.
-   * @returns {string} - Unique string to be used for naming.
-   */
-  generateElementName(baseName, version) {
-    let result = baseName;
-
-    result += '-';
-    result += version.replace(/[.]/g, '_');
-
-    return result;
-  }
-
-  /**
-   * Generates a unique string to be used for child auro element naming.
-   * @param {string} baseName - Defines the first part of the unique element name.
-   * @param {string} version - Version of the component that will be appended to the baseName.
-   * @returns {string} - Unique string to be used for naming.
-   */
-  generateTag(baseName, version, tagClass) {
-    const elementName = this.generateElementName(baseName, version);
-    const tag = i$1`${s(elementName)}`;
-
-    if (!customElements.get(elementName)) {
-      customElements.define(elementName, class extends tagClass {});
-    }
-
-    return tag;
-  }
-}
-
-// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-// ---------------------------------------------------------------------
-
-/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
-
-class AuroLibraryRuntimeUtils {
-
-  /* eslint-disable jsdoc/require-param */
-
-  /**
-   * This will register a new custom element with the browser.
-   * @param {String} name - The name of the custom element.
-   * @param {Object} componentClass - The class to register as a custom element.
-   * @returns {void}
-   */
-  registerComponent(name, componentClass) {
-    if (!customElements.get(name)) {
-      customElements.define(name, class extends componentClass {});
-    }
-  }
-
-  /**
-   * Finds and returns the closest HTML Element based on a selector.
-   * @returns {void}
-   */
-  closestElement(
-    selector, // selector like in .closest()
-    base = this, // extra functionality to skip a parent
-    __Closest = (el, found = el && el.closest(selector)) =>
-      !el || el === document || el === window
-        ? null // standard .closest() returns null for non-found selectors also
-        : found
-          ? found // found a selector INside this element
-          : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
-  ) {
-    return __Closest(base);
-  }
-  /* eslint-enable jsdoc/require-param */
-
-  /**
-   * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
-   * @param {Object} elem - The element to check.
-   * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
-   * @returns {void}
-   */
-  handleComponentTagRename(elem, tagName) {
-    const tag = tagName.toLowerCase();
-    const elemTag = elem.tagName.toLowerCase();
-
-    if (elemTag !== tag) {
-      elem.setAttribute(tag, true);
-    }
-  }
-
-  /**
-   * Validates if an element is a specific Auro component.
-   * @param {Object} elem - The element to validate.
-   * @param {String} tagName - The name of the Auro component to check against.
-   * @returns {Boolean} - Returns true if the element is the specified Auro component.
-   */
-  elementMatch(elem, tagName) {
-    const tag = tagName.toLowerCase();
-    const elemTag = elem.tagName.toLowerCase();
-
-    return elemTag === tag || elem.hasAttribute(tag);
-  }
-}
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
-
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const e=e$1(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return T}});
-
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const o=o=>o??E;
-
-// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-class AuroLoader extends i$2 {
-  constructor() {
-    super();
-
-    /**
-     * @private
-     */
-    this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
-
-    /**
-     * @private
-     */
-    this.mdCount = 3;
-
-    /**
-     * @private
-     */
-    this.smCount = 2;
-
-    /**
-     * @private
-     */
-    this.runtimeUtils = new AuroLibraryRuntimeUtils();
-
-    this.orbit = false;
-    this.ringworm = false;
-    this.laser = false;
-    this.pulse = false;
-  }
-
-  // function to define props used within the scope of this component
-  static get properties() {
-    return {
-
-      /**
-       * Sets loader to laser type.
-       */
-      laser: {
-        type: Boolean,
-        reflect: true
-      },
-
-      /**
-       * Sets loader to orbit type.
-       */
-      orbit: {
-        type: Boolean,
-        reflect: true
-      },
-
-      /**
-       * Sets loader to pulse type.
-       */
-      pulse: {
-        type: Boolean,
-        reflect: true
-      },
-
-      /**
-       * Sets loader to ringworm type.
-       */
-      ringworm: {
-        type: Boolean,
-        reflect: true
-      }
-    };
-  }
-
-  static get styles() {
-    return [
-      i$3`${styleCss}`,
-      i$3`${colorCss}`,
-      i$3`${tokensCss}`
-    ];
-  }
-
-  /**
-   * This will register this element with the browser.
-   * @param {string} [name="auro-loader"] - The name of element that you want to register to.
-   *
-   * @example
-   * AuroLoader.register("custom-loader") // this will register this element to <custom-loader/>
-   *
-   */
-  static register(name = "auro-loader") {
-    AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroLoader);
-  }
-
-  firstUpdated() {
-    // Add the tag name as an attribute if it is different than the component name
-    this.runtimeUtils.handleComponentTagRename(this, 'auro-loader');
-  }
-
-  connectedCallback() {
-    super.connectedCallback();
-  }
-
-  /**
-   * @private
-   * @returns {Array} Numbered array for template map.
-   */
-  defineTemplate() {
-    let nodes = Array.from(Array(this.mdCount).keys());
-
-    if (this.orbit || this.laser) {
-      nodes = Array.from(Array(this.smCount).keys());
-    } else if (this.ringworm) {
-      nodes = Array.from(Array(0).keys());
-    }
-
-    return nodes;
-  }
-
-  // When using auroElement, use the following attribute and function when hiding content from screen readers.
-  // aria-hidden="${this.hideAudible(this.hiddenAudible)}"
-
-  // function that renders the HTML and CSS into  the scope of the component
-  render() {
-    return x`
-      ${this.defineTemplate().map((idx) => x`
-        <span part="element" class="loader node-${idx}"></span>
-      `)}
-
-      <div class="no-animation">Loading...</div>
-
-      ${this.ringworm ? x`
-        <svg  part="element" class="circular" viewBox="25 25 50 50">
-          <circle class="path" cx="50" cy="50" r="20" fill="none"/>
-        </svg>`
-        : ``
-      }
-    `;
-  }
-}
-
-var loaderVersion = '5.0.0';
-
-/* eslint-disable max-lines */
-// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-/**
- * @attr {Boolean} autofocus - This Boolean attribute lets you specify that the button should have input focus when the page loads, unless overridden by the user
- * @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
- * @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
- * @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
- * @attr {String} loadingText - Sets custom loading text for the `aria-label` on a button in loading state. If not set, the default value of "Loading..." will be used.
- * @attr {Boolean} onDark - Set value for on-dark version of auro-button
- * @attr {Boolean} rounded - If set to true, the button will have a rounded shape
- * @attr {Boolean} slim - Set value for slim version of auro-button
- * @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
- * @attr {String} arialabel - Populates the `aria-label` attribute that is used to define a string that labels the current element. Use it in cases where a text label is not visible on the screen. If there is visible text labeling the element, use `aria-labelledby` instead.
- * @attr {String} arialabelledby - Populates the `aria-labelledby` attribute that establishes relationships between objects and their label(s), and its value should be one or more element IDs, which refer to elements that have the text needed for labeling. List multiple element IDs in a space delimited fashion.
- * @attr {Boolean} ariaexpanded - Populates the `aria-expanded` attribute that indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. This is an optional attribute for buttons.
- * @attr {String} id - Set the unique ID of an element.
- * @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
- * @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
- * @attr {String} value - Defines the value associated with the button which is submitted with the form data.
- * @attr {String} variant - Sets button variant option. Possible values are: `secondary`, `tertiary`
- * @attr {Boolean} secondary - DEPRECATED
- * @attr {Boolean} tertiary - DEPRECATED
- * @prop {Boolean} ready - When false the component API should not be called.
- * @event auroButton-ready - Notifies that the component has finished initializing.
- * @slot - Default slot for the text of the button.
- * @slot icon - Slot to provide auro-icon for the button.
- * @csspart button - Apply CSS to HTML5 button.
- * @csspart loader - Apply CSS to auro-loader.
- * @csspart text - Apply CSS to text slot.
- * @csspart icon - Apply CSS to icon slot.
- */
-
-/* eslint-disable lit/no-invalid-html, lit/binding-positions */
-
-class AuroButton extends i$2 {
-
-  /**
-   * Enables form association for this element.
-   * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals
-   * @returns {boolean} - Returns true to enable form association.
-   */
-  static get formAssociated() {
-    return true;
-  }
-
-  constructor() {
-    super();
-
-    this.autofocus = false;
-    this.disabled = false;
-    this.iconOnly = false;
-    this.loading = false;
-    this.onDark = false;
-    this.ready = false;
-    this.secondary = false;
-    this.tertiary = false;
-    this.rounded = false;
-    this.slim = false;
-    this.fluid = false;
-    this.loadingText = this.loadingText || 'Loading...';
-
-    // Support for HTML5 forms
-    if (typeof this.attachInternals === 'function') {
-      this.internals = this.attachInternals();
-    } else {
-      this.internals = null;
-
-      // eslint-disable-next-line no-console
-      console.warn('This browser does not support form association features. Some form-related functionality may not work as expected. Consider using a polyfill or handling click events manually.');
-    }
-
-    /**
-     * Generate unique names for dependency components.
-     */
-    const versioning = new AuroDependencyVersioning();
-
-    /**
-     * @private
-     */
-    this.loaderTag = versioning.generateTag('auro-loader', loaderVersion, AuroLoader);
-  }
-
-  static get styles() {
-    return [
-      tokensCss$1,
-      styleCss$1,
-      colorCss$1
-    ];
-  }
-
-  static get properties() {
-    return {
-      autofocus:        {
-        type: Boolean,
-        reflect: true
-      },
-      disabled:         {
-        type: Boolean,
-        reflect: true
-      },
-      secondary:         {
-        type: Boolean,
-        reflect: true
-      },
-      tertiary:         {
-        type: Boolean,
-        reflect: true
-      },
-      fluid:         {
-        type: Boolean,
-        reflect: true
-      },
-      iconOnly: {
-        type: Boolean,
-        reflect: true
-      },
-      loading:          {
-        type: Boolean,
-        reflect: true
-      },
-      loadingText:      {
-        type: String
-      },
-      onDark:           {
-        type: Boolean,
-        reflect: true
-      },
-      rounded: {
-        type: Boolean,
-        reflect: true
-      },
-      slim: {
-        type: Boolean,
-        reflect: true
-      },
-      arialabel:        {
-        type: String,
-        reflect: true
-      },
-      arialabelledby:   {
-        type: String,
-        reflect: true
-      },
-      ariaexpanded: {
-        type: Boolean,
-        reflect: true
-      },
-      title:            {
-        type: String,
-        reflect: true
-      },
-      type:             {
-        type: String,
-        reflect: true
-      },
-      value:            {
-        type: String,
-        reflect: true
-      },
-      variant:          {
-        type: String,
-        reflect: true
-      },
-      ready: { type: Boolean },
-    };
-  }
-
-  /**
-   * This will register this element with the browser.
-   * @param {string} [name="auro-button"] - The name of element that you want to register to.
-   *
-   * @example
-   * AuroButton.register("custom-button") // this will register this element to <custom-button/>
-   *
-   */
-  static register(name = "auro-button") {
-    AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroButton);
-  }
-
-  /**
-   * Internal method to apply focus to the HTML5 button.
-   * @private
-   * @returns {void}
-   */
-  focus() {
-    this.renderRoot.querySelector('button').focus();
-  }
-
-  /**
-   *  Marks the component as ready and sends event.
-   * @private
-   * @returns {void}
-   */
-  notifyReady() {
-    this.ready = true;
-
-    this.dispatchEvent(new CustomEvent('auroButton-ready', {
-      bubbles: true,
-      cancelable: false,
-      composed: true,
-    }));
-  }
-
-  updated() {
-    // support the old `secondary` and `tertiary` attributes` that are deprecated
-    if (this.secondary) {
-      this.setAttribute('variant', 'secondary');
-    }
-
-    if (this.tertiary) {
-      this.setAttribute('variant', 'tertiary');
-    }
-  }
-
-  firstUpdated() {
-    this.notifyReady();
-  }
-
-  /**
-   * Submits the form that this button is associated with.
-   * @private
-   * @returns {void}
-   */
-  surfaceSubmitEvent() {
-    if (this.form) {
-      this.form.requestSubmit();
-    }
-  }
-
-  /**
-   * Returns the form element that this button is associated with.
-   * @private
-   * @returns {HTMLFormElement | null}
-   */
-  get form() {
-    return this.internals ? this.internals.form : null;
-  }
-
-  render() {
-    const classes = {
-      'util_insetLg--squish': true,
-      'auro-button': true,
-      'auroButton': true,
-      'auro-button--rounded': this.rounded,
-      'auro-button--slim': this.slim,
-      'auro-button--iconOnly': this.iconOnly,
-      'auro-button--iconOnlySlim': this.iconOnly && this.slim,
-      'loading': this.loading
-    };
-
-    return u`
-      <button
-        part="button"
-        aria-label="${o(this.loading ? this.loadingText : this.arialabel || undefined)}"
-        aria-labelledby="${o(this.arialabelledby ? this.arialabelledby : undefined)}"
-        aria-expanded="${o(this.ariaexpanded)}"
-        ?autofocus="${this.autofocus}"
-        class="${e(classes)}"
-        ?disabled="${this.disabled || this.loading}"
-        ?onDark="${this.onDark}"
-        title="${o(this.title ? this.title : undefined)}"
-        name="${o(this.name ? this.name : undefined)}"
-        type="${o(this.type ? this.type : undefined)}"
-        variant="${o(this.variant ? this.variant : undefined)}"
-        .value="${o(this.value ? this.value : undefined)}"
-        @click="${this.type === 'submit' ? this.surfaceSubmitEvent : undefined}"
-      >
-        ${o(this.loading ? u`<${this.loaderTag} pulse part="loader"></${this.loaderTag}>` : undefined)}
-
-        <span class="contentWrapper">
-          <span class="textSlot" part="text">
-            ${this.iconOnly ? undefined : u`<slot></slot>`}
-          </span>
-
-          <span part="icon">
-            <slot name="icon"></slot>
-          </span>
-        </span>
-      </button>
-    `;
-  }
-}
-
-var buttonVersion = "9.3.3";
-
-// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-/**
- * @attr {Boolean} hidden - If present, the component will be hidden both visually and from screen readers
- * @attr {Boolean} hiddenVisually - If present, the component will be hidden visually, but still read by screen readers
- * @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
- */
-
-class AuroElement extends i$2 {
-
-  // function to define props used within the scope of this component
-  static get properties() {
-    return {
-      hidden:         { type: Boolean,
-                        reflect: true },
-      hiddenVisually: { type: Boolean,
-                        reflect: true },
-      hiddenAudible:  { type: Boolean,
-                        reflect: true },
-    };
-  }
-
-  /**
-   * @private Function that determines state of aria-hidden
-   */
-  hideAudible(value) {
-    if (value) {
-      return 'true'
-    }
-
-    return 'false'
-  }
-}
-
-var error = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"error__desc\" class=\"ico_squareLarge\" data-deprecated=\"true\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"error__desc\">Error alert indicator.</desc><path d=\"m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0m-1.165.87a.23.23 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084M12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5m-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583\"/></svg>"};
-
-/* eslint-disable no-underscore-dangle, jsdoc/no-undefined-types, jsdoc/require-param-description */
-
-const _fetchMap = new Map();
-
-/**
- * A callback to parse Response body.
- *
- * @callback ResponseParser
- * @param {Fetch.Response} response
- * @returns {Promise}
- */
-
-/**
- * A minimal in-memory map to de-duplicate Fetch API media requests.
- *
- * @param {String} uri
- * @param {Object} [options={}]
- * @param {ResponseParser} [options.responseParser=(response) => response.text()]
- * @returns {Promise}
- */
-const cacheFetch = (uri, options = {}) => {
-  const responseParser = options.responseParser || ((response) => response.text());
-  if (!_fetchMap.has(uri)) {
-    _fetchMap.set(uri, fetch(uri).then(responseParser));
-  }
-  return _fetchMap.get(uri);
-};
-
-// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
-/**
- * @slot - Hidden from visibility, used for a11y if icon description is needed
- */
-
-// build the component class
-class BaseIcon extends AuroElement {
-  constructor() {
-    super();
-    this.onDark = false;
-  }
-
-  // function to define props used within the scope of this component
-  static get properties() {
-    return {
-      ...super.properties,
-
-      /**
-       * Set value for on-dark version of auro-icon.
-       */
-      onDark: {
-        type: Boolean,
-        reflect: true
-      },
-
-      /**
-       * @private
-       */
-      svg: {
-        attribute: false,
-        reflect: true
-      }
-    };
-  }
-
-  static get styles() {
-    return i$3`
-      ${styleCss$2}
-    `;
-  }
-
-  /**
-   * Async function to fetch requested icon from npm CDN.
-   * @private
-   * @param {string} category - Icon category.
-   * @param {string} name - Icon name.
-   * @returns {SVGElement} DOM - Ready HTML to be appended.
-   */
-  async fetchIcon(category, name) {
-    let iconHTML = '';
-
-    if (category === 'logos') {
-      iconHTML = await cacheFetch(`${this.uri}/${category}/${name}.svg`);
-    } else {
-      iconHTML = await cacheFetch(`${this.uri}/icons/${category}/${name}.svg`);
-    }
-
-    const dom = new DOMParser().parseFromString(iconHTML, 'text/html');
-
-    return dom.body.querySelector('svg');
-  }
-
-  // lifecycle function
-  async firstUpdated() {
-    if (!this.customSvg) {
-      const svg = await this.fetchIcon(this.category, this.name);
-
-      if (svg) {
-        this.svg = svg;
-      } else if (!svg) {
-        const penDOM = new DOMParser().parseFromString(error.svg, 'text/html');
-
-        this.svg = penDOM.body.firstChild;
-      }
-    }
-  }
-}
-
-// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-class AuroIcon extends BaseIcon {
-  constructor() {
-    super();
-
-    this.variant = undefined;
-    this.privateDefaults();
-  }
-
-  /**
-   * Internal Defaults.
-   * @private
-   * @returns {void}
-   */
-  privateDefaults() {
-    this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
-    this.runtimeUtils = new AuroLibraryRuntimeUtils();
-  }
-
-  // function to define props used within the scope of this component
-  static get properties() {
-    return {
-      ...super.properties,
-
-      /**
-       * Set aria-hidden value. Default is `true`. Option is `false`.
-       */
-      ariaHidden: {
-        type: String,
-        reflect: true
-      },
-
-      /**
-       * The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
-       */
-      category: {
-        type: String,
-        reflect: true
-      },
-
-      /**
-       * Allows custom color to be set.
-       */
-      customColor: {
-        type: Boolean
-      },
-
-      /**
-       * When true, auro-icon will render a custom SVG inside the default slot.
-       */
-      customSvg: {
-        type: Boolean
-      },
-
-      /**
-       * Exposes content in slot as icon label.
-       */
-      label: {
-        type: Boolean,
-        reflect: true
-      },
-
-      /**
-       * The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
-       */
-      name: {
-        type: String,
-        reflect: true
-      },
-
-      /**
-       * The style of the icon. The accepted variants are `accent1`, `disabled`, `muted`, `statusDefault`, `statusInfo`, `statusSuccess`, `statusWarning`, `statusError`, `statusInfoSubtle`, `statusSuccessSubtle`, `statusWarningSubtle`, `statusErrorSubtle`, `fareBasicEconomy`, `fareBusiness`, `fareEconomy`, `fareFirst`, `farePremiumEconomy`, `tierOneWorldEmerald`, `tierOneWorldSapphire`, `tierOneWorldRuby`.
-       */
-      variant: {
-        type: String,
-        reflect: true
-      }
-    };
-  }
-
-  static get styles() {
-    return [
-      super.styles,
-      i$3`${tokensCss$2}`,
-      i$3`${styleCss$2}`,
-      i$3`${colorCss$2}`
-    ];
-  }
-
-  /**
-   * This will register this element with the browser.
-   * @param {string} [name="auro-icon"] - The name of element that you want to register to.
-   *
-   * @example
-   * AuroIcon.register("custom-icon") // this will register this element to <custom-icon/>
-   *
-   */
-  static register(name = "auro-icon") {
-    AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroIcon);
-  }
-
-  connectedCallback() {
-    super.connectedCallback();
-
-    // Add the tag name as an attribute if it is different than the component name
-    this.runtimeUtils.handleComponentTagRename(this, 'auro-icon');
-  }
-
-  /**
-   * @private
-   * @returns {void} Exposes CSS parts for styling from parent components.
-   */
-  exposeCssParts() {
-    this.setAttribute('exportparts', 'svg:iconSvg');
-  }
-
-  async firstUpdated() {
-    await super.firstUpdated();
-
-    // Removes the SVG description for screenreader if ariaHidden is set to true
-    if (!this.hasAttribute('ariaHidden') && this.svg) {
-      const svgDesc = this.svg.querySelector('desc');
-
-      if (svgDesc) {
-        svgDesc.remove();
-        this.svg.removeAttribute('aria-labelledby');
-      }
-    }
-  }
-
-  // function that renders the HTML and CSS into  the scope of the component
-  render() {
-    const labelClasses = {
-      'labelWrapper': true,
-      'util_displayHiddenVisually': !this.label
-    };
-
-    const svgClasses = {
-      'svgWrapper': true,
-    };
-
-    return x`
-      <div class="componentWrapper">
-        <div
-          class="${e(svgClasses)}"
-          title="${o(this.title || undefined)}">
-          <span aria-hidden="${o(this.ariaHidden || true)}" part="svg">
-            ${this.customSvg ? x`
-                <slot name="svg"></slot>
-              ` : x`
-                ${this.svg}
-              `
-            }
-          </span>
-        </div>
-
-        <div class="${e(labelClasses)}">
-          <slot></slot>
-        </div>
-      </div>
-    `;
-  }
-}
-
-var iconVersion = "8.0.2";
-
-var chevronLeft = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"chevron-left__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"chevron-left__desc\">Directional indicator; left.</desc><path d=\"m14.395 6.345.084.073a.75.75 0 0 1 .072.977l-.072.084-4.47 4.47 4.47 4.47a.75.75 0 0 1 .072.976l-.072.084a.75.75 0 0 1-.977.072l-.084-.072-4.823-4.823a1 1 0 0 1 0-1.415l4.823-4.823a.75.75 0 0 1 .977-.073\"/></svg>"};
-
-var chevronRight = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"chevron-right__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"chevron-right__desc\">Directional indicator; right.</desc><path d=\"m9.605 17.551-.084-.072a.75.75 0 0 1-.072-.977l.072-.084 4.47-4.47-4.47-4.47a.75.75 0 0 1-.072-.976l.072-.084a.75.75 0 0 1 .977-.073l.084.073 4.823 4.823a1 1 0 0 1 0 1.415l-4.823 4.823a.75.75 0 0 1-.977.072\"/></svg>"};
-
-var arrowDown = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"arrow-down__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"arrow-down__desc\">Directional pointer; down.</desc><path d=\"m11.47 19.78-5.25-5.25a.75.75 0 0 1 .976-1.133l.084.073 3.97 3.97V4.75a.75.75 0 0 1 .648-.743L12 4a.75.75 0 0 1 .743.648l.007.102v12.69l3.97-3.97a.75.75 0 0 1 .976-.073l.084.073a.75.75 0 0 1 .073.976l-.073.084-5.25 5.25a.75.75 0 0 1-.976.073zl-5.25-5.25z\"/></svg>"};
-
-var arrowUp = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"arrow-up__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"arrow-up__desc\">Directional pointer; up.</desc><path d=\"m12.53 4.22 5.25 5.25a.75.75 0 0 1-.976 1.133l-.084-.073-3.97-3.97v12.69a.75.75 0 0 1-.648.743L12 20a.75.75 0 0 1-.743-.648l-.007-.102V6.56l-3.97 3.97a.75.75 0 0 1-.976.073l-.084-.073a.75.75 0 0 1-.073-.976l.073-.084 5.25-5.25a.75.75 0 0 1 .976-.073zl5.25 5.25z\"/></svg>"};
-
-// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-
-class AuroSlideshow extends i$2 {
-  constructor() {
-    super();
-
-    this.autoplay = 7000;
-    this.pagination = false;
-    this.loop = false;
-    this.slidesPerView = "auto";
-    this.spaceBetweenSlides = 16;
-    this.variant = "slideshow";
-
-    const versioning = new AuroDependencyVersioning();
-
-    /**
-     * @private
-     */
-    this.isPlaying = true;
-
-    /**
-     * @private
-     */
-    this.buttonTag = versioning.generateTag(
-      "auro-button",
-      buttonVersion,
-      AuroButton,
-    );
-
-    /**
-     * @private
-     */
-    this.iconTag = versioning.generateTag("auro-icon", iconVersion, AuroIcon);
-  }
-
-  /**
-   * Registers the custom element with the browser.
-   * @param {string} [name="auro-slideshow"] - Custom element name to register.
-   * @example
-   * AuroSlideshow.register("custom-slideshow") // registers <custom-slideshow/>
-   */
-  static register(name = "auro-slideshow") {
-    AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroSlideshow);
-  }
-
-  static get styles() {
-    return [styleCss$3];
-  }
-
-  static get properties() {
-    return {
-      /**
-       * The time in milliseconds between each slide change. Defaults to undefined.
-       */
-      autoplay: {
-        type: Number,
-        reflect: true,
-      },
-
-      isPlaying: {
-        type: Boolean,
-      },
-
-      /**
-       * If true, the slideshow will loop back to the first slide after reaching the last slide. Defaults to false.
-       */
-      loop: {
-        type: Boolean,
-        reflect: true,
-      },
-
-      /**
-       * If true, the slideshow will display pagination bullets for each slide.
-       */
-      pagination: {
-        type: Boolean,
-        reflect: true,
-      },
-
-      /**
-       * The number of slides per view. Defaults to 1.
-       */
-      slidesPerView: {
-        type: String,
-        reflect: true,
-      },
-
-      /**
-       * The pixel distance between slides when multiple slides are in view.
-       */
-      spaceBetweenSlides: {
-        type: Number,
-      },
-
-      /**
-       * 'slideshow': pagination indicators will be showing underneat with auto-play the progressbar
-       * `slider`: prev/next button will show on hover and there will be no pagination indicator
-       * @default 'slidershow'
-       */
-      variant: {
-        // 'slideshow', 'slider'
-        type: String,
-        reflect: true,
-      },
-    };
-  }
-
-  firstUpdated() {
-    console.log("first updated");
-    this.handleHeaderSlotContent();
-
-    const slot = this.shadowRoot.querySelector(
-      'slot:not([name="header"]):not([name="subheader"])',
-    );
-
-    // Listen for the slotchange event to handle updates to slot content
-    this.slotChangeListener = () => {
-      this.initializeSwiper();
-    };
-
-    slot.addEventListener("slotchange", this.slotChangeListener);
-  }
-
-  handleHeaderSlotContent() {
-    const container = this.shadowRoot.querySelector(".container");
-    const headerSlot = this.shadowRoot.querySelector('slot[name="header"]');
-    const subheaderSlot = this.shadowRoot.querySelector(
-      'slot[name="subheader"]',
-    );
-
-    const hasHeaderContent =
-      headerSlot && headerSlot.assignedNodes().length > 0;
-    const hasSubheaderContent =
-      subheaderSlot && subheaderSlot.assignedNodes().length > 0;
-
-    if (hasHeaderContent && hasSubheaderContent) {
-      container.classList.add("has-both-headers");
-    } else if (hasHeaderContent) {
-      container.classList.add("has-header-only");
-    } else if (hasSubheaderContent) {
-      container.classList.add("has-subheader-only");
-    } else {
-      container.classList.add("has-no-headers");
-    }
-  }
-
-  initializeSwiper() {
-    const swiperElement = this.shadowRoot.querySelector(".swiper");
-    const swiperWrapper = this.shadowRoot.querySelector(".swiper-wrapper");
-    const prevButton = this.shadowRoot.querySelector(".scroll-prev");
-    const nextButton = this.shadowRoot.querySelector(".scroll-next");
-    const playPauseButton = this.shadowRoot.querySelector(".play-pause");
-    const paginationEl = this.shadowRoot.querySelector(".swiper-pagination");
-    const slot = this.shadowRoot.querySelector(
-      'slot:not([name="header"]):not([name="subheader"])',
-    );
-
-    if (!slot) {
-      return;
-    }
-
-    // Get the assigned slides from the slot
-    const assignedSlides = slot.assignedElements();
-
-    // Avoid reinitializing Swiper if there are no slides or if the Swiper is already initialized
-    if (assignedSlides.length === 0) {
-      console.warn("No slides found inside slot.");
-      return; // Avoid initializing if no slides are present
-    }
-
-    assignedSlides.forEach((slide) => {
-      slide.classList.add("swiper-slide");
-      slide.part = "slide";
-    });
-
-    // Detach the slotchange listener to prevent it from firing while manipulating the slot content
-    slot.removeEventListener("slotchange", this.slotChangeListener);
-
-    // Ensure we don't clear the swiper-wrapper content if the slides are updated dynamically
-    if (!this.swiper) {
-      // If no swiper instance exists, clear the swiper-wrapper and add the new slides
-      swiperWrapper.innerHTML = ""; // Clear the wrapper, only if needed
-      assignedSlides.forEach((slide) => {
-        swiperWrapper.appendChild(slide);
-      });
-    }
-
-    const swiperConfig = {
-      modules: [Navigation, Pagination, Autoplay],
-      loop: this.loop,
-      slidesPerView: this.slidesPerView,
-      spaceBetween: this.spaceBetweenSlides,
-      centeredSlides: false,
-      autoplay: this.autoplay
-        ? {
-            delay: this.autoplay,
-            disableOnInteraction: false,
-            pauseOnMouseEnter: true,
-          }
-        : false,
-      pagination: {
-        el: paginationEl,
-        clickable: true,
-        renderBullet: (_, className) => {
-          return `
-            <span class="${className}"  tabindex="0">
-              <div class="pagination-swiper-up__progress-bar-container">
-                <div class="pagination-swiper-up__progress"></div>
-              </div>
-            </span>
-          `;
-        },
-      },
-    };
-
-    if (this.variant === "slider") {
-      swiperConfig.navigation = {
-        nextEl: nextButton,
-        prevEl: prevButton,
-      };
-    }
-
-    if (this.autoplay) {
-      playPauseButton.addEventListener("click", () => {
-        if (this.swiper.autoplay.running) {
-          this.swiper.autoplay.stop();
-          this.isPlaying = false;
-          playPauseButton.setAttribute("aria-label", "play");
-        } else {
-          this.swiper.autoplay.start();
-          this.isPlaying = true;
-          playPauseButton.setAttribute("aria-label", "pause");
-        }
-      });
-    }
-
-    // If the Swiper instance exists, just update it with the new slides
-    if (this.swiper) {
-      this.swiper.update();
-    } else {
-      this.swiper = new Swiper(swiperElement, swiperConfig);
-    }
-
-    const allBullets = this.shadowRoot.querySelectorAll(
-      ".swiper-pagination-bullet",
-    );
-
-    allBullets.forEach((bullet) => {
-      bullet.addEventListener("keydown", (event) => {
-        if (event.key === "Enter" || event.key === " ") {
-          event.preventDefault(); // Prevent scrolling if space is used
-          bullet.click(); // Simulate a click event
-        }
-      });
-    });
-
-    // TODO: Add logic to the progress bar for pausing and playing the slideshow
-    this.swiper.on("slideChange", () => {
-      const activeBullet = this.shadowRoot.querySelector(
-        ".swiper-pagination-bullet-active",
-      );
-
-      // Reset all progress bars
-      allBullets.forEach((bullet) => {
-        const progressBar = bullet.querySelector(
-          ".pagination-swiper-up__progress",
-        );
-        if (progressBar) {
-          progressBar.style.transition = "none"; // Disable transition for reset
-          progressBar.style.width = "0%"; // Reset width for all bullets
-        }
-      });
-
-      // Animate the progress bar of the active bullet
-      if (activeBullet) {
-        const progressBar = activeBullet.querySelector(
-          ".pagination-swiper-up__progress",
-        );
-        if (progressBar) {
-          progressBar.style.transition = `width ${swiperConfig.autoplay.delay}ms linear`;
-          progressBar.style.width = "100%"; // Fill progress bar to 100%
-        }
-      }
-    });
-
-    // Reattach the slotchange event listener after the swiper is initialized
-    slot.addEventListener("slotchange", this.slotChangeListener);
-  }
-
-  /**
-   * Internal function to generate the HTML for the icon to use.
-   * @private
-   * @param {string} svgContent - The SVG content to be embedded.
-   * @param {boolean} hideIcon - Whether the icon should be hidden
-   * @returns {Element} The HTML element containing the SVG icon.
-   */
-  generateIconHtml(svgContent, hideIcon) {
-    const dom = new DOMParser().parseFromString(svgContent, "text/html");
-    const svg = dom.body.firstChild;
-
-    svg.setAttribute("slot", "svg");
-
-    const iconHtml = u`<${this.iconTag} customColor customSvg slot="icon" ?hidden="${hideIcon}">${svg}</${this.iconTag}>`;
-
-    return iconHtml;
-  }
-
-  render() {
-    return u`
-      <div class="container">
-        <slot name="header"></slot>
-        <slot name="subheader"></slot>
-        <div class="slideshow-wrapper">
-          <div class="swiper">
-            <div class="swiper-wrapper">
-              <slot></slot>
-            </div>
-          </div>
-
-            <${this.buttonTag}
-            class="chevron-left"
-            arialabel="Previous Item"
-            rounded
-            iconOnly
-            @click=${() => this.swiper.slidePrev()}>
-              ${this.generateIconHtml(chevronLeft.svg)}
-            </${this.buttonTag}>
-            <${this.buttonTag}
-            class="chevron-right"
-            arialabel="Next Item"
-            rounded
-            iconOnly
-            @click=${() => this.swiper.slideNext()}>
-              ${this.generateIconHtml(chevronRight.svg)}
-            </${this.buttonTag}>
-          
-        </div>
-  
-        <div class="pagination-container">
-          <${this.buttonTag} arialabel="play-pause" iconOnly rounded class="play-pause">
-            ${this.generateIconHtml(arrowUp.svg, !this.isPlaying)}
-            ${this.generateIconHtml(arrowDown.svg, this.isPlaying)}
-            <span class="util_displayHiddenVisually">Play/Pause</span>
-          </${this.buttonTag}>
-          <div class="swiper-pagination"></div>
-        </div>
-      </div>
-    `;
-  }
-}
+import { A as AuroSlideshow } from './auro-slideshow.min.js';
 
 AuroSlideshow.register();
 AuroSlideshow.register("custom-slideshow");