@bbl-digital/snorre 4.1.47 → 4.1.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,5 @@
1
1
  /** @jsxImportSource @emotion/react */
2
+ import { useEffect, useRef } from 'react';
2
3
  import Header from '../../../core/Header';
3
4
  import Html from '../../../core/Html';
4
5
  import Text from '../../../core/Text';
@@ -8,26 +9,48 @@ import { ContentWrapper, DiscountAndBonus, ImageRepresentation, ImageWithOverlay
8
9
  import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
9
10
  export const MemberBenefitsCard = ({
10
11
  benefit,
12
+ altText,
13
+ altTextLogo,
14
+ scrollTo,
11
15
  onReadMoreClick,
16
+ afterScroll,
12
17
  ...props
13
18
  }) => {
14
- const hasDiscountText = !!benefit?.discountText?.trim();
15
- const hasBonusRate = !!benefit?.bonusRate;
19
+ const ref = useRef(null);
20
+ const discountText = benefit?.discountText?.trim();
21
+ const bonusText = benefit?.bonusText?.trim();
16
22
  const hasSituationImage = !!benefit?.urlSituationImage;
17
23
  const hasLogo = !!benefit?.urlLogo;
24
+ const situationImgAltText = altText || `${benefit.name} situasjonsbilde`;
25
+ const logoAltText = altTextLogo || `${benefit.name} logo`;
26
+ const scrollToRef = ref => {
27
+ if (ref.current) {
28
+ ref.current.scrollIntoView({
29
+ behavior: 'smooth',
30
+ block: 'end'
31
+ });
32
+ }
33
+ };
34
+ useEffect(() => {
35
+ if (scrollTo) {
36
+ scrollToRef(ref);
37
+ afterScroll && afterScroll();
38
+ }
39
+ }, [ref, scrollTo, afterScroll]);
18
40
  return _jsxs("button", {
19
41
  css: () => [styles.default(), props.css && props.css],
42
+ ref: ref,
20
43
  onClick: onReadMoreClick,
21
44
  "aria-label": `Les mer om denne medlemsfordelen: ${benefit.name}`,
22
45
  children: [_jsxs(ImageWithOverlay, {
23
46
  children: [hasSituationImage && _jsx(ImageRepresentation, {
24
47
  src: benefit.urlSituationImage,
25
- alt: benefit.name
48
+ alt: situationImgAltText
26
49
  }), _jsx(LogoOverlay, {
27
50
  children: hasLogo && _jsx(LogoFlexContainer, {
28
51
  children: _jsx(SupplierLogo, {
29
52
  src: benefit.urlLogo,
30
- alt: benefit.name
53
+ alt: logoAltText
31
54
  })
32
55
  })
33
56
  })]
@@ -40,20 +63,20 @@ export const MemberBenefitsCard = ({
40
63
  }), benefit?.teaser && _jsx(Html, {
41
64
  text: benefit.teaser
42
65
  })]
43
- }), (hasDiscountText || hasBonusRate) && _jsxs(DiscountAndBonus, {
44
- children: [benefit?.bonusRate && _jsxs(Row, {
66
+ }), (Boolean(bonusText?.length) || Boolean(discountText?.length)) && _jsxs(DiscountAndBonus, {
67
+ children: [!!bonusText && _jsxs(Row, {
45
68
  children: [_jsx(IconMedal, {
46
69
  backgrounded: true
47
- }), _jsxs(Text, {
70
+ }), _jsx(Text, {
48
71
  semibold: true,
49
- children: [benefit.bonusRate, "% bonus"]
72
+ children: bonusText
50
73
  })]
51
- }), benefit?.discountText?.trim() && _jsxs(Row, {
74
+ }), !!discountText && _jsxs(Row, {
52
75
  children: [_jsx(IconPercent, {
53
76
  backgrounded: true
54
77
  }), _jsx(Text, {
55
78
  semibold: true,
56
- children: benefit.discountText
79
+ children: discountText
57
80
  })]
58
81
  })]
59
82
  })]
@@ -1 +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"}
1
+ {"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"}
@@ -1,4 +1,5 @@
1
1
  /** @jsxImportSource @emotion/react */
2
+ import { useEffect, useRef } from 'react';
2
3
  import Header from '../../../core/Header';
3
4
  import Html from '../../../core/Html';
4
5
  import Text from '../../../core/Text';
@@ -8,26 +9,48 @@ import { ContentWrapper, DiscountAndBonus, ImageRepresentation, ImageWithOverlay
8
9
  import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
9
10
  export const MemberBenefitsCard = ({
10
11
  benefit,
12
+ altText,
13
+ altTextLogo,
14
+ scrollTo,
11
15
  onReadMoreClick,
16
+ afterScroll,
12
17
  ...props
13
18
  }) => {
14
- const hasDiscountText = !!benefit?.discountText?.trim();
15
- const hasBonusRate = !!benefit?.bonusRate;
19
+ const ref = useRef(null);
20
+ const discountText = benefit?.discountText?.trim();
21
+ const bonusText = benefit?.bonusText?.trim();
16
22
  const hasSituationImage = !!benefit?.urlSituationImage;
17
23
  const hasLogo = !!benefit?.urlLogo;
24
+ const situationImgAltText = altText || `${benefit.name} situasjonsbilde`;
25
+ const logoAltText = altTextLogo || `${benefit.name} logo`;
26
+ const scrollToRef = ref => {
27
+ if (ref.current) {
28
+ ref.current.scrollIntoView({
29
+ behavior: 'smooth',
30
+ block: 'end'
31
+ });
32
+ }
33
+ };
34
+ useEffect(() => {
35
+ if (scrollTo) {
36
+ scrollToRef(ref);
37
+ afterScroll && afterScroll();
38
+ }
39
+ }, [ref, scrollTo, afterScroll]);
18
40
  return _jsxs("button", {
19
41
  css: () => [styles.default(), props.css && props.css],
42
+ ref: ref,
20
43
  onClick: onReadMoreClick,
21
44
  "aria-label": `Les mer om denne medlemsfordelen: ${benefit.name}`,
22
45
  children: [_jsxs(ImageWithOverlay, {
23
46
  children: [hasSituationImage && _jsx(ImageRepresentation, {
24
47
  src: benefit.urlSituationImage,
25
- alt: benefit.name
48
+ alt: situationImgAltText
26
49
  }), _jsx(LogoOverlay, {
27
50
  children: hasLogo && _jsx(LogoFlexContainer, {
28
51
  children: _jsx(SupplierLogo, {
29
52
  src: benefit.urlLogo,
30
- alt: benefit.name
53
+ alt: logoAltText
31
54
  })
32
55
  })
33
56
  })]
@@ -40,20 +63,20 @@ export const MemberBenefitsCard = ({
40
63
  }), benefit?.teaser && _jsx(Html, {
41
64
  text: benefit.teaser
42
65
  })]
43
- }), (hasDiscountText || hasBonusRate) && _jsxs(DiscountAndBonus, {
44
- children: [benefit?.bonusRate && _jsxs(Row, {
66
+ }), (Boolean(bonusText?.length) || Boolean(discountText?.length)) && _jsxs(DiscountAndBonus, {
67
+ children: [!!bonusText && _jsxs(Row, {
45
68
  children: [_jsx(IconMedal, {
46
69
  backgrounded: true
47
- }), _jsxs(Text, {
70
+ }), _jsx(Text, {
48
71
  semibold: true,
49
- children: [benefit.bonusRate, "% bonus"]
72
+ children: bonusText
50
73
  })]
51
- }), benefit?.discountText?.trim() && _jsxs(Row, {
74
+ }), !!discountText && _jsxs(Row, {
52
75
  children: [_jsx(IconPercent, {
53
76
  backgrounded: true
54
77
  }), _jsx(Text, {
55
78
  semibold: true,
56
- children: benefit.discountText
79
+ children: discountText
57
80
  })]
58
81
  })]
59
82
  })]
@@ -36,9 +36,16 @@ export interface IBeneftisResponse {
36
36
  contracts: IBenefit[];
37
37
  }
38
38
  export interface IMemberBenefitCardProps {
39
+ /** Benefit */
39
40
  benefit: IBenefit;
41
+ /** Alt text for missing situation image */
42
+ altText?: string;
43
+ /** Alt text for missing logo */
44
+ altTextLogo?: string;
40
45
  /** Custom css */
41
46
  css?: SerializedStyles;
47
+ /** Scroll to */
48
+ scrollTo?: boolean;
42
49
  /** Callback function for read more button */
43
50
  onReadMoreClick?: () => void;
44
51
  /** Handle after scroll */
@@ -1 +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"}
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,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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bbl-digital/snorre",
3
- "version": "4.1.47",
3
+ "version": "4.1.49",
4
4
  "description": "Design library for BBL Digital",
5
5
  "license": "MIT",
6
6
  "main": "./lib/index.js",