@windstream/react-shared-components 0.1.63 → 0.1.64

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.
package/dist/core.d.ts CHANGED
@@ -63,7 +63,7 @@ declare const Input: React$1.ForwardRefExoticComponent<Omit<React$1.InputHTMLAtt
63
63
  size?: "slim" | "medium" | "large" | undefined;
64
64
  label?: string | undefined;
65
65
  errorText?: string | undefined;
66
- prefixIconName?: "search" | "location_on" | undefined;
66
+ prefixIconName?: "location_on" | "search" | undefined;
67
67
  prefixIconSize?: 20 | 24 | 40 | 48 | undefined;
68
68
  prefixIconFill?: boolean | undefined;
69
69
  suffixIconFill?: boolean | undefined;
package/dist/index.d.ts CHANGED
@@ -346,7 +346,7 @@ type ButtonAsAnchor = ButtonCustomProps & Omit<AnchorHTMLAttributes<HTMLAnchorEl
346
346
  };
347
347
  type ButtonProps = ButtonAsButton | ButtonAsAnchor;
348
348
 
349
- declare const BrandButton: React__default.ForwardRefExoticComponent<ButtonProps$2 & React__default.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
349
+ declare const BrandButton: React__default.ForwardRefExoticComponent<ButtonProps$2 & React__default.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
350
350
 
351
351
  declare const Checklist: React__default.FC<ChecklistProps>;
352
352
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@windstream/react-shared-components",
3
- "version": "0.1.63",
3
+ "version": "0.1.64",
4
4
  "type": "module",
5
5
  "description": "Shared React components for Kinetic applications",
6
6
  "main": "dist/index.js",
