@times-components/ts-components 1.145.1-cfea81c4084e6f91221ea00fec9fc730d5b933cb.4 → 1.145.1-e871182934034874ea6a75e1e684090e5504df44.2
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/components/travel-mini-cta/index.d.ts +3 -0
- package/dist/components/travel-mini-cta/index.js +86 -0
- package/dist/components/travel-mini-cta/styles.d.ts +42 -0
- package/dist/components/travel-mini-cta/styles.js +273 -0
- package/dist/components/travel-mini-cta/travel-mini-cta.stories.d.ts +110 -0
- package/dist/components/travel-mini-cta/travel-mini-cta.stories.js +121 -0
- package/dist/components/travel-mini-cta/types.d.ts +10 -0
- package/dist/components/{trip-cards → travel-mini-cta}/types.js +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +2 -2
- package/dist/utils/applyDarkMode.d.ts +1 -0
- package/dist/utils/applyDarkMode.js +12 -0
- package/dist/utils/getMediaQuery.d.ts +11 -0
- package/dist/utils/getMediaQuery.js +19 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.js +3 -0
- package/package.json +3 -3
- package/rnw.js +1 -1
- package/src/components/travel-mini-cta/index.tsx +164 -0
- package/src/components/travel-mini-cta/styles.ts +336 -0
- package/src/components/travel-mini-cta/travel-mini-cta.stories.tsx +157 -0
- package/src/components/travel-mini-cta/types.ts +10 -0
- package/src/index.ts +1 -2
- package/src/utils/applyDarkMode.ts +12 -0
- package/src/utils/getMediaQuery.ts +25 -0
- package/src/utils/index.ts +2 -0
- package/dist/components/carousel-component/CarouselComponent.stories.d.ts +0 -1
- package/dist/components/carousel-component/CarouselComponent.stories.js +0 -146
- package/dist/components/carousel-component/CarouselItem.d.ts +0 -3
- package/dist/components/carousel-component/CarouselItem.js +0 -11
- package/dist/components/carousel-component/DefaultNavigationArrow.d.ts +0 -8
- package/dist/components/carousel-component/DefaultNavigationArrow.js +0 -6
- package/dist/components/carousel-component/DefaultPageDot.d.ts +0 -8
- package/dist/components/carousel-component/DefaultPageDot.js +0 -4
- package/dist/components/carousel-component/__tests__/CarouselComponent.test.d.ts +0 -1
- package/dist/components/carousel-component/__tests__/CarouselComponent.test.js +0 -163
- package/dist/components/carousel-component/__tests__/CarouselItem.test.d.ts +0 -1
- package/dist/components/carousel-component/__tests__/CarouselItem.test.js +0 -80
- package/dist/components/carousel-component/__tests__/DefaultNavigationArrow.test.d.ts +0 -1
- package/dist/components/carousel-component/__tests__/DefaultNavigationArrow.test.js +0 -62
- package/dist/components/carousel-component/__tests__/DefaultPageDot.test.d.ts +0 -1
- package/dist/components/carousel-component/__tests__/DefaultPageDot.test.js +0 -68
- package/dist/components/carousel-component/hooks/__tests__/useCarousel.test.d.ts +0 -1
- package/dist/components/carousel-component/hooks/__tests__/useCarousel.test.js +0 -314
- package/dist/components/carousel-component/hooks/useCarousel.d.ts +0 -2
- package/dist/components/carousel-component/hooks/useCarousel.js +0 -140
- package/dist/components/carousel-component/index.d.ts +0 -4
- package/dist/components/carousel-component/index.js +0 -20
- package/dist/components/carousel-component/styles.d.ts +0 -30
- package/dist/components/carousel-component/styles.js +0 -120
- package/dist/components/carousel-component/types.d.ts +0 -46
- package/dist/components/carousel-component/types.js +0 -2
- package/dist/components/trip-cards/SkeletonCard.d.ts +0 -2
- package/dist/components/trip-cards/SkeletonCard.js +0 -21
- package/dist/components/trip-cards/TripCard.d.ts +0 -3
- package/dist/components/trip-cards/TripCard.js +0 -47
- package/dist/components/trip-cards/TripCards.stories.d.ts +0 -1
- package/dist/components/trip-cards/TripCards.stories.js +0 -40
- package/dist/components/trip-cards/TripCardsLayout.d.ts +0 -3
- package/dist/components/trip-cards/TripCardsLayout.js +0 -26
- package/dist/components/trip-cards/__tests__/SkeletonCard.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/SkeletonCard.test.js +0 -139
- package/dist/components/trip-cards/__tests__/TripCard.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/TripCard.test.js +0 -95
- package/dist/components/trip-cards/__tests__/TripCardsLayout.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/TripCardsLayout.test.js +0 -277
- package/dist/components/trip-cards/__tests__/assets.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/assets.test.js +0 -165
- package/dist/components/trip-cards/__tests__/helpers.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/helpers.test.js +0 -135
- package/dist/components/trip-cards/__tests__/index.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/index.test.js +0 -437
- package/dist/components/trip-cards/__tests__/mockData.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/mockData.test.js +0 -57
- package/dist/components/trip-cards/__tests__/skeletonStyles.test.d.ts +0 -1
- package/dist/components/trip-cards/__tests__/skeletonStyles.test.js +0 -194
- package/dist/components/trip-cards/assets/BoatIcon.d.ts +0 -1
- package/dist/components/trip-cards/assets/BoatIcon.js +0 -4
- package/dist/components/trip-cards/assets/CalendarIcon.d.ts +0 -1
- package/dist/components/trip-cards/assets/CalendarIcon.js +0 -4
- package/dist/components/trip-cards/assets/ChevronRightIcon.d.ts +0 -1
- package/dist/components/trip-cards/assets/ChevronRightIcon.js +0 -4
- package/dist/components/trip-cards/assets/LocationIcon.d.ts +0 -1
- package/dist/components/trip-cards/assets/LocationIcon.js +0 -4
- package/dist/components/trip-cards/assets/MoonIcon.d.ts +0 -1
- package/dist/components/trip-cards/assets/MoonIcon.js +0 -4
- package/dist/components/trip-cards/assets/index.d.ts +0 -6
- package/dist/components/trip-cards/assets/index.js +0 -7
- package/dist/components/trip-cards/helpers.d.ts +0 -4
- package/dist/components/trip-cards/helpers.js +0 -74
- package/dist/components/trip-cards/index.d.ts +0 -4
- package/dist/components/trip-cards/index.js +0 -70
- package/dist/components/trip-cards/mockData.d.ts +0 -3
- package/dist/components/trip-cards/mockData.js +0 -323
- package/dist/components/trip-cards/skeletonStyles.d.ts +0 -9
- package/dist/components/trip-cards/skeletonStyles.js +0 -37
- package/dist/components/trip-cards/styles.d.ts +0 -39
- package/dist/components/trip-cards/styles.js +0 -387
- package/dist/components/trip-cards/types.d.ts +0 -87
- package/src/components/carousel-component/CarouselComponent.stories.tsx +0 -220
- package/src/components/carousel-component/CarouselItem.tsx +0 -20
- package/src/components/carousel-component/DefaultNavigationArrow.tsx +0 -37
- package/src/components/carousel-component/DefaultPageDot.tsx +0 -20
- package/src/components/carousel-component/__tests__/CarouselComponent.test.tsx +0 -259
- package/src/components/carousel-component/__tests__/CarouselItem.test.tsx +0 -140
- package/src/components/carousel-component/__tests__/DefaultNavigationArrow.test.tsx +0 -153
- package/src/components/carousel-component/__tests__/DefaultPageDot.test.tsx +0 -105
- package/src/components/carousel-component/hooks/__tests__/useCarousel.test.ts +0 -438
- package/src/components/carousel-component/hooks/useCarousel.ts +0 -187
- package/src/components/carousel-component/index.tsx +0 -88
- package/src/components/carousel-component/styles.ts +0 -140
- package/src/components/carousel-component/types.ts +0 -51
- package/src/components/trip-cards/SkeletonCard.tsx +0 -54
- package/src/components/trip-cards/TripCard.tsx +0 -135
- package/src/components/trip-cards/TripCards.stories.tsx +0 -67
- package/src/components/trip-cards/TripCardsLayout.tsx +0 -75
- package/src/components/trip-cards/__tests__/SkeletonCard.test.tsx +0 -169
- package/src/components/trip-cards/__tests__/TripCard.test.tsx +0 -120
- package/src/components/trip-cards/__tests__/TripCardsLayout.test.tsx +0 -532
- package/src/components/trip-cards/__tests__/assets.test.tsx +0 -206
- package/src/components/trip-cards/__tests__/helpers.test.ts +0 -165
- package/src/components/trip-cards/__tests__/index.test.tsx +0 -499
- package/src/components/trip-cards/__tests__/mockData.test.ts +0 -67
- package/src/components/trip-cards/__tests__/skeletonStyles.test.tsx +0 -256
- package/src/components/trip-cards/assets/BoatIcon.tsx +0 -17
- package/src/components/trip-cards/assets/CalendarIcon.tsx +0 -17
- package/src/components/trip-cards/assets/ChevronRightIcon.tsx +0 -20
- package/src/components/trip-cards/assets/LocationIcon.tsx +0 -17
- package/src/components/trip-cards/assets/MoonIcon.tsx +0 -17
- package/src/components/trip-cards/assets/index.ts +0 -7
- package/src/components/trip-cards/helpers.ts +0 -99
- package/src/components/trip-cards/index.tsx +0 -104
- package/src/components/trip-cards/mockData.ts +0 -351
- package/src/components/trip-cards/skeletonStyles.ts +0 -46
- package/src/components/trip-cards/styles.ts +0 -426
- package/src/components/trip-cards/types.ts +0 -91
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import React, { useState, useRef, useEffect } from 'react';
|
|
2
|
+
import { Container, ContentWrapper, LeftSection, LogoContainer, LogoBox, LogoText, TextContainer, Label, MobileLabel, Description, RightSection, ContactInfo, PhoneLabel, PhoneNumber, WorkingHoursContainer, WorkingHoursText, ButtonsContainer, PrimaryButton, SecondaryButton } from './styles';
|
|
3
|
+
export const TravelMiniCTA = ({ description, phoneLabel, phoneNumber, workingHours, primaryButtonText, secondaryButtonText, secondaryButtonUrl, isApp }) => {
|
|
4
|
+
const [chatReady, setChatReady] = useState(false);
|
|
5
|
+
const [chatFailed, setChatFailed] = useState(false);
|
|
6
|
+
const chatDivRef = useRef(null);
|
|
7
|
+
const formattedWorkingHours = workingHours
|
|
8
|
+
? workingHours.split(',').map(hour => hour.trim())
|
|
9
|
+
: [];
|
|
10
|
+
const handlePrimaryButtonClick = (e) => {
|
|
11
|
+
e.preventDefault();
|
|
12
|
+
const chatDiv = chatDivRef.current;
|
|
13
|
+
if (chatDiv) {
|
|
14
|
+
const lpEventElement = chatDiv.querySelector('[data-lp-event]');
|
|
15
|
+
if (lpEventElement) {
|
|
16
|
+
lpEventElement.click();
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
useEffect(() => {
|
|
21
|
+
const chatDiv = chatDivRef.current;
|
|
22
|
+
if (!chatDiv || typeof window === 'undefined') {
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
let timeoutId = null;
|
|
26
|
+
let previouslyFound = false;
|
|
27
|
+
const observer = new MutationObserver(() => {
|
|
28
|
+
const lpEventElement = chatDiv.querySelector('[data-lp-event]');
|
|
29
|
+
if (lpEventElement && !previouslyFound) {
|
|
30
|
+
previouslyFound = true;
|
|
31
|
+
setChatReady(true);
|
|
32
|
+
setChatFailed(false);
|
|
33
|
+
if (primaryButtonText) {
|
|
34
|
+
lpEventElement.textContent = primaryButtonText;
|
|
35
|
+
}
|
|
36
|
+
// Clear timeout since chat loaded successfully
|
|
37
|
+
if (timeoutId) {
|
|
38
|
+
clearTimeout(timeoutId);
|
|
39
|
+
timeoutId = null;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
else if (!lpEventElement && previouslyFound) {
|
|
43
|
+
previouslyFound = false;
|
|
44
|
+
setChatReady(false);
|
|
45
|
+
setChatFailed(false);
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
observer.observe(chatDiv, { childList: true, subtree: true });
|
|
49
|
+
timeoutId = setTimeout(() => {
|
|
50
|
+
if (!previouslyFound) {
|
|
51
|
+
observer.disconnect();
|
|
52
|
+
setChatFailed(true);
|
|
53
|
+
}
|
|
54
|
+
}, 15000);
|
|
55
|
+
return () => {
|
|
56
|
+
observer.disconnect();
|
|
57
|
+
if (timeoutId) {
|
|
58
|
+
clearTimeout(timeoutId);
|
|
59
|
+
}
|
|
60
|
+
};
|
|
61
|
+
}, [primaryButtonText]);
|
|
62
|
+
return (React.createElement(Container, { "data-testid": "travel-mini-cta", isApp: isApp },
|
|
63
|
+
React.createElement(ContentWrapper, null,
|
|
64
|
+
React.createElement(LeftSection, null,
|
|
65
|
+
React.createElement(LogoContainer, null,
|
|
66
|
+
React.createElement(LogoBox, { isApp: isApp },
|
|
67
|
+
React.createElement(LogoText, { isApp: isApp }, "T")),
|
|
68
|
+
React.createElement(MobileLabel, { isApp: isApp }, "VISIT TIMES HOLIDAYS")),
|
|
69
|
+
React.createElement(TextContainer, null,
|
|
70
|
+
React.createElement(Label, { isApp: isApp }, "VISIT TIMES HOLIDAYS"),
|
|
71
|
+
React.createElement(Description, { isApp: isApp }, description))),
|
|
72
|
+
React.createElement(RightSection, null,
|
|
73
|
+
React.createElement(ContactInfo, null,
|
|
74
|
+
React.createElement(PhoneLabel, { href: `tel:${phoneNumber}`, isApp: isApp },
|
|
75
|
+
phoneLabel,
|
|
76
|
+
' ',
|
|
77
|
+
React.createElement(PhoneNumber, { isApp: isApp }, phoneNumber)),
|
|
78
|
+
React.createElement(WorkingHoursContainer, null, formattedWorkingHours.map((hours, index) => (React.createElement(WorkingHoursText, { key: index, isApp: isApp }, hours))))),
|
|
79
|
+
React.createElement(ButtonsContainer, null,
|
|
80
|
+
React.createElement(PrimaryButton, { as: "button", type: "button", onClick: handlePrimaryButtonClick, isApp: isApp, disabled: !chatReady },
|
|
81
|
+
chatFailed && 'Chat unavailable',
|
|
82
|
+
!chatReady && !chatFailed && 'Loading chat...',
|
|
83
|
+
React.createElement("div", { id: "LP_DIV_TRAVEL_1239001", ref: chatDivRef })),
|
|
84
|
+
React.createElement(SecondaryButton, { href: secondaryButtonUrl, isApp: isApp }, secondaryButtonText))))));
|
|
85
|
+
};
|
|
86
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy90cmF2ZWwtbWluaS1jdGEvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxFQUFFLEVBQU0sUUFBUSxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQWMsTUFBTSxPQUFPLENBQUM7QUFFM0UsT0FBTyxFQUNMLFNBQVMsRUFDVCxjQUFjLEVBQ2QsV0FBVyxFQUNYLGFBQWEsRUFDYixPQUFPLEVBQ1AsUUFBUSxFQUNSLGFBQWEsRUFDYixLQUFLLEVBQ0wsV0FBVyxFQUNYLFdBQVcsRUFDWCxZQUFZLEVBQ1osV0FBVyxFQUNYLFVBQVUsRUFDVixXQUFXLEVBQ1gscUJBQXFCLEVBQ3JCLGdCQUFnQixFQUNoQixnQkFBZ0IsRUFDaEIsYUFBYSxFQUNiLGVBQWUsRUFDaEIsTUFBTSxVQUFVLENBQUM7QUFFbEIsTUFBTSxDQUFDLE1BQU0sYUFBYSxHQUEyQixDQUFDLEVBQ3BELFdBQVcsRUFDWCxVQUFVLEVBQ1YsV0FBVyxFQUNYLFlBQVksRUFDWixpQkFBaUIsRUFDakIsbUJBQW1CLEVBQ25CLGtCQUFrQixFQUNsQixLQUFLLEVBQ04sRUFBRSxFQUFFO0lBQ0gsTUFBTSxDQUFDLFNBQVMsRUFBRSxZQUFZLENBQUMsR0FBRyxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDbEQsTUFBTSxDQUFDLFVBQVUsRUFBRSxhQUFhLENBQUMsR0FBRyxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDcEQsTUFBTSxVQUFVLEdBQUcsTUFBTSxDQUFpQixJQUFJLENBQUMsQ0FBQztJQUVoRCxNQUFNLHFCQUFxQixHQUFHLFlBQVk7UUFDeEMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ2xELENBQUMs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
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
export declare const Container: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
isApp?: boolean | undefined;
|
|
3
|
+
}, never>;
|
|
4
|
+
export declare const ContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export declare const LeftSection: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export declare const LogoContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
+
export declare const LogoBox: import("styled-components").StyledComponent<"div", any, {
|
|
8
|
+
isApp?: boolean | undefined;
|
|
9
|
+
}, never>;
|
|
10
|
+
export declare const LogoText: import("styled-components").StyledComponent<"span", any, {
|
|
11
|
+
isApp?: boolean | undefined;
|
|
12
|
+
}, never>;
|
|
13
|
+
export declare const TextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
14
|
+
export declare const Label: import("styled-components").StyledComponent<"div", any, {
|
|
15
|
+
isApp?: boolean | undefined;
|
|
16
|
+
}, never>;
|
|
17
|
+
export declare const MobileLabel: import("styled-components").StyledComponent<"div", any, {
|
|
18
|
+
isApp?: boolean | undefined;
|
|
19
|
+
}, never>;
|
|
20
|
+
export declare const Description: import("styled-components").StyledComponent<"div", any, {
|
|
21
|
+
isApp?: boolean | undefined;
|
|
22
|
+
}, never>;
|
|
23
|
+
export declare const RightSection: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
24
|
+
export declare const ContactInfo: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
25
|
+
export declare const PhoneLabel: import("styled-components").StyledComponent<"a", any, {
|
|
26
|
+
isApp?: boolean | undefined;
|
|
27
|
+
}, never>;
|
|
28
|
+
export declare const PhoneNumber: import("styled-components").StyledComponent<"span", any, {
|
|
29
|
+
isApp?: boolean | undefined;
|
|
30
|
+
}, never>;
|
|
31
|
+
export declare const WorkingHoursContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
32
|
+
export declare const WorkingHoursText: import("styled-components").StyledComponent<"div", any, {
|
|
33
|
+
isApp?: boolean | undefined;
|
|
34
|
+
}, never>;
|
|
35
|
+
export declare const ButtonsContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
36
|
+
export declare const PrimaryButton: import("styled-components").StyledComponent<"a", any, {
|
|
37
|
+
disabled?: boolean | undefined;
|
|
38
|
+
isApp?: boolean | undefined;
|
|
39
|
+
}, never>;
|
|
40
|
+
export declare const SecondaryButton: import("styled-components").StyledComponent<"a", any, {
|
|
41
|
+
isApp?: boolean | undefined;
|
|
42
|
+
}, never>;
|
|
@@ -0,0 +1,273 @@
|
|
|
1
|
+
import styled from 'styled-components';
|
|
2
|
+
import { getMediaQuery, applyDarkMode } from '../../utils';
|
|
3
|
+
const BaseLabel = styled.div `
|
|
4
|
+
font-family: 'Roboto';
|
|
5
|
+
font-weight: 500;
|
|
6
|
+
line-height: 1.125;
|
|
7
|
+
font-size: 0.875rem;
|
|
8
|
+
letter-spacing: 0em;
|
|
9
|
+
color: #01000d;
|
|
10
|
+
text-transform: uppercase;
|
|
11
|
+
|
|
12
|
+
${({ isApp }) => applyDarkMode(`
|
|
13
|
+
color: #f5f5f5 !important;
|
|
14
|
+
`, isApp)};
|
|
15
|
+
`;
|
|
16
|
+
export const Container = styled.div `
|
|
17
|
+
background-color: #ffffff;
|
|
18
|
+
padding: 24px;
|
|
19
|
+
border-top: 1px dashed;
|
|
20
|
+
border-bottom: 1px dashed;
|
|
21
|
+
border-color: #cccccc;
|
|
22
|
+
|
|
23
|
+
${({ isApp }) => applyDarkMode(`
|
|
24
|
+
background-color: #f5f5f5 !important;
|
|
25
|
+
border-color: #e4e4e4 !important;
|
|
26
|
+
`, isApp)};
|
|
27
|
+
`;
|
|
28
|
+
export const ContentWrapper = styled.div `
|
|
29
|
+
display: flex;
|
|
30
|
+
flex-direction: row;
|
|
31
|
+
justify-content: space-between;
|
|
32
|
+
align-items: flex-start;
|
|
33
|
+
gap: 20px;
|
|
34
|
+
|
|
35
|
+
${getMediaQuery('xs', 'md')} {
|
|
36
|
+
flex-direction: column;
|
|
37
|
+
gap: 24px;
|
|
38
|
+
}
|
|
39
|
+
`;
|
|
40
|
+
export const LeftSection = styled.div `
|
|
41
|
+
display: flex;
|
|
42
|
+
flex-direction: row;
|
|
43
|
+
align-items: flex-start;
|
|
44
|
+
width: 50%;
|
|
45
|
+
gap: 24px;
|
|
46
|
+
|
|
47
|
+
${getMediaQuery('xs', 'md')} {
|
|
48
|
+
width: 100%;
|
|
49
|
+
flex-direction: column;
|
|
50
|
+
gap: 16px;
|
|
51
|
+
}
|
|
52
|
+
`;
|
|
53
|
+
export const LogoContainer = styled.div `
|
|
54
|
+
display: flex;
|
|
55
|
+
align-items: center;
|
|
56
|
+
justify-content: center;
|
|
57
|
+
flex-shrink: 0;
|
|
58
|
+
|
|
59
|
+
${getMediaQuery('xs', 'md')} {
|
|
60
|
+
flex-direction: row-reverse;
|
|
61
|
+
justify-content: flex-start;
|
|
62
|
+
justify-content: space-between;
|
|
63
|
+
width: 100%;
|
|
64
|
+
}
|
|
65
|
+
`;
|
|
66
|
+
export const LogoBox = styled.div `
|
|
67
|
+
width: 40px;
|
|
68
|
+
height: 40px;
|
|
69
|
+
position: relative;
|
|
70
|
+
display: flex;
|
|
71
|
+
align-items: center;
|
|
72
|
+
justify-content: center;
|
|
73
|
+
background-color: #aaaaaa;
|
|
74
|
+
|
|
75
|
+
${({ isApp }) => applyDarkMode(`
|
|
76
|
+
background-color: #c2c2c2 !important;
|
|
77
|
+
`, isApp)};
|
|
78
|
+
`;
|
|
79
|
+
export const LogoText = styled.span `
|
|
80
|
+
font-family: 'Times Modern', serif;
|
|
81
|
+
font-weight: 700;
|
|
82
|
+
font-size: 40px;
|
|
83
|
+
line-height: 1.125;
|
|
84
|
+
letter-spacing: 0.02em;
|
|
85
|
+
color: #ffffff;
|
|
86
|
+
padding-top: 4px;
|
|
87
|
+
|
|
88
|
+
${({ isApp }) => applyDarkMode(`
|
|
89
|
+
color: #1d1d1b !important;
|
|
90
|
+
`, isApp)};
|
|
91
|
+
`;
|
|
92
|
+
export const TextContainer = styled.div `
|
|
93
|
+
display: flex;
|
|
94
|
+
flex-direction: column;
|
|
95
|
+
gap: 16px;
|
|
96
|
+
max-width: 375px;
|
|
97
|
+
|
|
98
|
+
${getMediaQuery('xs', 'md')} {
|
|
99
|
+
gap: 24px;
|
|
100
|
+
}
|
|
101
|
+
`;
|
|
102
|
+
export const Label = styled(BaseLabel) `
|
|
103
|
+
${getMediaQuery('xs', 'md')} {
|
|
104
|
+
display: none;
|
|
105
|
+
}
|
|
106
|
+
`;
|
|
107
|
+
export const MobileLabel = styled(BaseLabel) `
|
|
108
|
+
display: none;
|
|
109
|
+
|
|
110
|
+
${getMediaQuery('xs', 'md')} {
|
|
111
|
+
display: block;
|
|
112
|
+
}
|
|
113
|
+
`;
|
|
114
|
+
export const Description = styled.div `
|
|
115
|
+
font-family: 'Times Modern';
|
|
116
|
+
font-weight: 700;
|
|
117
|
+
line-height: 1.125;
|
|
118
|
+
font-size: 1.5rem;
|
|
119
|
+
letter-spacing: 0em;
|
|
120
|
+
color: #333333;
|
|
121
|
+
|
|
122
|
+
${({ isApp }) => applyDarkMode(`
|
|
123
|
+
color: #cccccc !important;
|
|
124
|
+
`, isApp)};
|
|
125
|
+
|
|
126
|
+
${getMediaQuery('xs', 'md')} {
|
|
127
|
+
margin-right: 64px;
|
|
128
|
+
}
|
|
129
|
+
`;
|
|
130
|
+
export const RightSection = styled.div `
|
|
131
|
+
display: flex;
|
|
132
|
+
flex-direction: column;
|
|
133
|
+
gap: 24px;
|
|
134
|
+
width: 50%;
|
|
135
|
+
|
|
136
|
+
${getMediaQuery('xs', 'md')} {
|
|
137
|
+
gap: 32px;
|
|
138
|
+
width: 100%;
|
|
139
|
+
}
|
|
140
|
+
`;
|
|
141
|
+
export const ContactInfo = styled.div `
|
|
142
|
+
display: flex;
|
|
143
|
+
flex-direction: column;
|
|
144
|
+
gap: 16px;
|
|
145
|
+
`;
|
|
146
|
+
export const PhoneLabel = styled.a `
|
|
147
|
+
text-decoration: none;
|
|
148
|
+
display: inline;
|
|
149
|
+
font-family: 'Times Digital W04 Regular';
|
|
150
|
+
font-weight: 400;
|
|
151
|
+
line-height: 1.5;
|
|
152
|
+
font-size: 1.125rem;
|
|
153
|
+
letter-spacing: 0em;
|
|
154
|
+
color: #333333;
|
|
155
|
+
cursor: pointer;
|
|
156
|
+
|
|
157
|
+
${({ isApp }) => applyDarkMode(`
|
|
158
|
+
color: #c2c2c2 !important;
|
|
159
|
+
`, isApp)};
|
|
160
|
+
|
|
161
|
+
&:hover {
|
|
162
|
+
text-decoration: underline;
|
|
163
|
+
}
|
|
164
|
+
`;
|
|
165
|
+
export const PhoneNumber = styled.span `
|
|
166
|
+
font-family: 'Times Modern';
|
|
167
|
+
font-weight: 700;
|
|
168
|
+
line-height: 1.125;
|
|
169
|
+
font-size: 1.5rem;
|
|
170
|
+
letter-spacing: 0em;
|
|
171
|
+
color: #333333;
|
|
172
|
+
font-size: 2.2rem;
|
|
173
|
+
|
|
174
|
+
${({ isApp }) => applyDarkMode(`
|
|
175
|
+
color: #c2c2c2 !important;
|
|
176
|
+
`, isApp)};
|
|
177
|
+
`;
|
|
178
|
+
export const WorkingHoursContainer = styled.div `
|
|
179
|
+
display: flex;
|
|
180
|
+
flex-direction: row;
|
|
181
|
+
gap: 8px;
|
|
182
|
+
flex-wrap: wrap;
|
|
183
|
+
|
|
184
|
+
${getMediaQuery('xs', 'md')} {
|
|
185
|
+
flex-direction: column;
|
|
186
|
+
}
|
|
187
|
+
`;
|
|
188
|
+
export const WorkingHoursText = styled.div `
|
|
189
|
+
font-family: 'Times Digital W04 Regular';
|
|
190
|
+
font-weight: 400;
|
|
191
|
+
line-height: 1.5;
|
|
192
|
+
font-size: 1.125rem;
|
|
193
|
+
letter-spacing: 0em;
|
|
194
|
+
color: #333333;
|
|
195
|
+
|
|
196
|
+
${({ isApp }) => applyDarkMode(`
|
|
197
|
+
color: #cccccc !important;
|
|
198
|
+
`, isApp)};
|
|
199
|
+
`;
|
|
200
|
+
export const ButtonsContainer = styled.div `
|
|
201
|
+
display: flex;
|
|
202
|
+
flex-direction: row;
|
|
203
|
+
gap: 16px;
|
|
204
|
+
|
|
205
|
+
${getMediaQuery('xs', 'md')} {
|
|
206
|
+
flex-direction: column;
|
|
207
|
+
}
|
|
208
|
+
`;
|
|
209
|
+
const BaseButton = styled.a `
|
|
210
|
+
text-decoration: none;
|
|
211
|
+
border-radius: 0px;
|
|
212
|
+
width: 100%;
|
|
213
|
+
min-height: 44px;
|
|
214
|
+
font-family: 'Roboto';
|
|
215
|
+
font-weight: 500;
|
|
216
|
+
line-height: 1.5;
|
|
217
|
+
font-size: 1rem;
|
|
218
|
+
letter-spacing: 0em;
|
|
219
|
+
display: flex;
|
|
220
|
+
align-items: center;
|
|
221
|
+
justify-content: center;
|
|
222
|
+
padding: 12px;
|
|
223
|
+
cursor: pointer;
|
|
224
|
+
transition: all 0.2s ease;
|
|
225
|
+
`;
|
|
226
|
+
export const PrimaryButton = styled(BaseButton) `
|
|
227
|
+
border: none;
|
|
228
|
+
background-color: #005c8a;
|
|
229
|
+
color: #ffffff;
|
|
230
|
+
cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
|
|
231
|
+
opacity: ${({ disabled }) => (disabled ? 0.6 : 1)};
|
|
232
|
+
|
|
233
|
+
div[data-lp-event] {
|
|
234
|
+
cursor: pointer;
|
|
235
|
+
font-family: 'Roboto';
|
|
236
|
+
font-weight: 500;
|
|
237
|
+
line-height: 1.5;
|
|
238
|
+
font-size: 1rem;
|
|
239
|
+
letter-spacing: 0em;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
&:hover {
|
|
243
|
+
background-color: #00527a;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
${({ isApp }) => applyDarkMode(`
|
|
247
|
+
background-color: #74bade !important;
|
|
248
|
+
color: #1d1d1b !important;
|
|
249
|
+
|
|
250
|
+
&:hover {
|
|
251
|
+
background-color: #93cbe8 !important;
|
|
252
|
+
}
|
|
253
|
+
`, isApp)};
|
|
254
|
+
`;
|
|
255
|
+
export const SecondaryButton = styled(BaseButton) `
|
|
256
|
+
border: 1px solid #005c8a;
|
|
257
|
+
background-color: transparent;
|
|
258
|
+
color: #005c8a;
|
|
259
|
+
|
|
260
|
+
&:hover {
|
|
261
|
+
background-color: #f5f5f5;
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
${({ isApp }) => applyDarkMode(`
|
|
265
|
+
border-color: #74bade !important;
|
|
266
|
+
color: #74bade !important;
|
|
267
|
+
|
|
268
|
+
&:hover {
|
|
269
|
+
background-color: #01000d !important;
|
|
270
|
+
}
|
|
271
|
+
`, isApp)};
|
|
272
|
+
`;
|
|
273
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdHJhdmVsLW1pbmktY3RhL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQUN2QyxPQUFPLEVBQUUsYUFBYSxFQUFFLGFBQWEsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUUzRCxNQUFNLFNBQVMsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFxQjs7Ozs7Ozs7O0lBUzdDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQ2QsYUFBYSxDQUNYOztLQUVELEVBQ0MsS0FBSyxDQUNOO0NBQ0osQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFxQjs7Ozs7OztJQU9wRCxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUNkLGFBQWEsQ0FDWDs7O0tBR0QsRUFDQyxLQUFLLENBQ047Q0FDSixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sY0FBYyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7Ozs7SUFPcEMsYUFBYSxDQUFDLElBQUksRUFBRSxJQUFJLENBQUM7Ozs7Q0FJNUIsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFdBQVcsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7Ozs7O0lBT2pDLGFBQWEsQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDOzs7OztDQUs1QixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sYUFBYSxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7OztJQU1uQyxhQUFhLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQzs7Ozs7O0NBTTVCLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxPQUFPLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBcUI7Ozs7Ozs7OztJQVNsRCxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUs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
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { TravelMiniCTAProps } from './types';
|
|
3
|
+
declare const _default: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: React.FC<TravelMiniCTAProps>;
|
|
6
|
+
parameters: {
|
|
7
|
+
docs: {
|
|
8
|
+
subtitle: string;
|
|
9
|
+
description: {
|
|
10
|
+
component: string;
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
export default _default;
|
|
16
|
+
export declare const Default: {
|
|
17
|
+
render: ({ description, phoneLabel, phoneNumber, workingHours, primaryButtonText, secondaryButtonText, secondaryButtonUrl }: TravelMiniCTAProps) => JSX.Element;
|
|
18
|
+
name: string;
|
|
19
|
+
args: {
|
|
20
|
+
description: string;
|
|
21
|
+
phoneLabel: string;
|
|
22
|
+
phoneNumber: string;
|
|
23
|
+
workingHours: string[];
|
|
24
|
+
primaryButtonText: string;
|
|
25
|
+
secondaryButtonText: string;
|
|
26
|
+
secondaryButtonUrl: string;
|
|
27
|
+
};
|
|
28
|
+
argTypes: {
|
|
29
|
+
description: {
|
|
30
|
+
control: {
|
|
31
|
+
type: string;
|
|
32
|
+
};
|
|
33
|
+
description: string;
|
|
34
|
+
};
|
|
35
|
+
phoneLabel: {
|
|
36
|
+
control: {
|
|
37
|
+
type: string;
|
|
38
|
+
};
|
|
39
|
+
description: string;
|
|
40
|
+
};
|
|
41
|
+
phoneNumber: {
|
|
42
|
+
control: {
|
|
43
|
+
type: string;
|
|
44
|
+
};
|
|
45
|
+
description: string;
|
|
46
|
+
};
|
|
47
|
+
workingHours: {
|
|
48
|
+
control: {
|
|
49
|
+
type: string;
|
|
50
|
+
};
|
|
51
|
+
description: string;
|
|
52
|
+
};
|
|
53
|
+
primaryButtonText: {
|
|
54
|
+
control: {
|
|
55
|
+
type: string;
|
|
56
|
+
};
|
|
57
|
+
description: string;
|
|
58
|
+
};
|
|
59
|
+
secondaryButtonText: {
|
|
60
|
+
control: {
|
|
61
|
+
type: string;
|
|
62
|
+
};
|
|
63
|
+
description: string;
|
|
64
|
+
};
|
|
65
|
+
secondaryButtonUrl: {
|
|
66
|
+
control: {
|
|
67
|
+
type: string;
|
|
68
|
+
};
|
|
69
|
+
description: string;
|
|
70
|
+
};
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
export declare const MinimalContent: {
|
|
74
|
+
render: ({ description, phoneLabel, phoneNumber, workingHours, primaryButtonText, secondaryButtonText, secondaryButtonUrl }: TravelMiniCTAProps) => JSX.Element;
|
|
75
|
+
name: string;
|
|
76
|
+
args: {
|
|
77
|
+
description: string;
|
|
78
|
+
phoneLabel: string;
|
|
79
|
+
phoneNumber: string;
|
|
80
|
+
primaryButtonText: string;
|
|
81
|
+
secondaryButtonText: string;
|
|
82
|
+
secondaryButtonUrl: string;
|
|
83
|
+
};
|
|
84
|
+
};
|
|
85
|
+
export declare const ExtendedWorkingHours: {
|
|
86
|
+
render: ({ description, phoneLabel, phoneNumber, workingHours, primaryButtonText, secondaryButtonText, secondaryButtonUrl }: TravelMiniCTAProps) => JSX.Element;
|
|
87
|
+
name: string;
|
|
88
|
+
args: {
|
|
89
|
+
description: string;
|
|
90
|
+
phoneLabel: string;
|
|
91
|
+
phoneNumber: string;
|
|
92
|
+
workingHours: string[];
|
|
93
|
+
primaryButtonText: string;
|
|
94
|
+
secondaryButtonText: string;
|
|
95
|
+
secondaryButtonUrl: string;
|
|
96
|
+
};
|
|
97
|
+
};
|
|
98
|
+
export declare const CustomDestination: {
|
|
99
|
+
render: ({ description, phoneLabel, phoneNumber, workingHours, primaryButtonText, secondaryButtonText, secondaryButtonUrl }: TravelMiniCTAProps) => JSX.Element;
|
|
100
|
+
name: string;
|
|
101
|
+
args: {
|
|
102
|
+
description: string;
|
|
103
|
+
phoneLabel: string;
|
|
104
|
+
phoneNumber: string;
|
|
105
|
+
workingHours: string[];
|
|
106
|
+
primaryButtonText: string;
|
|
107
|
+
secondaryButtonText: string;
|
|
108
|
+
secondaryButtonUrl: string;
|
|
109
|
+
};
|
|
110
|
+
};
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { TravelMiniCTA } from './index';
|
|
3
|
+
const TravelMiniCTAStory = ({ description, phoneLabel, phoneNumber, workingHours, primaryButtonText, secondaryButtonText, secondaryButtonUrl }) => {
|
|
4
|
+
return (React.createElement("div", { style: {
|
|
5
|
+
padding: '16px'
|
|
6
|
+
} },
|
|
7
|
+
React.createElement(TravelMiniCTA, { description: description, phoneLabel: phoneLabel, phoneNumber: phoneNumber, workingHours: workingHours, primaryButtonText: primaryButtonText, secondaryButtonText: secondaryButtonText, secondaryButtonUrl: secondaryButtonUrl })));
|
|
8
|
+
};
|
|
9
|
+
export default {
|
|
10
|
+
title: 'Typescript Component/Travel Mini CTA',
|
|
11
|
+
component: TravelMiniCTA,
|
|
12
|
+
parameters: {
|
|
13
|
+
docs: {
|
|
14
|
+
subtitle: 'The `TravelMiniCTA` component displays a call-to-action for travel services with contact information and action buttons.',
|
|
15
|
+
description: {
|
|
16
|
+
component: 'A responsive component that shows travel expert contact details, working hours, and primary/secondary action buttons. The layout adapts for mobile, tablet, and desktop viewports.'
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
export const Default = {
|
|
22
|
+
render: TravelMiniCTAStory,
|
|
23
|
+
name: 'Travel Mini CTA - Default',
|
|
24
|
+
args: {
|
|
25
|
+
description: 'Begin your journey to Croatia with a holiday designed around you, guided by a dedicated travel expert.',
|
|
26
|
+
phoneLabel: 'Call us on',
|
|
27
|
+
phoneNumber: '08083049757',
|
|
28
|
+
workingHours: ['Mon - Fri: 9am - 6pm', 'Sat: 10am - 5pm'],
|
|
29
|
+
primaryButtonText: 'Chat with us',
|
|
30
|
+
secondaryButtonText: 'Enquire now',
|
|
31
|
+
secondaryButtonUrl: '/enquire'
|
|
32
|
+
},
|
|
33
|
+
argTypes: {
|
|
34
|
+
description: {
|
|
35
|
+
control: {
|
|
36
|
+
type: 'text'
|
|
37
|
+
},
|
|
38
|
+
description: 'Main description text for the CTA'
|
|
39
|
+
},
|
|
40
|
+
phoneLabel: {
|
|
41
|
+
control: {
|
|
42
|
+
type: 'text'
|
|
43
|
+
},
|
|
44
|
+
description: 'Label text before the phone number'
|
|
45
|
+
},
|
|
46
|
+
phoneNumber: {
|
|
47
|
+
control: {
|
|
48
|
+
type: 'text'
|
|
49
|
+
},
|
|
50
|
+
description: 'Phone number for contact (creates tel: link)'
|
|
51
|
+
},
|
|
52
|
+
workingHours: {
|
|
53
|
+
control: {
|
|
54
|
+
type: 'object'
|
|
55
|
+
},
|
|
56
|
+
description: 'Array of working hours strings'
|
|
57
|
+
},
|
|
58
|
+
primaryButtonText: {
|
|
59
|
+
control: {
|
|
60
|
+
type: 'text'
|
|
61
|
+
},
|
|
62
|
+
description: 'Text for the primary action button'
|
|
63
|
+
},
|
|
64
|
+
secondaryButtonText: {
|
|
65
|
+
control: {
|
|
66
|
+
type: 'text'
|
|
67
|
+
},
|
|
68
|
+
description: 'Text for the secondary action button'
|
|
69
|
+
},
|
|
70
|
+
secondaryButtonUrl: {
|
|
71
|
+
control: {
|
|
72
|
+
type: 'text'
|
|
73
|
+
},
|
|
74
|
+
description: 'URL for the secondary button link'
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
export const MinimalContent = {
|
|
79
|
+
render: TravelMiniCTAStory,
|
|
80
|
+
name: 'Travel Mini CTA - Minimal',
|
|
81
|
+
args: {
|
|
82
|
+
description: 'Discover your perfect holiday with expert guidance.',
|
|
83
|
+
phoneLabel: 'Call us',
|
|
84
|
+
phoneNumber: '0800 123 4567',
|
|
85
|
+
primaryButtonText: 'Get started',
|
|
86
|
+
secondaryButtonText: 'Learn more',
|
|
87
|
+
secondaryButtonUrl: '/learn-more'
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
export const ExtendedWorkingHours = {
|
|
91
|
+
render: TravelMiniCTAStory,
|
|
92
|
+
name: 'Travel Mini CTA - Extended Hours',
|
|
93
|
+
args: {
|
|
94
|
+
description: 'Plan your dream vacation with our 24/7 travel concierge service.',
|
|
95
|
+
phoneLabel: 'Contact us on',
|
|
96
|
+
phoneNumber: '+44 20 1234 5678',
|
|
97
|
+
workingHours: [
|
|
98
|
+
'Mon - Thu: 8am - 8pm',
|
|
99
|
+
'Fri: 8am - 6pm',
|
|
100
|
+
'Sat: 9am - 5pm',
|
|
101
|
+
'Sun: 10am - 4pm'
|
|
102
|
+
],
|
|
103
|
+
primaryButtonText: 'Start chatting',
|
|
104
|
+
secondaryButtonText: 'View packages',
|
|
105
|
+
secondaryButtonUrl: '/packages'
|
|
106
|
+
}
|
|
107
|
+
};
|
|
108
|
+
export const CustomDestination = {
|
|
109
|
+
render: TravelMiniCTAStory,
|
|
110
|
+
name: 'Travel Mini CTA - Custom Description',
|
|
111
|
+
args: {
|
|
112
|
+
description: 'This is a placeholder for description.',
|
|
113
|
+
phoneLabel: 'Ring us on',
|
|
114
|
+
phoneNumber: '0808 1234567',
|
|
115
|
+
workingHours: ['Mon - Sat: 9am - 7pm', 'Sun: Closed'],
|
|
116
|
+
primaryButtonText: 'Talk to an expert',
|
|
117
|
+
secondaryButtonText: 'Request callback',
|
|
118
|
+
secondaryButtonUrl: '/callback'
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJhdmVsLW1pbmktY3RhLnN0b3JpZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy90cmF2ZWwtbWluaS1jdGEvdHJhdmVsLW1pbmktY3RhLnN0b3JpZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sU0FBUyxDQUFDO0FBR3hDLE1BQU0sa0JBQWtCLEdBQUcsQ0FBQyxFQUMxQixXQUFXLEVBQ1gsVUFBVSxFQUNWLFdBQVcsRUFDWCxZQUFZLEVBQ1osaUJBQWlCLEVBQ2pCLG1CQUFtQixFQUNuQixrQkFBa0IsRUFDQyxFQUFFLEVBQUU7SUFDdkIsT0FBTyxDQUNMLDZCQUNFLEtBQUssRUFBRTtZQUNMLE9BQU8sRUFBRSxNQUFNO1NBQ2hCO1FBRUQsb0JBQUMsYUFBYSxJQUNaLFdBQVcsRUFBRSxXQUFXLEVBQ3hCLFVBQVUsRUFBRSxVQUFVLEVBQ3RCLFdBQVcsRUFBRSxXQUFXLEVBQ3hCLFlBQVksRUFBRSxZQUFZLEVBQzFCLGlCQUFpQixFQUFFLGlCQUFpQixFQUNwQyxtQkFBbUIsRUFBRSxtQkFBbUIsRUFDeEMsa0JBQWtCLEVBQUUsa0JBQWtCLEdBQ3RDLENBQ0UsQ0FDUCxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsZUFBZTtJQUNiLEtBQUssRUFBRSxzQ0FBc0M7SUFDN0MsU0FBUyxFQUFFLGFBQWE7SUFDeEIsVUFBVSxFQUFFO1FBQ1YsSUFBSSxFQUFFO1lBQ0osUUFBUSxFQUNOLDBIQUEwSDtZQUM1SCxXQUFXLEVBQUU7Z0JBQ1gsU0FBUyxFQUNQLG9MQUFvTDthQUN2TDtTQUNGO0tBQ0Y7Q0FDRixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sT0FBTyxHQUFHO0lBQ3JCLE1BQU0sRUFBRSxrQkFBa0I7SUFDMUIsSUFBSSxFQUFFLDJCQUEyQjtJQUVqQyxJQUFJLEVBQUU7UUFDSixX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
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export {};
|
|
2
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy90cmF2ZWwtbWluaS1jdGEvdHlwZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9
|