yt-uikit 0.10.52 → 0.10.53
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/esm/components/Loyalty/BubbleLauncher.d.ts +2 -1
- package/dist/esm/components/Loyalty/GuestDesktopWithoutImage.d.ts +1 -1
- package/dist/esm/components/Loyalty/GuestMobile.d.ts +1 -1
- package/dist/esm/components/Loyalty/LoyaltyProfile.d.ts +1 -2
- package/dist/esm/components/Loyalty/LoyaltyWidget.d.ts +2 -2
- package/dist/esm/components/Loyalty/OTPComponent.d.ts +1 -1
- package/dist/esm/components/Loyalty/RewardsModal.d.ts +1 -1
- package/dist/esm/components/Loyalty/RibbonLauncher.d.ts +2 -1
- package/dist/esm/components/Loyalty/StickyLauncher.d.ts +2 -1
- package/dist/esm/components/Loyalty/WaysToEarn.d.ts +2 -1
- package/dist/esm/components/Loyalty/WaysToRedeem.d.ts +30 -2
- package/dist/esm/components/Loyalty/loyaltyLauncher.d.ts +5 -2
- package/dist/esm/components/Loyalty/styles.d.ts +23 -0
- package/dist/esm/components/Loyalty/types.d.ts +11 -1
- package/dist/esm/components/LoyaltyPageBlock/LoyaltyPageBlock.d.ts +2 -0
- package/dist/esm/index.js +440 -440
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
export default function BubbleLauncher({ textColor, backgroundColor, position, yOffsetValue, launcherTitle, borderColor, iconType, addVisibilityDelay, addAttentionWaves, onClick }: {
|
|
2
|
+
export default function BubbleLauncher({ textColor, backgroundColor, position, yOffsetValue, launcherTitle, borderColor, iconType, launcherIcon, addVisibilityDelay, addAttentionWaves, onClick, }: {
|
|
3
3
|
textColor?: string | undefined;
|
|
4
4
|
backgroundColor?: string | undefined;
|
|
5
5
|
position?: string | undefined;
|
|
@@ -7,6 +7,7 @@ export default function BubbleLauncher({ textColor, backgroundColor, position, y
|
|
|
7
7
|
launcherTitle?: string | undefined;
|
|
8
8
|
borderColor?: string | undefined;
|
|
9
9
|
iconType?: string | undefined;
|
|
10
|
+
launcherIcon?: string | undefined;
|
|
10
11
|
addVisibilityDelay?: boolean | undefined;
|
|
11
12
|
addAttentionWaves?: boolean | undefined;
|
|
12
13
|
onClick?: (() => void) | undefined;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import "./
|
|
2
|
+
import "./styles";
|
|
3
3
|
import { LoyaltyProfileProps, RewardsModalProps } from "./types";
|
|
4
|
-
export default function LoyaltyWidget({ signedIn, previewMode, bannerBackground, bannerBackgroundType, bannerImage, bannerTextColor, themePrimaryColor, themeContrastColor, themeSecondaryColor, themeSecondaryContrastColor, themeBackgroundColor, themeTextColor, themeAccentColor, widgetOpen, widgetPosition, guestWidgetImage, widgetRoundedCorners, ctaMainColor, ctaMainContrastColor, ctaPrimaryColor, ctaPrimaryContrastColor, ctaBorderColor, ctaSecondaryColor, ctaSecondaryContrastColor, ctaShowIcon, ctaBorderRadius, showWaysToEarn, showWCoinValue, showReferral, showTransactions, showVipSection, brandName, brandLogoUrl, headingEyebrow, balanceCoins, maxRedeemableCoins, coinValInr, currencyCode, tokenName, rateTitle, rateSub, couponHeading, couponCode, couponList, onCouponAvail, couponImage, referralLink, userRewardTier, brandRewardTiers, watermarkColor, bannerTextAlignment, showWatermark, showLogo, logourl, guestGreeting, userGreeting, existingUserGreeting, phone, email, emailRequired, onPhoneChange, onEmailChange, validatePhone, setEmailRequired, onClose, onRegister, onLogout, handleChangeNumber, handleResendOtp, handleSessionDetected, onSendOTP, isSessionDetected, authType, formFilled, redirectUrl, ctaTitle, registerLink, brandTitle, heading, subcopy, termsHref, privacyHref, isLoading, userData, activityRewards, brandRewardProgram, recentTransactionsData, onBirthdayUpdate, onSocialClick, countryCode, isMobilePreview, viewportMode }: LoyaltyProfileProps & RewardsModalProps & {
|
|
4
|
+
export default function LoyaltyWidget({ signedIn, previewMode, bannerBackground, bannerBackgroundType, bannerImage, bannerTextColor, themePrimaryColor, themeContrastColor, themeSecondaryColor, themeSecondaryContrastColor, themeBackgroundColor, themeTextColor, themeAccentColor, widgetOpen, widgetPosition, guestWidgetImage, widgetRoundedCorners, ctaMainColor, ctaMainContrastColor, ctaPrimaryColor, ctaPrimaryContrastColor, ctaBorderColor, ctaSecondaryColor, ctaSecondaryContrastColor, ctaShowIcon, ctaBorderRadius, showWaysToEarn, showWaysToRedeem, showWCoinValue, showReferral, showTransactions, showVipSection, brandName, brandLogoUrl, headingEyebrow, balanceCoins, maxRedeemableCoins, redemptionMovRequired, coinValInr, coinIcon, currencyCode, tokenName, rateTitle, rateSub, couponHeading, couponCode, couponList, freebies, onCouponAvail, couponImage, referralLink, userRewardTier, brandRewardTiers, watermarkColor, bannerTextAlignment, showWatermark, showLogo, logourl, guestGreeting, userGreeting, existingUserGreeting, phone, email, emailRequired, onPhoneChange, onEmailChange, validatePhone, setEmailRequired, onClose, onRegister, onLogout, handleChangeNumber, handleResendOtp, handleSessionDetected, onSendOTP, isSessionDetected, authType, formFilled, redirectUrl, ctaTitle, registerLink, brandTitle, heading, subcopy, termsHref, privacyHref, isLoading, userData, activityRewards, brandRewardProgram, recentTransactionsData, customCss, enableCustomCss, onBirthdayUpdate, onSocialClick, onFeedbackRewardClick, countryCode, isMobilePreview, viewportMode }: LoyaltyProfileProps & RewardsModalProps & {
|
|
5
5
|
signedIn?: boolean;
|
|
6
6
|
}): React.JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import "./
|
|
2
|
+
import "./styles";
|
|
3
3
|
export default function OtpStep({ phoneLabel, authType, email, length, onConfirm, onResend, onChangeNumber, setToast, loading, tone, themeBackgroundColor, themeAccentColor, themeTextColor, ctaPrimaryColor, ctaPrimaryContrastColor, countryCode, }: {
|
|
4
4
|
phoneLabel?: string | undefined;
|
|
5
5
|
authType: any;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
export default function RibbonLauncher({ textColor, backgroundColor, launcherTitle, offerTitle, borderColor, iconType, addVisibilityDelay, onClick, }: {
|
|
2
|
+
export default function RibbonLauncher({ textColor, backgroundColor, launcherTitle, offerTitle, borderColor, iconType, launcherIcon, addVisibilityDelay, onClick, }: {
|
|
3
3
|
textColor?: string | undefined;
|
|
4
4
|
backgroundColor?: string | undefined;
|
|
5
5
|
launcherTitle?: string | undefined;
|
|
6
6
|
offerTitle?: string | undefined;
|
|
7
7
|
borderColor?: string | undefined;
|
|
8
8
|
iconType?: string | undefined;
|
|
9
|
+
launcherIcon?: string | undefined;
|
|
9
10
|
addVisibilityDelay?: boolean | undefined;
|
|
10
11
|
onClick?: (() => void) | undefined;
|
|
11
12
|
}): React.JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
export default function StickyLauncher({ textColor, backgroundColor, position, yOffsetValue, launcherTitle, borderColor, iconType, addVisibilityDelay, addAttentionWaves, onClick, }: {
|
|
2
|
+
export default function StickyLauncher({ textColor, backgroundColor, position, yOffsetValue, launcherTitle, borderColor, iconType, launcherIcon, addVisibilityDelay, addAttentionWaves, onClick, }: {
|
|
3
3
|
textColor?: string | undefined;
|
|
4
4
|
backgroundColor?: string | undefined;
|
|
5
5
|
position?: string | undefined;
|
|
@@ -7,6 +7,7 @@ export default function StickyLauncher({ textColor, backgroundColor, position, y
|
|
|
7
7
|
launcherTitle?: string | undefined;
|
|
8
8
|
borderColor?: string | undefined;
|
|
9
9
|
iconType?: string | undefined;
|
|
10
|
+
launcherIcon?: string | undefined;
|
|
10
11
|
addVisibilityDelay?: boolean | undefined;
|
|
11
12
|
addAttentionWaves?: boolean | undefined;
|
|
12
13
|
onClick?: (() => void) | undefined;
|
|
@@ -10,10 +10,11 @@ type WaysToEarnProps = {
|
|
|
10
10
|
activityRewards?: BrandActivityRewardSettings;
|
|
11
11
|
onBirthdayUpdate: (date: string) => Promise<boolean>;
|
|
12
12
|
onSocialClick: (url: string, type: string) => Promise<boolean>;
|
|
13
|
+
onFeedbackRewardClick?: (url: string, type?: "feedback" | "image_feedback") => Promise<boolean>;
|
|
13
14
|
isLoading: boolean;
|
|
14
15
|
brandRewardProgram: BrandRewardProgram;
|
|
15
16
|
};
|
|
16
|
-
export default function WaysToEarn({ userData, ctaContrastColor, ctaPrimaryColor, currencyCode, activityRewards, onBirthdayUpdate, onSocialClick, isLoading, brandRewardProgram, }: WaysToEarnProps): JSX.Element;
|
|
17
|
+
export default function WaysToEarn({ userData, ctaContrastColor, ctaPrimaryColor, currencyCode, activityRewards, onBirthdayUpdate, onSocialClick, onFeedbackRewardClick, isLoading, brandRewardProgram, }: WaysToEarnProps): JSX.Element;
|
|
17
18
|
export declare function formatReferralRewardValue(reward?: ReferralRewardDetails, coinName?: string, currencyCode?: string): string | null;
|
|
18
19
|
export declare function ReferralRewardTitle({ title, referrerReward, refereeReward, }: {
|
|
19
20
|
title?: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { CouponAvailResponse } from "./types";
|
|
2
|
+
import { BrandRewardProgram, CouponAvailResponse, RewardTier, UserRewardTier } from "./types";
|
|
3
3
|
import "./WaysToRedeem.css";
|
|
4
4
|
import "./styles/shared.css";
|
|
5
5
|
export interface IdsActive {
|
|
@@ -53,6 +53,9 @@ export interface CouponTemplate {
|
|
|
53
53
|
limitFreebieQuantity: number;
|
|
54
54
|
hideFromSEO: boolean;
|
|
55
55
|
freebieType: string | null;
|
|
56
|
+
oneTimeClaim?: boolean;
|
|
57
|
+
restrictTo?: "none" | "tier";
|
|
58
|
+
rewardTierIds?: number[];
|
|
56
59
|
startDate: string | null;
|
|
57
60
|
endDate: string | null;
|
|
58
61
|
scheduleIds: number[] | null;
|
|
@@ -60,8 +63,29 @@ export interface CouponTemplate {
|
|
|
60
63
|
maxFreebiesInTier: number;
|
|
61
64
|
__entity: string;
|
|
62
65
|
}
|
|
66
|
+
export interface FreebieProduct {
|
|
67
|
+
image?: string;
|
|
68
|
+
title?: string;
|
|
69
|
+
productId?: string;
|
|
70
|
+
variantId?: string;
|
|
71
|
+
}
|
|
72
|
+
export interface FreebieCouponTemplate {
|
|
73
|
+
couponTemplateId: number;
|
|
74
|
+
name: string;
|
|
75
|
+
pointsRequired: number;
|
|
76
|
+
restrictTo: "none" | "tier";
|
|
77
|
+
rewardTierIds: number[];
|
|
78
|
+
minimumOrderValue: number;
|
|
79
|
+
}
|
|
80
|
+
export interface FreebieItem {
|
|
81
|
+
isActive: boolean;
|
|
82
|
+
discountCode?: string;
|
|
83
|
+
couponTemplate: FreebieCouponTemplate;
|
|
84
|
+
product: FreebieProduct;
|
|
85
|
+
}
|
|
63
86
|
export interface WaysToRedeemProps {
|
|
64
87
|
couponList?: CouponTemplate[];
|
|
88
|
+
freebies?: FreebieItem[];
|
|
65
89
|
couponHeading?: string;
|
|
66
90
|
couponCode?: string;
|
|
67
91
|
currencyCode?: string;
|
|
@@ -74,5 +98,9 @@ export interface WaysToRedeemProps {
|
|
|
74
98
|
showCTA?: boolean;
|
|
75
99
|
balanceCoins: number;
|
|
76
100
|
ctaBorderRadius?: string;
|
|
101
|
+
brandRewardProgram?: BrandRewardProgram;
|
|
102
|
+
redemptionMovRequired?: number | string;
|
|
103
|
+
userRewardTier?: UserRewardTier;
|
|
104
|
+
brandRewardTiers?: RewardTier[];
|
|
77
105
|
}
|
|
78
|
-
export default function WaysToRedeem({ couponList, couponHeading, couponCode, currencyCode, onCouponAvail, copyFunction, themeSecondaryContrastColor, themeSecondaryColor, themeBackgroundColor, setScreenType, showCTA, balanceCoins, ctaBorderRadius, }: WaysToRedeemProps): JSX.Element;
|
|
106
|
+
export default function WaysToRedeem({ couponList, freebies, couponHeading, couponCode, currencyCode, onCouponAvail, copyFunction, themeSecondaryContrastColor, themeSecondaryColor, themeBackgroundColor, setScreenType, showCTA, balanceCoins, ctaBorderRadius, brandRewardProgram, redemptionMovRequired, userRewardTier, brandRewardTiers, }: WaysToRedeemProps): JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import "./
|
|
3
|
-
export default function LoyaltyLauncher({ launcherType, textColor, backgroundColor, position, yOffsetValue, launcherTitle, offerTitle, borderColor, iconType, addVisibilityDelay, addAttentionWaves, onClick }: {
|
|
2
|
+
import "./styles";
|
|
3
|
+
export default function LoyaltyLauncher({ launcherType, textColor, backgroundColor, position, yOffsetValue, launcherTitle, offerTitle, borderColor, iconType, launcherIcon, addVisibilityDelay, addAttentionWaves, customCss, enableCustomCss, onClick }: {
|
|
4
4
|
launcherType?: string;
|
|
5
5
|
textColor?: string;
|
|
6
6
|
backgroundColor?: string;
|
|
@@ -10,7 +10,10 @@ export default function LoyaltyLauncher({ launcherType, textColor, backgroundCol
|
|
|
10
10
|
offerTitle?: string;
|
|
11
11
|
borderColor?: string;
|
|
12
12
|
iconType?: string;
|
|
13
|
+
launcherIcon?: string;
|
|
13
14
|
addVisibilityDelay?: boolean;
|
|
14
15
|
addAttentionWaves?: boolean;
|
|
16
|
+
customCss?: string;
|
|
17
|
+
enableCustomCss?: boolean;
|
|
15
18
|
onClick?: () => void;
|
|
16
19
|
}): React.JSX.Element;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Single stylesheet loader for the Loyalty widget.
|
|
3
|
+
*
|
|
4
|
+
* All Loyalty CSS is imported here, ONCE, in cascade order (reset first).
|
|
5
|
+
* Every Loyalty entry component imports THIS module instead of importing the
|
|
6
|
+
* `.css` files directly.
|
|
7
|
+
*
|
|
8
|
+
* Why: ES modules are singletons, so importing this module from many
|
|
9
|
+
* components still evaluates it once — each stylesheet is injected exactly
|
|
10
|
+
* once. Previously reset/modal/profile were imported in many component files
|
|
11
|
+
* and `rollup-plugin-postcss` injected a duplicate `<style>` per import site
|
|
12
|
+
* (e.g. 3–4 copies of the same CSS on the page). Routing every import through
|
|
13
|
+
* this one module collapses that to a single injection per stylesheet.
|
|
14
|
+
*
|
|
15
|
+
* IMPORTANT:
|
|
16
|
+
* - Keep `reset.css` first (see the header in reset.css for why order matters).
|
|
17
|
+
* - Do NOT import any of these `.css` files anywhere else — import "./styles".
|
|
18
|
+
*/
|
|
19
|
+
import "./reset.css";
|
|
20
|
+
import "./fonts.css";
|
|
21
|
+
import "./launcher.css";
|
|
22
|
+
import "./modal.css";
|
|
23
|
+
import "./profile.css";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CouponTemplate } from "./WaysToRedeem";
|
|
1
|
+
import { CouponTemplate, FreebieItem } from "./WaysToRedeem";
|
|
2
2
|
export interface LoyaltyProfileProps {
|
|
3
3
|
isMobile?: boolean;
|
|
4
4
|
previewMode?: boolean;
|
|
@@ -27,6 +27,7 @@ export interface LoyaltyProfileProps {
|
|
|
27
27
|
ctaShowIcon?: boolean;
|
|
28
28
|
ctaBorderRadius?: string;
|
|
29
29
|
showWaysToEarn?: boolean;
|
|
30
|
+
showWaysToRedeem?: boolean;
|
|
30
31
|
showWCoinValue?: boolean;
|
|
31
32
|
showReferral?: boolean;
|
|
32
33
|
showTransactions?: boolean;
|
|
@@ -37,7 +38,9 @@ export interface LoyaltyProfileProps {
|
|
|
37
38
|
userGreeting?: string;
|
|
38
39
|
balanceCoins?: number | string;
|
|
39
40
|
maxRedeemableCoins?: number | string;
|
|
41
|
+
redemptionMovRequired?: number | string;
|
|
40
42
|
coinValInr?: number | string;
|
|
43
|
+
coinIcon?: string;
|
|
41
44
|
currencyCode?: string;
|
|
42
45
|
tokenName?: string;
|
|
43
46
|
brandLogoUrl?: string;
|
|
@@ -48,6 +51,7 @@ export interface LoyaltyProfileProps {
|
|
|
48
51
|
couponImage?: string;
|
|
49
52
|
onCouponAvail: (couponTemplateId: number) => Promise<CouponAvailResponse>;
|
|
50
53
|
couponList?: CouponTemplate[];
|
|
54
|
+
freebies?: FreebieItem[];
|
|
51
55
|
referralLink?: string;
|
|
52
56
|
userRewardTier?: UserRewardTier;
|
|
53
57
|
brandRewardTiers?: RewardTier[];
|
|
@@ -55,8 +59,11 @@ export interface LoyaltyProfileProps {
|
|
|
55
59
|
activityRewards?: BrandActivityRewardSettings;
|
|
56
60
|
brandRewardProgram: BrandRewardProgram;
|
|
57
61
|
recentTransactionsData?: RecentTransactionsData;
|
|
62
|
+
customCss?: string;
|
|
63
|
+
enableCustomCss?: boolean;
|
|
58
64
|
onBirthdayUpdate: (date: string) => Promise<boolean>;
|
|
59
65
|
onSocialClick: (url: string, type: string) => Promise<boolean>;
|
|
66
|
+
onFeedbackRewardClick?: (url: string, type?: "feedback" | "image_feedback") => Promise<boolean>;
|
|
60
67
|
isLoading: boolean;
|
|
61
68
|
onWaysToRedeem?: () => void;
|
|
62
69
|
onClose?: () => void;
|
|
@@ -222,6 +229,8 @@ export interface BrandRewardProgram {
|
|
|
222
229
|
redemptionIcon: string;
|
|
223
230
|
redemptionMaxPoints: number;
|
|
224
231
|
redemptionMovRequired: number;
|
|
232
|
+
redemptionMinimumOrderValue?: number;
|
|
233
|
+
redemptionMinimumOrderValueStatus?: boolean;
|
|
225
234
|
redemptionCodeCombination: boolean;
|
|
226
235
|
orderRewardCreditReversal: boolean;
|
|
227
236
|
orderRewardRedemtionReversal: boolean;
|
|
@@ -276,6 +285,7 @@ export interface BrandActivityRewardSettings {
|
|
|
276
285
|
creditOnFirstOrderValue: number | null;
|
|
277
286
|
creditOnSecondOrderValue: number | null;
|
|
278
287
|
creditOnFeedbackValue: number | null;
|
|
288
|
+
creditOnImageFeedbackValue?: number | null;
|
|
279
289
|
creditOnBirthdayValue: number | null;
|
|
280
290
|
creditOnInstagramFollowValue: number | null;
|
|
281
291
|
creditOnInstagramShareValue: number | null;
|
|
@@ -143,6 +143,8 @@ export interface LoyaltyPageConfigType {
|
|
|
143
143
|
primaryContrastColor?: string;
|
|
144
144
|
secondaryColor?: string;
|
|
145
145
|
secondaryContrastColor?: string;
|
|
146
|
+
customCss?: string;
|
|
147
|
+
enableCustomCss?: boolean;
|
|
146
148
|
}
|
|
147
149
|
export interface LoyaltyPageProps {
|
|
148
150
|
config: LoyaltyPageConfigType;
|