@asantemedia-org/leybold-design-system 1.0.11 → 1.0.12

package/dist/index.esm.scss

@@ -633,269 +633,6 @@
 .Button-module__button__icon--right___-pGHl {
   order: 1;
 }
-@import "slick-carousel/slick/slick.css";
-@import "slick-carousel/slick/slick-theme.css";
-:root {
-  --leybold-red: #e2001a;
-  --leybold-black: #000000;
-  --leybold-white: #ffffff;
-  --leybold-blue-grey: #546672;
-  --leybold-white-aluminium: #dae0e3;
-  --leybold-window-gray: #99a1ab;
-  --leybold-light-grey: #c5c7c4;
-  --leybold-slate-gray: #4a4e54;
-  --leybold-anthracite-gray: #383e42;
-  --leybold-orange: #d18e56;
-  --leybold-yellow: #edd163;
-  --leybold-green: #6ea67b;
-  --leybold-purple: #732d5d;
-  --leybold-purple-gray: #945e67;
-  --leybold-blue: #2b4679;
-  --leybold-light-blue: #3f6a98;
-  --leybold-blue-green: #39788e;
-  --leybold-green-gray: #6d8f9f;
-  --color-primary: #e2001a;
-  --color-secondary: #546672;
-  --color-success: #6ea67b;
-  --color-danger: #e2001a;
-  --color-warning: #d18e56;
-  --color-info: #3f6a98;
-  --text-primary: #000000;
-  --text-secondary: #4a4e54;
-  --text-muted: #99a1ab;
-  --text-inverse: #ffffff;
-  --bg-primary: #ffffff;
-  --bg-secondary: #dae0e3;
-  --bg-dark: #383e42;
-  --border-color: #c5c7c4;
-  --border-color-dark: #4a4e54;
-  --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
-  --h1-mobile-size: 32px;
-  --h1-mobile-line-height: 1.2;
-  --h2-mobile-size: 24px;
-  --h2-mobile-line-height: 1.2;
-  --h3-mobile-size: 18px;
-  --h3-mobile-line-height: 1.6;
-  --h4-mobile-size: 16px;
-  --h4-mobile-line-height: 1.55;
-  --h5-mobile-size: 14px;
-  --h5-mobile-line-height: 1.5;
-  --body-mobile-size: 14px;
-  --body-mobile-line-height: 1.5;
-  --h1-desktop-size: 55px;
-  --h1-desktop-line-height: 1.15;
-  --h1-desktop-letter-spacing: -0.02em;
-  --h2-desktop-size: 40px;
-  --h2-desktop-line-height: 1.2;
-  --h2-desktop-letter-spacing: -0.01em;
-  --h3-desktop-size: 32px;
-  --h3-desktop-line-height: 1.2;
-  --h4-desktop-size: 24px;
-  --h4-desktop-line-height: 1.2;
-  --h5-desktop-size: 18px;
-  --h5-desktop-line-height: 1.6;
-  --body-desktop-size: 18px;
-  --body-desktop-line-height: 1.6;
-  --text-lg-size: 27px;
-  --text-lg-line-height: 1.4;
-  --text-xl-size: 36px;
-  --text-xl-line-height: 1.4;
-  --text-xxl-size: 64px;
-  --text-xxl-line-height: 1;
-}
-
-.Carousel-module__carousel___hkXkF {
-  width: 100%;
-  background-color: #ffffff;
-  padding: 48px 24px;
-}
-@media (min-width: 768px) {
-  .Carousel-module__carousel___hkXkF {
-    padding: 86px 178px 56px;
-  }
-}
-
-.Carousel-module__carousel__header___IMcN5 {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  margin-bottom: 24px;
-}
-@media (min-width: 768px) {
-  .Carousel-module__carousel__header___IMcN5 {
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: flex-start;
-    margin-bottom: 42px;
-  }
-}
-
-.Carousel-module__carousel__headerContent___9uU-H {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  max-width: 714px;
-}
-
-.Carousel-module__carousel__title___CCgcY {
-  font-family: var(--font-family-base);
-  font-weight: 700;
-  font-size: var(--h3-desktop-size);
-  line-height: 1.2;
-  color: #4a4e54;
-  margin: 0;
-}
-
-.Carousel-module__carousel__subtitle___aj4q1 {
-  font-family: var(--font-family-base);
-  font-weight: 400;
-  font-size: var(--body-desktop-size);
-  line-height: 1.6;
-  color: #4a4e54;
-  margin: 0;
-}
-
-.Carousel-module__carousel__slider___b27-P {
-  margin-bottom: 42px;
-}
-.Carousel-module__carousel__slider___b27-P .slick-list {
-  margin: 0 -10px;
-}
-.Carousel-module__carousel__slider___b27-P .slick-track {
-  display: flex;
-}
-.Carousel-module__carousel__slider___b27-P .slick-slide {
-  padding: 8px 10px;
-  flex-shrink: 0;
-}
-.Carousel-module__carousel__slider___b27-P .slick-slide > div {
-  height: 100%;
-}
-.Carousel-module__carousel__slider___b27-P .slick-slide.slick-cloned a, .Carousel-module__carousel__slider___b27-P .slick-slide.slick-cloned button {
-  visibility: hidden;
-}
-
-.Carousel-module__carousel__slideWrapper___PjXgD {
-  height: 100%;
-}
-
-.Carousel-module__carousel__card___lga-D {
-  display: block;
-  position: relative;
-  text-decoration: none;
-  height: 341px;
-  overflow: visible;
-}
-@media (min-width: 768px) {
-  .Carousel-module__carousel__card___lga-D {
-    height: 297px;
-  }
-}
-.Carousel-module__carousel__card___lga-D:focus-visible {
-  outline: 2px solid #000000;
-  outline-offset: 2px;
-}
-.Carousel-module__carousel__card___lga-D:hover .Carousel-module__carousel__cardContent___v0jc- {
-  box-shadow: 3px 6px 12px -3px rgba(0, 0, 0, 0.4);
-}
-.Carousel-module__carousel__card___lga-D:hover .Carousel-module__carousel__cardLink___PpTAC {
-  text-decoration: underline;
-}
-
-.Carousel-module__carousel__cardImageWrapper___aFqXD {
-  position: relative;
-  width: 100%;
-  height: 245px;
-  overflow: hidden;
-}
-@media (min-width: 768px) {
-  .Carousel-module__carousel__cardImageWrapper___aFqXD {
-    height: 216px;
-  }
-}
-
-.Carousel-module__carousel__cardImage___4MrRU {
-  width: 100%;
-  height: 100%;
-  -o-object-fit: cover;
-     object-fit: cover;
-  -o-object-position: center;
-     object-position: center;
-}
-
-.Carousel-module__carousel__cardContent___v0jc- {
-  position: absolute;
-  left: 20px;
-  bottom: 0;
-  width: calc(100% - 40px);
-  max-width: 300px;
-  background-color: #ffffff;
-  padding: 24px;
-  box-shadow: 3px 6px 8px -5px rgba(0, 0, 0, 0.3);
-  transition: box-shadow 0.2s ease-in-out;
-}
-@media (min-width: 768px) {
-  .Carousel-module__carousel__cardContent___v0jc- {
-    padding-left: 20px;
-    border-left: 4px solid #4a4e54;
-    max-width: 382px;
-  }
-}
-
-.Carousel-module__carousel__cardTitle___z-mMo {
-  font-family: var(--font-family-base);
-  font-weight: 700;
-  font-size: var(--h5-desktop-size);
-  line-height: 1.6;
-  color: #4a4e54;
-  margin: 0 0 8px;
-}
-
-.Carousel-module__carousel__navigation___dMbcP {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-}
-@media (min-width: 768px) {
-  .Carousel-module__carousel__navigation___dMbcP {
-    justify-content: space-between;
-  }
-}
-
-.Carousel-module__carousel__arrows___uj5nF {
-  display: flex;
-  align-items: center;
-  gap: 20px;
-}
-
-.Carousel-module__carousel__dotsList___upZ7L {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.Carousel-module__carousel__dot___HwZc0 {
-  width: 10px;
-  height: 10px;
-  padding: 0;
-  background-color: #dae0e3;
-  border: none;
-  cursor: pointer;
-  transition: background-color 0.2s ease-in-out;
-}
-.Carousel-module__carousel__dot___HwZc0:hover {
-  background-color: rgb(188.9692307692, 199.6769230769, 205.0307692308);
-}
-.Carousel-module__carousel__dot___HwZc0:focus-visible {
-  outline: 2px solid #000000;
-  outline-offset: 2px;
-}
-.Carousel-module__carousel__dot--active___NxRvq {
-  background-color: #e2001a;
-}
-.Carousel-module__carousel__dot--active___NxRvq:hover {
-  background-color: #e2001a;
-}
 :root {
   --leybold-red: #e2001a;
   --leybold-black: #000000;

package/dist/index.js

@@ -3,7 +3,6 @@
 var React = require('react');
 var reactFontawesome = require('@fortawesome/react-fontawesome');
 var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
-var Slider = require('react-slick');
 var freeBrandsSvgIcons = require('@fortawesome/free-brands-svg-icons');
 var edwardsvacuumDesignSystem = require('@asantemedia-org/edwardsvacuum-design-system');
 
@@ -17,7 +16,7 @@ function _extends() {
   }, _extends.apply(null, arguments);
 }
 
-var styles$h = {"button":"Button-module__button___18Bed","button--primary":"Button-module__button--primary___VuF-P","button--default":"Button-module__button--default___MDa35","button--disabled":"Button-module__button--disabled___IuOY8","button--secondary":"Button-module__button--secondary___lD5E3","button--solid-red":"Button-module__button--solid-red___YPpnL","button--solid-grey":"Button-module__button--solid-grey___oRbEy","button--solid-black":"Button-module__button--solid-black___1Ma5K","button--solid-white":"Button-module__button--solid-white___bE-Z0","button--outlined-red":"Button-module__button--outlined-red___cgZXa","button--outlined-grey":"Button-module__button--outlined-grey___xWGbB","button--outlined-black":"Button-module__button--outlined-black___qfX5o","button--outlined-white":"Button-module__button--outlined-white___QLXNP","button--link-text":"Button-module__button--link-text___R2kun","button__icon":"Button-module__button__icon___hlcHo","button--link-text-alt":"Button-module__button--link-text-alt___1p7wH","button--external-link":"Button-module__button--external-link___Mhxuk","button--carousel-arrow-left":"Button-module__button--carousel-arrow-left___Wx-Jo","button--carousel-arrow-right":"Button-module__button--carousel-arrow-right___3ZtgT","button__icon__default":"Button-module__button__icon__default___0qlF1","button__icon__hover":"Button-module__button__icon__hover___3xPGT","button--extra-small":"Button-module__button--extra-small___R0QTM","button--small":"Button-module__button--small___ADJQe","button--medium":"Button-module__button--medium___ZuR4Z","button--large":"Button-module__button--large___-FaV5","button__icon--left":"Button-module__button__icon--left___wMCeH","button__icon--right":"Button-module__button__icon--right___-pGHl"};
+var styles$g = {"button":"Button-module__button___18Bed","button--primary":"Button-module__button--primary___VuF-P","button--default":"Button-module__button--default___MDa35","button--disabled":"Button-module__button--disabled___IuOY8","button--secondary":"Button-module__button--secondary___lD5E3","button--solid-red":"Button-module__button--solid-red___YPpnL","button--solid-grey":"Button-module__button--solid-grey___oRbEy","button--solid-black":"Button-module__button--solid-black___1Ma5K","button--solid-white":"Button-module__button--solid-white___bE-Z0","button--outlined-red":"Button-module__button--outlined-red___cgZXa","button--outlined-grey":"Button-module__button--outlined-grey___xWGbB","button--outlined-black":"Button-module__button--outlined-black___qfX5o","button--outlined-white":"Button-module__button--outlined-white___QLXNP","button--link-text":"Button-module__button--link-text___R2kun","button__icon":"Button-module__button__icon___hlcHo","button--link-text-alt":"Button-module__button--link-text-alt___1p7wH","button--external-link":"Button-module__button--external-link___Mhxuk","button--carousel-arrow-left":"Button-module__button--carousel-arrow-left___Wx-Jo","button--carousel-arrow-right":"Button-module__button--carousel-arrow-right___3ZtgT","button__icon__default":"Button-module__button__icon__default___0qlF1","button__icon__hover":"Button-module__button__icon__hover___3xPGT","button--extra-small":"Button-module__button--extra-small___R0QTM","button--small":"Button-module__button--small___ADJQe","button--medium":"Button-module__button--medium___ZuR4Z","button--large":"Button-module__button--large___-FaV5","button__icon--left":"Button-module__button__icon--left___wMCeH","button__icon--right":"Button-module__button__icon--right___-pGHl"};
 
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -195,10 +194,10 @@ const Button = ({
   const isIconOnly = variant === "carousel-arrow-left" || variant === "carousel-arrow-right";
   const isCarouselLeft = variant === "carousel-arrow-left";
   const isCarouselRight = variant === "carousel-arrow-right";
-  const buttonClasses = classNames(styles$h.button, styles$h[`button--${cssVariant}`], styles$h[`button--${size}`], {
-    [styles$h["button--disabled"]]: disabled
+  const buttonClasses = classNames(styles$g.button, styles$g[`button--${cssVariant}`], styles$g[`button--${size}`], {
+    [styles$g["button--disabled"]]: disabled
   }, className);
-  const iconClasses = classNames(styles$h.button__icon, styles$h[`button__icon--${iconPosition}`]);
+  const iconClasses = classNames(styles$g.button__icon, styles$g[`button__icon--${iconPosition}`]);
 
   // Generate accessible label for icon-only buttons
   const accessibleLabel = ariaLabel || (isIconOnly ? variant === "carousel-arrow-left" ? "Previous" : "Next" : undefined);
@@ -213,132 +212,23 @@ const Button = ({
     className: iconClasses
   }, /*#__PURE__*/React.createElement(reactFontawesome.FontAwesomeIcon, {
     icon: freeSolidSvgIcons.faArrowLeft,
-    className: styles$h.button__icon__default
+    className: styles$g.button__icon__default
   }), /*#__PURE__*/React.createElement(reactFontawesome.FontAwesomeIcon, {
     icon: freeSolidSvgIcons.faArrowLeftLong,
-    className: styles$h.button__icon__hover
+    className: styles$g.button__icon__hover
   })), isCarouselRight && /*#__PURE__*/React.createElement("span", {
     className: iconClasses
   }, /*#__PURE__*/React.createElement(reactFontawesome.FontAwesomeIcon, {
     icon: freeSolidSvgIcons.faArrowRight,
-    className: styles$h.button__icon__default
+    className: styles$g.button__icon__default
   }), /*#__PURE__*/React.createElement(reactFontawesome.FontAwesomeIcon, {
     icon: freeSolidSvgIcons.faArrowRightLong,
-    className: styles$h.button__icon__hover
+    className: styles$g.button__icon__hover
   })), !isIconOnly && iconElement && /*#__PURE__*/React.createElement("span", {
     className: iconClasses
   }, iconElement));
 };
 
-var styles$g = {"carousel":"Carousel-module__carousel___hkXkF","carousel__header":"Carousel-module__carousel__header___IMcN5","carousel__headerContent":"Carousel-module__carousel__headerContent___9uU-H","carousel__title":"Carousel-module__carousel__title___CCgcY","carousel__subtitle":"Carousel-module__carousel__subtitle___aj4q1","carousel__slider":"Carousel-module__carousel__slider___b27-P","carousel__slideWrapper":"Carousel-module__carousel__slideWrapper___PjXgD","carousel__card":"Carousel-module__carousel__card___lga-D","carousel__cardContent":"Carousel-module__carousel__cardContent___v0jc-","carousel__cardImageWrapper":"Carousel-module__carousel__cardImageWrapper___aFqXD","carousel__cardImage":"Carousel-module__carousel__cardImage___4MrRU","carousel__cardTitle":"Carousel-module__carousel__cardTitle___z-mMo","carousel__navigation":"Carousel-module__carousel__navigation___dMbcP","carousel__arrows":"Carousel-module__carousel__arrows___uj5nF","carousel__dotsList":"Carousel-module__carousel__dotsList___upZ7L","carousel__dot":"Carousel-module__carousel__dot___HwZc0","carousel__dot--active":"Carousel-module__carousel__dot--active___NxRvq"};
-
-/**
- * Carousel component for displaying multiple content cards in a sliding format.
- * Supports responsive layouts with 3 cards on desktop and 1 card on mobile.
- */
-const Carousel = ({
-  title,
-  subtitle,
-  buttonText,
-  buttonUrl,
-  cards,
-  showDots = true,
-  showArrows = true,
-  className
-}) => {
-  const sliderRef = React.useRef(null);
-  const [currentSlide, setCurrentSlide] = React.useState(0);
-
-  // Uses document.documentElement.clientWidth to work correctly in iframes (Storybook)
-  const [isMobile, setIsMobile] = React.useState(() => {
-    if (typeof window !== 'undefined') {
-      return document.documentElement.clientWidth < 768;
-    }
-    return false;
-  });
-  React.useEffect(() => {
-    const handleResize = () => {
-      setIsMobile(document.documentElement.clientWidth < 768);
-    };
-    window.addEventListener('resize', handleResize);
-    return () => window.removeEventListener('resize', handleResize);
-  }, []);
-  const handlePrev = () => sliderRef.current?.slickPrev();
-  const handleNext = () => sliderRef.current?.slickNext();
-  const goToSlide = index => sliderRef.current?.slickGoTo(index);
-  const settings = {
-    dots: false,
-    infinite: true,
-    speed: 500,
-    slidesToShow: isMobile ? 1 : 3,
-    slidesToScroll: 1,
-    arrows: false,
-    beforeChange: (_, next) => setCurrentSlide(next)
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames(styles$g.carousel, className)
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__header
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__headerContent
-  }, /*#__PURE__*/React.createElement("h2", {
-    className: styles$g.carousel__title
-  }, title), subtitle && /*#__PURE__*/React.createElement("p", {
-    className: styles$g.carousel__subtitle
-  }, subtitle)), buttonText && buttonUrl && /*#__PURE__*/React.createElement(Button, {
-    variant: "outlined-black",
-    onClick: () => window.location.href = buttonUrl,
-    style: {
-      minWidth: '215px',
-      minHeight: '56px'
-    }
-  }, buttonText)), /*#__PURE__*/React.createElement(Slider, _extends({
-    ref: sliderRef
-  }, settings, {
-    className: styles$g.carousel__slider
-  }), cards.map((card, index) => /*#__PURE__*/React.createElement("div", {
-    key: index,
-    className: styles$g.carousel__slideWrapper
-  }, /*#__PURE__*/React.createElement("a", {
-    href: card.linkUrl,
-    className: styles$g.carousel__card,
-    "aria-label": `${card.title} - ${card.linkText}`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__cardImageWrapper
-  }, /*#__PURE__*/React.createElement("img", {
-    src: card.imageUrl,
-    alt: card.imageAlt,
-    className: styles$g.carousel__cardImage
-  })), /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__cardContent
-  }, /*#__PURE__*/React.createElement("h3", {
-    className: styles$g.carousel__cardTitle
-  }, card.title), /*#__PURE__*/React.createElement(Button, {
-    variant: "link-text-alt",
-    icon: "arrow-right"
-  }, card.linkText)))))), /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__navigation
-  }, !isMobile && showDots && /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__dotsList
-  }, cards.map((_, index) => /*#__PURE__*/React.createElement("button", {
-    key: index,
-    type: "button",
-    className: classNames(styles$g.carousel__dot, currentSlide === index && styles$g['carousel__dot--active']),
-    onClick: () => goToSlide(index),
-    "aria-label": `Go to slide ${index + 1}`
-  }))), showArrows && /*#__PURE__*/React.createElement("div", {
-    className: styles$g.carousel__arrows
-  }, /*#__PURE__*/React.createElement(Button, {
-    variant: "carousel-arrow-left",
-    onClick: handlePrev,
-    ariaLabel: "Previous"
-  }), /*#__PURE__*/React.createElement(Button, {
-    variant: "carousel-arrow-right",
-    onClick: handleNext,
-    ariaLabel: "Next"
-  }))));
-};
-
 var styles$f = {"footer":"Footer-module__footer___Oavyx","footer--mobile":"Footer-module__footer--mobile___9HQC-","footer__container":"Footer-module__footer__container___ohvnm","footer__links":"Footer-module__footer__links___DdVK8","footer__linkGroup":"Footer-module__footer__linkGroup___1B7JA","footer__linkList":"Footer-module__footer__linkList___j-DWF","footer__linkHeading":"Footer-module__footer__linkHeading___LtE6X","footer__link":"Footer-module__footer__link___G5HPW","footer__cta":"Footer-module__footer__cta___MRJLr","footer__socialIcons":"Footer-module__footer__socialIcons___j0aRp","footer__socialIcon":"Footer-module__footer__socialIcon___1uVTm","footer__countrySelector":"Footer-module__footer__countrySelector___pVtN5","footer__bottom":"Footer-module__footer__bottom___77bPL","footer__bottomLeft":"Footer-module__footer__bottomLeft___tlst1","footer__bottomLinks":"Footer-module__footer__bottomLinks___s22h7","footer__bottomLink":"Footer-module__footer__bottomLink___SLzwY","footer__copyright":"Footer-module__footer__copyright___4bZOF","footer__brandSection":"Footer-module__footer__brandSection___BBr5f","footer__logo":"Footer-module__footer__logo___mv-9M","footer__leftCol":"Footer-module__footer__leftCol___vmKNN","footer__motto":"Footer-module__footer__motto___QtB2m","footer__main":"Footer-module__footer__main___NSU9d","footer__badge":"Footer-module__footer__badge___faejb","footer__badgeIcon":"Footer-module__footer__badgeIcon___xJ519","footer__badgeText":"Footer-module__footer__badgeText___imXgG","footer__linkText":"Footer-module__footer__linkText___Gc18Z","footer__linkIcon":"Footer-module__footer__linkIcon___IZzJM","footer__countrySelectorIcon":"Footer-module__footer__countrySelectorIcon___hhEd4"};
 
 /**
@@ -2333,7 +2223,6 @@ exports.AlgoliaDynamicSearchLeybold = AlgoliaDynamicSearchLeybold;
 exports.AppliedFilterTag = AppliedFilterTag;
 exports.AppliedFilters = AppliedFilters;
 exports.Button = Button;
-exports.Carousel = Carousel;
 exports.ContentCardHorizontal = ContentCardHorizontal;
 exports.FederatedInstantResultsLayout = FederatedInstantResultsLayout;
 exports.FederatedResultsView = FederatedResultsView;