@asantemedia-org/edwardsvacuum-design-system 1.6.12 → 1.6.13

package/dist/index.css

@@ -124,6 +124,7 @@
   left: 0;
   animation: algolia-dynamic-search-module__loading___Hb3Uw 1s infinite;
 }
+@charset "UTF-8";
 .card-module__cmp-card___45x9k img {
   transition: all 0.3s ease-in-out;
 }
@@ -443,6 +444,36 @@
 .card-module__cmp-card--type-careers___Wqzcf.card-module__cmp-card--type-card-panel___95jYv .card-module__cmp-card__title-wrapper___XHfZg .card-module__cmp-card__city-country___dI13- {
   margin-top: auto;
 }
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ {
+  position: relative;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ.card-module__open___JQrDU h4 svg {
+  transform: rotateX(180deg);
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ.card-module__open___JQrDU ul {
+  height: auto;
+  top: -100%;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ h4 {
+  cursor: pointer;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ h4 svg {
+  font-weight: 900;
+  color: rgb(196, 38, 46);
+  transition: 300ms;
+  transform-origin: 50% 50%;
+  content: "⌵";
+  position: absolute;
+  right: 0;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ ul {
+  overflow: hidden;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ ul li {
+  position: relative;
+  transition: 300ms;
+  top: 0;
+}
 
 @keyframes card-module__rotate___NxhZk {
   0% {

package/dist/index.esm.css

@@ -124,6 +124,7 @@
   left: 0;
   animation: algolia-dynamic-search-module__loading___Hb3Uw 1s infinite;
 }
+@charset "UTF-8";
 .card-module__cmp-card___45x9k img {
   transition: all 0.3s ease-in-out;
 }
@@ -443,6 +444,36 @@
 .card-module__cmp-card--type-careers___Wqzcf.card-module__cmp-card--type-card-panel___95jYv .card-module__cmp-card__title-wrapper___XHfZg .card-module__cmp-card__city-country___dI13- {
   margin-top: auto;
 }
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ {
+  position: relative;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ.card-module__open___JQrDU h4 svg {
+  transform: rotateX(180deg);
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ.card-module__open___JQrDU ul {
+  height: auto;
+  top: -100%;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ h4 {
+  cursor: pointer;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ h4 svg {
+  font-weight: 900;
+  color: rgb(196, 38, 46);
+  transition: 300ms;
+  transform-origin: 50% 50%;
+  content: "⌵";
+  position: absolute;
+  right: 0;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ ul {
+  overflow: hidden;
+}
+.card-module__cmp-card--type-product_details___vsNOc .card-module__folding-specification-holder___OtcQQ ul li {
+  position: relative;
+  transition: 300ms;
+  top: 0;
+}
 
 @keyframes card-module__rotate___NxhZk {
   0% {

package/dist/index.esm.js

@@ -1,6 +1,6 @@
-import React, { useState, useEffect } from 'react';
+import React, { useRef, useState, useEffect } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faChevronRight, faArrowRight } from '@fortawesome/pro-solid-svg-icons';
+import { faChevronRight, faArrowRight, faChevronDown } from '@fortawesome/pro-solid-svg-icons';
 import { v4 } from 'uuid';
 
 /******************************************************************************
@@ -155,7 +155,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
 
 var styles$2 = {"cmpAlgoliaDynamicSearchWidget":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget___WY9hc","isLoading":"algolia-dynamic-search-module__isLoading___X6nUw","cmpAlgoliaDynamicSearchWidget__placeholder":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget__placeholder___IWqoU","cmpAlgoliaDynamicSearchWidget__container":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget__container___HB7g0","cmpAlgoliaDynamicSearchWidget__header":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget__header___vxNjS","cmpAlgoliaDynamicSearchWidget__header__text":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget__header__text___23-nk","cmpAlgoliaDynamicSearchWidget__cards":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget__cards___wOPVj","isQueryContent":"algolia-dynamic-search-module__isQueryContent___KXy6j","hasStyleSilverGradientBackground":"algolia-dynamic-search-module__hasStyleSilverGradientBackground___D3SQQ","hasStyleGreyBackground":"algolia-dynamic-search-module__hasStyleGreyBackground___SuPIH","cmpAlgoliaDynamicSearchWidget__placeholder__loading":"algolia-dynamic-search-module__cmpAlgoliaDynamicSearchWidget__placeholder__loading___hbH4m","loading":"algolia-dynamic-search-module__loading___Hb3Uw"};
 
-var styles$1 = {"cmp-card":"card-module__cmp-card___45x9k","cmp-card__link":"card-module__cmp-card__link___OdszC","cmp-card__content-wrapper":"card-module__cmp-card__content-wrapper___gh335","cmp-card__content-category-wrapper":"card-module__cmp-card__content-category-wrapper___2vOjQ","cmp-card__content-category-wrapper__colour-edwards-red":"card-module__cmp-card__content-category-wrapper__colour-edwards-red___DYmt8","cmp-card__city-country":"card-module__cmp-card__city-country___dI13-","cmp-card__image-wrapper":"card-module__cmp-card__image-wrapper___IhPHw","placeholderImage":"card-module__placeholderImage___AXOh5","cmp-card--type-card-overlay":"card-module__cmp-card--type-card-overlay___344ul","cmp-card__title-wrapper":"card-module__cmp-card__title-wrapper___XHfZg","cmp-card__date":"card-module__cmp-card__date___7w-Ka","cmp-card__title":"card-module__cmp-card__title___cFKG8","cmp-card__footer":"card-module__cmp-card__footer___xcNXM","cmp-card--type-card-no-image":"card-module__cmp-card--type-card-no-image___G75ye","cmp-card--type-card-product":"card-module__cmp-card--type-card-product___IfqTr","cmp-card--type-card-product__wrapper":"card-module__cmp-card--type-card-product__wrapper___kulaR","cmp-card--type-card-product__image":"card-module__cmp-card--type-card-product__image___Bkb0A","cmp-card--type-card-product__meta":"card-module__cmp-card--type-card-product__meta___a7Tzc","cmp-card--type-card-product__title":"card-module__cmp-card--type-card-product__title___0JMQp","cmp-card--type-card-product__cta":"card-module__cmp-card--type-card-product__cta___qDSNo","cmp-card--type-card-product__prices":"card-module__cmp-card--type-card-product__prices___KWPS7","cmp-card--type-card-product__prices--login":"card-module__cmp-card--type-card-product__prices--login___gMhTo","show_prices":"card-module__show_prices___gjVhn","cmp-card--type-card-panel":"card-module__cmp-card--type-card-panel___95jYv","cmp-card__footer--color-malachite":"card-module__cmp-card__footer--color-malachite___jEnvy","cmp-card__footer--color-amethyst":"card-module__cmp-card__footer--color-amethyst___N55PL","cmp-card__footer--color-smokey-quartz-bright":"card-module__cmp-card__footer--color-smokey-quartz-bright___1mqyn","cmp-card__footer--color-olivine-bright":"card-module__cmp-card__footer--color-olivine-bright___O2urI","cmp-card--type-careers":"card-module__cmp-card--type-careers___Wqzcf","rotate":"card-module__rotate___NxhZk","rotate-inverse":"card-module__rotate-inverse___JbaES"};
+var styles$1 = {"cmp-card":"card-module__cmp-card___45x9k","cmp-card__link":"card-module__cmp-card__link___OdszC","cmp-card__content-wrapper":"card-module__cmp-card__content-wrapper___gh335","cmp-card__content-category-wrapper":"card-module__cmp-card__content-category-wrapper___2vOjQ","cmp-card__content-category-wrapper__colour-edwards-red":"card-module__cmp-card__content-category-wrapper__colour-edwards-red___DYmt8","cmp-card__city-country":"card-module__cmp-card__city-country___dI13-","cmp-card__image-wrapper":"card-module__cmp-card__image-wrapper___IhPHw","placeholderImage":"card-module__placeholderImage___AXOh5","cmp-card--type-card-overlay":"card-module__cmp-card--type-card-overlay___344ul","cmp-card__title-wrapper":"card-module__cmp-card__title-wrapper___XHfZg","cmp-card__date":"card-module__cmp-card__date___7w-Ka","cmp-card__title":"card-module__cmp-card__title___cFKG8","cmp-card__footer":"card-module__cmp-card__footer___xcNXM","cmp-card--type-card-no-image":"card-module__cmp-card--type-card-no-image___G75ye","cmp-card--type-card-product":"card-module__cmp-card--type-card-product___IfqTr","cmp-card--type-card-product__wrapper":"card-module__cmp-card--type-card-product__wrapper___kulaR","cmp-card--type-card-product__image":"card-module__cmp-card--type-card-product__image___Bkb0A","cmp-card--type-card-product__meta":"card-module__cmp-card--type-card-product__meta___a7Tzc","cmp-card--type-card-product__title":"card-module__cmp-card--type-card-product__title___0JMQp","cmp-card--type-card-product__cta":"card-module__cmp-card--type-card-product__cta___qDSNo","cmp-card--type-card-product__prices":"card-module__cmp-card--type-card-product__prices___KWPS7","cmp-card--type-card-product__prices--login":"card-module__cmp-card--type-card-product__prices--login___gMhTo","show_prices":"card-module__show_prices___gjVhn","cmp-card--type-card-panel":"card-module__cmp-card--type-card-panel___95jYv","cmp-card__footer--color-malachite":"card-module__cmp-card__footer--color-malachite___jEnvy","cmp-card__footer--color-amethyst":"card-module__cmp-card__footer--color-amethyst___N55PL","cmp-card__footer--color-smokey-quartz-bright":"card-module__cmp-card__footer--color-smokey-quartz-bright___1mqyn","cmp-card__footer--color-olivine-bright":"card-module__cmp-card__footer--color-olivine-bright___O2urI","cmp-card--type-careers":"card-module__cmp-card--type-careers___Wqzcf","cmp-card--type-product_details":"card-module__cmp-card--type-product_details___vsNOc","folding-specification-holder":"card-module__folding-specification-holder___OtcQQ","open":"card-module__open___JQrDU","rotate":"card-module__rotate___NxhZk","rotate-inverse":"card-module__rotate-inverse___JbaES"};
 
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -369,6 +369,42 @@ var ProductCard = function (_a) {
     icon: faArrowRight
   }))))));
 };
+var ProductDetailsCard = function (_a) {
+  var className = _a.className,
+    title = _a.title;
+    _a.imageUrl;
+    var imageAlt = _a.imageAlt;
+    _a.placeholder;
+    _a.onClick;
+    var hit = _a.hit,
+    facets = _a.facets;
+  var specificationRef = useRef();
+  var handleClick = function () {
+    var _a;
+    (_a = specificationRef.current) === null || _a === void 0 ? void 0 : _a.classList.toggle("open");
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, /*#__PURE__*/React.createElement("h3", null, title), /*#__PURE__*/React.createElement("p", null, "Product:", hit.code), /*#__PURE__*/React.createElement("img", {
+    src: hit["img-product"],
+    alt: imageAlt
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "folding-specification-holder",
+    onClick: handleClick,
+    ref: specificationRef
+  }, /*#__PURE__*/React.createElement("h4", null, "Specifications ", /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faChevronDown,
+    color: "#C4262EFF"
+  })), /*#__PURE__*/React.createElement("ul", null, facets && facets.map(function (facet) {
+    return hit[facet.name] && /*#__PURE__*/React.createElement("li", {
+      key: facet.name
+    }, /*#__PURE__*/React.createElement("strong", null, facet.label), /*#__PURE__*/React.createElement("br", null), facet.returnsHTML ? /*#__PURE__*/React.createElement("span", {
+      dangerouslySetInnerHTML: {
+        __html: hit[facet.name]
+      }
+    }) : hit[facet.name]);
+  }))));
+};
 
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function (n) {
@@ -433,6 +469,7 @@ var Button = function (_a) {
 var cleanClassNames = function (className, prefixToRemove) {
   return className.startsWith(prefixToRemove) ? className.replace("".concat(prefixToRemove, "__"), "") : className;
 };
+var PRODUCT_DETAILS = 'productDetails';
 var DynamicHeading = function (_a) {
   var _b = _a.titleSize,
     titleSize = _b === void 0 ? "h2" : _b,
@@ -484,7 +521,8 @@ var AlgoliaDynamicSearch = function (_a) {
     _f = _a.isLoading,
     isLoading = _f === void 0 ? false : _f,
     placeholder = _a.placeholder,
-    analytics = _a.analytics;
+    analytics = _a.analytics,
+    facets = _a.facets;
   var _g = useState(isLoading),
     isLoadingState = _g[0],
     setIsLoadingState = _g[1];
@@ -522,7 +560,7 @@ var AlgoliaDynamicSearch = function (_a) {
     className: styles$2.cmpAlgoliaDynamicSearchWidget__placeholder__loading
   })), /*#__PURE__*/React.createElement("div", {
     className: styles$2.cmpAlgoliaDynamicSearchWidget__container
-  }, /*#__PURE__*/React.createElement("div", {
+  }, queryType != PRODUCT_DETAILS && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: styles$2.cmpAlgoliaDynamicSearchWidget__header
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$2.cmpAlgoliaDynamicSearchWidget__header__text
@@ -549,13 +587,13 @@ var AlgoliaDynamicSearch = function (_a) {
         }
       } : undefined
     });
-  }())), /*#__PURE__*/React.createElement("div", {
+  }()))), /*#__PURE__*/React.createElement("div", {
     className: styles$2.cmpAlgoliaDynamicSearchWidget__cards
   }, hits.slice(0, maxResults).map(function (hit, index) {
     var Component = Card;
     var title = hit.title;
     var cardStyle = "";
-    var imageUrl = hit.image || placeholder;
+    var imageUrl = hit.imageUrl || placeholder;
     var hitUtm = new URLSearchParams({
       utm_source: "web",
       utm_medium: "alg",
@@ -580,6 +618,11 @@ var AlgoliaDynamicSearch = function (_a) {
         cardClassName = "cmp-card--type-careers";
         imageUrl = "";
         break;
+      case PRODUCT_DETAILS:
+        cardStyle = "type-card-panel";
+        Component = ProductDetailsCard;
+        cardClassName = "cmp-card--type-product_details";
+        break;
       default:
         return null;
     }
@@ -589,9 +632,11 @@ var AlgoliaDynamicSearch = function (_a) {
       title: title,
       imageUrl: imageUrl,
       placeholder: hit.image ? false : true,
+      hit: hit,
       cta: hitCta,
       size: "",
       cardStyle: cardStyle,
+      facets: facets,
       contentCategoryLabel: contentCategoryLabel,
       colour: contentCategoryColour,
       productPrice: price,