@bbl-digital/snorre 4.1.48 → 4.1.49

package/esm/v2/Memberbenefits/MemberbenefitsCard/index.js

@@ -1,4 +1,5 @@
 /** @jsxImportSource @emotion/react */
+import { useEffect, useRef } from 'react';
 import Header from '../../../core/Header';
 import Html from '../../../core/Html';
 import Text from '../../../core/Text';
@@ -8,26 +9,48 @@ import { ContentWrapper, DiscountAndBonus, ImageRepresentation, ImageWithOverlay
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 export const MemberBenefitsCard = ({
   benefit,
+  altText,
+  altTextLogo,
+  scrollTo,
   onReadMoreClick,
+  afterScroll,
   ...props
 }) => {
+  const ref = useRef(null);
   const discountText = benefit?.discountText?.trim();
   const bonusText = benefit?.bonusText?.trim();
   const hasSituationImage = !!benefit?.urlSituationImage;
   const hasLogo = !!benefit?.urlLogo;
+  const situationImgAltText = altText || `${benefit.name} situasjonsbilde`;
+  const logoAltText = altTextLogo || `${benefit.name} logo`;
+  const scrollToRef = ref => {
+    if (ref.current) {
+      ref.current.scrollIntoView({
+        behavior: 'smooth',
+        block: 'end'
+      });
+    }
+  };
+  useEffect(() => {
+    if (scrollTo) {
+      scrollToRef(ref);
+      afterScroll && afterScroll();
+    }
+  }, [ref, scrollTo, afterScroll]);
   return _jsxs("button", {
     css: () => [styles.default(), props.css && props.css],
+    ref: ref,
     onClick: onReadMoreClick,
     "aria-label": `Les mer om denne medlemsfordelen: ${benefit.name}`,
     children: [_jsxs(ImageWithOverlay, {
       children: [hasSituationImage && _jsx(ImageRepresentation, {
         src: benefit.urlSituationImage,
-        alt: benefit.name
+        alt: situationImgAltText
       }), _jsx(LogoOverlay, {
         children: hasLogo && _jsx(LogoFlexContainer, {
           children: _jsx(SupplierLogo, {
             src: benefit.urlLogo,
-            alt: benefit.name
+            alt: logoAltText
           })
         })
       })]

package/lib/v2/Memberbenefits/MemberbenefitsCard/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/v2/Memberbenefits/MemberbenefitsCard/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAcjD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAyDhE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/v2/Memberbenefits/MemberbenefitsCard/index.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAcjD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+EhE,CAAA"}

package/lib/v2/Memberbenefits/MemberbenefitsCard/index.js

@@ -1,4 +1,5 @@
 /** @jsxImportSource @emotion/react */
+import { useEffect, useRef } from 'react';
 import Header from '../../../core/Header';
 import Html from '../../../core/Html';
 import Text from '../../../core/Text';
@@ -8,26 +9,48 @@ import { ContentWrapper, DiscountAndBonus, ImageRepresentation, ImageWithOverlay
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 export const MemberBenefitsCard = ({
   benefit,
+  altText,
+  altTextLogo,
+  scrollTo,
   onReadMoreClick,
+  afterScroll,
   ...props
 }) => {
+  const ref = useRef(null);
   const discountText = benefit?.discountText?.trim();
   const bonusText = benefit?.bonusText?.trim();
   const hasSituationImage = !!benefit?.urlSituationImage;
   const hasLogo = !!benefit?.urlLogo;
+  const situationImgAltText = altText || `${benefit.name} situasjonsbilde`;
+  const logoAltText = altTextLogo || `${benefit.name} logo`;
+  const scrollToRef = ref => {
+    if (ref.current) {
+      ref.current.scrollIntoView({
+        behavior: 'smooth',
+        block: 'end'
+      });
+    }
+  };
+  useEffect(() => {
+    if (scrollTo) {
+      scrollToRef(ref);
+      afterScroll && afterScroll();
+    }
+  }, [ref, scrollTo, afterScroll]);
   return _jsxs("button", {
     css: () => [styles.default(), props.css && props.css],
+    ref: ref,
     onClick: onReadMoreClick,
     "aria-label": `Les mer om denne medlemsfordelen: ${benefit.name}`,
     children: [_jsxs(ImageWithOverlay, {
       children: [hasSituationImage && _jsx(ImageRepresentation, {
         src: benefit.urlSituationImage,
-        alt: benefit.name
+        alt: situationImgAltText
       }), _jsx(LogoOverlay, {
         children: hasLogo && _jsx(LogoFlexContainer, {
           children: _jsx(SupplierLogo, {
             src: benefit.urlLogo,
-            alt: benefit.name
+            alt: logoAltText
           })
         })
       })]

package/lib/v2/Memberbenefits/MemberbenefitsCard/model.d.ts

@@ -36,9 +36,16 @@ export interface IBeneftisResponse {
     contracts: IBenefit[];
 }
 export interface IMemberBenefitCardProps {
+    /** Benefit */
     benefit: IBenefit;
+    /** Alt text for missing situation image */
+    altText?: string;
+    /** Alt text for missing logo */
+    altTextLogo?: string;
     /** Custom css */
     css?: SerializedStyles;
+    /** Scroll to */
+    scrollTo?: boolean;
     /** Callback function for read more button */
     onReadMoreClick?: () => void;
     /** Handle after scroll */

package/lib/v2/Memberbenefits/MemberbenefitsCard/model.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"model.d.ts","sourceRoot":"","sources":["../../../../src/packages/v2/Memberbenefits/MemberbenefitsCard/model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAEjD,MAAM,WAAW,QAAQ;IACvB,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,GAAG,EAAE,CAAA;IAChB,WAAW,CAAC,EAAE,eAAe,CAAA;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,IAAI,CAAA;IAChB,OAAO,CAAC,EAAE,IAAI,CAAA;IACd,SAAS,CAAC,EAAE,GAAG,EAAE,CAAA;IACjB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,oBAAY,eAAe;IACzB,MAAM,WAAW;IACjB,MAAM,WAAW;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,QAAQ,EAAE,CAAA;CACtB;AACD,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,QAAQ,CAAA;IACjB,iBAAiB;IACjB,GAAG,CAAC,EAAE,gBAAgB,CAAA;IACtB,6CAA6C;IAC7C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB"}
+{"version":3,"file":"model.d.ts","sourceRoot":"","sources":["../../../../src/packages/v2/Memberbenefits/MemberbenefitsCard/model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAEjD,MAAM,WAAW,QAAQ;IACvB,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,GAAG,EAAE,CAAA;IAChB,WAAW,CAAC,EAAE,eAAe,CAAA;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,IAAI,CAAA;IAChB,OAAO,CAAC,EAAE,IAAI,CAAA;IACd,SAAS,CAAC,EAAE,GAAG,EAAE,CAAA;IACjB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,oBAAY,eAAe;IACzB,MAAM,WAAW;IACjB,MAAM,WAAW;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,QAAQ,EAAE,CAAA;CACtB;AACD,MAAM,WAAW,uBAAuB;IACtC,cAAc;IACd,OAAO,EAAE,QAAQ,CAAA;IACjB,2CAA2C;IAC3C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iBAAiB;IACjB,GAAG,CAAC,EAAE,gBAAgB,CAAA;IACtB,gBAAgB;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6CAA6C;IAC7C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbl-digital/snorre",
-  "version": "4.1.48",
+  "version": "4.1.49",
   "description": "Design library for BBL Digital",
   "license": "MIT",
   "main": "./lib/index.js",