@@ -1,97 +1,105 @@
1
- "use client";
2
- import { Text } from "@shared/components/text";
3
- import type { TypeCartRetentionBannerFields } from "./types";
4
- import { useEffect, useState } from "react";
5
- import { Button } from "@shared/contentful/blocks/button";
6
- import { Modal } from "@shared/contentful/blocks/modal";
7
- import { toDocument } from "@shared/utils/contentful/to-document";
8
- import { renderContentfulRichText } from "@shared/hooks/contentful/use-contentful-rich-text";
9
-
10
-
11
- const CartRetentionBanner: React.FC<{
12
- fields: TypeCartRetentionBannerFields;
13
- sys?: any;
14
- isInPopupContainer?: boolean;
15
- onClose?: () => void;
16
- onContinueCheckout?: () => void;
17
- checkShouldShowBanner?: () => boolean;
18
- onBannerShown?: () => void;
19
- }> = ({ fields, isInPopupContainer = false, onClose, onContinueCheckout, checkShouldShowBanner, onBannerShown }) => {
20
- const { anchorId, mainHeading, description, cta } = fields;
21
-
22
- const [modalOpen, setModalOpen] = useState<boolean>(false);
23
-
24
-
25
- useEffect(() => {
26
- const checkRetentionCookie = () => {
27
- if (checkShouldShowBanner?.() && !modalOpen) {
28
- setModalOpen(true);
29
- onBannerShown?.();
30
- }
31
- };
32
- checkRetentionCookie();
33
- const timeoutId = setTimeout(checkRetentionCookie, 100);
34
- return () => clearTimeout(timeoutId);
35
- }, []);
36
-
37
- const handleClose = () => {
38
- onClose?.();
39
- setModalOpen(false);
40
- };
41
-
42
- const continueCheckout = () => {
43
- onContinueCheckout?.();
44
- };
45
-
46
- if (isInPopupContainer) {
47
- return (
48
- <div className="mb-5 mt-10 flex w-full flex-col items-center justify-center">
49
- <Text
50
- className="heading5 lg:heading3 text-center">
51
- {mainHeading || "Welcome back. Let’s finish your order"}
52
- </Text>
53
- {description &&
54
- renderContentfulRichText(
55
- toDocument(description?.json),
56
- false,
57
- "body1 my-4"
58
- )
59
- }
60
- <Button
61
- onClick={continueCheckout}
62
- buttonLabel={cta?.buttonLabel ?? "Continue checkout"}
63
- />
64
- </div>
65
- );
66
- }
67
- return (
68
- <section id={anchorId} data-testid="cart-retention-banner">
69
- <Modal
70
- size="sm"
71
- isOpen={modalOpen}
72
- onRequestClose={handleClose}
73
- bodyClassName="flex items-center justify-center"
74
- >
75
- <div className="mb-5 mt-10 flex w-full flex-col items-center justify-center">
76
- <Text
77
- className="heading5 lg:heading3 text-center">
78
- {mainHeading || "Welcome back. Let&apos;s finish your order"}
79
- </Text>
80
- {description &&
81
- renderContentfulRichText(
82
- toDocument(description?.json),
83
- false,
84
- "body1 my-4"
85
- )
86
- }
87
- <Button
88
- onClick={continueCheckout}
89
- buttonLabel={cta?.buttonLabel ?? "Continue checkout"}
90
- />
91
- </div>
92
- </Modal>
93
- </section>
94
- );
95
- };
96
-
97
- export default CartRetentionBanner;
1
+ "use client";
2
+
3
+ import { useEffect, useState } from "react";
4
+ import type { TypeCartRetentionBannerFields } from "./types";
5
+
6
+ import { Text } from "@shared/components/text";
7
+ import { Button } from "@shared/contentful/blocks/button";
8
+ import { Modal } from "@shared/contentful/blocks/modal";
9
+ import { renderContentfulRichText } from "@shared/hooks/contentful/use-contentful-rich-text";
10
+ import { toDocument } from "@shared/utils/contentful/to-document";
11
+
12
+ const CartRetentionBanner: React.FC<{
13
+ fields: TypeCartRetentionBannerFields;
14
+ sys?: any;
15
+ isInPopupContainer?: boolean;
16
+ onClose?: () => void;
17
+ onContinueCheckout?: () => void;
18
+ checkShouldShowBanner?: () => boolean;
19
+ onBannerShown?: () => void;
20
+ }> = ({
21
+ fields,
22
+ isInPopupContainer = false,
23
+ onClose,
24
+ onContinueCheckout,
25
+ checkShouldShowBanner,
26
+ onBannerShown,
27
+ }) => {
28
+ const { anchorId, mainHeading, description, cta } = fields;
29
+
30
+ const [modalOpen, setModalOpen] = useState<boolean>(false);
31
+
32
+ useEffect(() => {
33
+ const checkRetentionCookie = () => {
34
+ if (checkShouldShowBanner?.() && !modalOpen) {
35
+ setModalOpen(true);
36
+ onBannerShown?.();
37
+ }
38
+ };
39
+ checkRetentionCookie();
40
+ const timeoutId = setTimeout(checkRetentionCookie, 100);
41
+ return () => clearTimeout(timeoutId);
42
+ }, []);
43
+
44
+ const handleClose = () => {
45
+ onClose?.();
46
+ setModalOpen(false);
47
+ };
48
+
49
+ const continueCheckout = () => {
50
+ onContinueCheckout?.();
51
+ };
52
+
53
+ if (isInPopupContainer) {
54
+ return (
55
+ <div
56
+ className="pop-up-body mb-5 mt-10 flex w-full flex-col items-center justify-center"
57
+ data-section-type={"cart-retention-banner"}
58
+ data-section-index={"0"}
59
+ >
60
+ <Text className="heading5 text-center lg:heading3">
61
+ {mainHeading || "Welcome back. Let’s finish your order"}
62
+ </Text>
63
+ {description &&
64
+ renderContentfulRichText(
65
+ toDocument(description?.json),
66
+ false,
67
+ "body1 my-4"
68
+ )}
69
+ <Button
70
+ onClick={continueCheckout}
71
+ buttonLabel={cta?.buttonLabel ?? "Continue checkout"}
72
+ />
73
+ </div>
74
+ );
75
+ }
76
+ return (
77
+ <section id={anchorId} data-testid="cart-retention-banner">
78
+ <Modal
79
+ size="sm"
80
+ isOpen={modalOpen}
81
+ onRequestClose={handleClose}
82
+ bodyClassName="flex items-center justify-center"
83
+ type="cart-retention-banner"
84
+ >
85
+ <div className="pop-up-body mb-5 mt-10 flex w-full flex-col items-center justify-center">
86
+ <Text className="heading5 text-center lg:heading3">
87
+ {mainHeading || "Welcome back. Let&apos;s finish your order"}
88
+ </Text>
89
+ {description &&
90
+ renderContentfulRichText(
91
+ toDocument(description?.json),
92
+ false,
93
+ "body1 my-4"
94
+ )}
95
+ <Button
96
+ onClick={continueCheckout}
97
+ buttonLabel={cta?.buttonLabel ?? "Continue checkout"}
98
+ />
99
+ </div>
100
+ </Modal>
101
+ </section>
102
+ );
103
+ };
104
+
105
+ export default CartRetentionBanner;