yt-uikit 0.9.40 → 0.10.0
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/ActiveSessionOverlay.d.ts +8 -0
- package/dist/esm/components/Loyalty/BubbleLauncher.d.ts +13 -0
- package/dist/esm/components/Loyalty/GuestDesktop.d.ts +5 -0
- package/dist/esm/components/Loyalty/GuestDesktopWithoutImage.d.ts +7 -0
- package/dist/esm/components/Loyalty/GuestMobile.d.ts +6 -0
- package/dist/esm/components/Loyalty/LoyaltyProfile.d.ts +7 -0
- package/dist/esm/components/Loyalty/LoyaltyWidget.d.ts +6 -0
- package/dist/esm/components/Loyalty/OTPComponent.d.ts +20 -0
- package/dist/esm/components/Loyalty/PointEarnBadge.d.ts +16 -0
- package/dist/esm/components/Loyalty/RecentTransactions.d.ts +32 -0
- package/dist/esm/components/Loyalty/RewardsModal.d.ts +13 -0
- package/dist/esm/components/Loyalty/RibbonLauncher.d.ts +11 -0
- package/dist/esm/components/Loyalty/StickyLauncher.d.ts +13 -0
- package/dist/esm/components/Loyalty/StickyTextLauncher.d.ts +2 -0
- package/dist/esm/components/Loyalty/Toast.d.ts +7 -0
- package/dist/esm/components/Loyalty/VIPTiersScreen.d.ts +12 -0
- package/dist/esm/components/Loyalty/WTRCoupon.d.ts +13 -0
- package/dist/esm/components/Loyalty/WaysToEarn.d.ts +31 -0
- package/dist/esm/components/Loyalty/WaysToRedeem.d.ts +76 -0
- package/dist/esm/components/Loyalty/index.d.ts +5 -0
- package/dist/esm/components/Loyalty/loyaltyLauncher.d.ts +16 -0
- package/dist/esm/components/Loyalty/types.d.ts +396 -0
- package/dist/esm/components/index.d.ts +5 -0
- package/dist/esm/index.js +859 -859
- package/package.json +1 -1
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export default function BubbleLauncher({ textColor, backgroundColor, position, yOffsetValue, launcherTitle, borderColor, iconType, addVisibilityDelay, addAttentionWaves, onClick }: {
|
|
3
|
+
textColor?: string | undefined;
|
|
4
|
+
backgroundColor?: string | undefined;
|
|
5
|
+
position?: string | undefined;
|
|
6
|
+
yOffsetValue?: string | undefined;
|
|
7
|
+
launcherTitle?: string | undefined;
|
|
8
|
+
borderColor?: string | undefined;
|
|
9
|
+
iconType?: string | undefined;
|
|
10
|
+
addVisibilityDelay?: boolean | undefined;
|
|
11
|
+
addAttentionWaves?: boolean | undefined;
|
|
12
|
+
onClick?: (() => void) | undefined;
|
|
13
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./modal.css";
|
|
3
|
+
import { RewardsModalProps } from "./types";
|
|
4
|
+
import "react-international-phone/style.css";
|
|
5
|
+
export default function GuestDesktopWithoutImage({ config, }: {
|
|
6
|
+
config: RewardsModalProps;
|
|
7
|
+
}): React.JSX.Element | null;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./profile.css";
|
|
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, rediectUrl, ctaTitle, registerLink, brandTitle, heading, subcopy, termsHref, privacyHref, isLoading, userData, activityRewards, brandRewardProgram, onBirthdayUpdate, onSocialClick, countryCode, isMobilePreview, viewportMode }: LoyaltyProfileProps & RewardsModalProps & {
|
|
5
|
+
signedIn?: boolean;
|
|
6
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./modal.css";
|
|
3
|
+
export default function OtpStep({ phoneLabel, authType, email, length, onConfirm, onResend, onChangeNumber, setToast, loading, tone, themeBackgroundColor, themeAccentColor, themeTextColor, ctaPrimaryColor, ctaPrimaryContrastColor, countryCode, }: {
|
|
4
|
+
phoneLabel?: string | undefined;
|
|
5
|
+
authType: any;
|
|
6
|
+
email: any;
|
|
7
|
+
length?: number | undefined;
|
|
8
|
+
onConfirm: any;
|
|
9
|
+
onResend: any;
|
|
10
|
+
onChangeNumber: any;
|
|
11
|
+
setToast: any;
|
|
12
|
+
loading?: boolean | undefined;
|
|
13
|
+
tone?: string | undefined;
|
|
14
|
+
themeBackgroundColor: any;
|
|
15
|
+
themeAccentColor: any;
|
|
16
|
+
themeTextColor: any;
|
|
17
|
+
ctaPrimaryColor: any;
|
|
18
|
+
ctaPrimaryContrastColor: any;
|
|
19
|
+
countryCode: any;
|
|
20
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./PointEarnBadge.css";
|
|
3
|
+
export type PointEarnBadgeAlignment = "left" | "center" | "right";
|
|
4
|
+
export interface PointEarnBadgeProps {
|
|
5
|
+
prefix?: string;
|
|
6
|
+
iconUrl?: string;
|
|
7
|
+
suffix?: string;
|
|
8
|
+
coinsEarned?: number | string;
|
|
9
|
+
widgetBackground?: string;
|
|
10
|
+
alignment?: PointEarnBadgeAlignment;
|
|
11
|
+
textColor?: string;
|
|
12
|
+
borderColor?: string;
|
|
13
|
+
badgeRoundness?: string | number;
|
|
14
|
+
fontSize?: string | number;
|
|
15
|
+
}
|
|
16
|
+
export default function PointEarnBadge({ prefix, iconUrl, suffix, coinsEarned, widgetBackground, alignment, textColor, borderColor, badgeRoundness, fontSize, }: PointEarnBadgeProps): React.JSX.Element;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./RecentTransactions.css";
|
|
3
|
+
type TxKind = "earned" | "expired" | "availed";
|
|
4
|
+
type TxItem = {
|
|
5
|
+
id: string;
|
|
6
|
+
dateLabel: string;
|
|
7
|
+
title: string;
|
|
8
|
+
amount: string | number;
|
|
9
|
+
kind: TxKind;
|
|
10
|
+
meta?: string;
|
|
11
|
+
};
|
|
12
|
+
type MonthGroup = {
|
|
13
|
+
monthTitle: string;
|
|
14
|
+
items: TxItem[];
|
|
15
|
+
};
|
|
16
|
+
type PendingBanner = {
|
|
17
|
+
deltaLabel: string;
|
|
18
|
+
orderId?: string;
|
|
19
|
+
status?: string;
|
|
20
|
+
note?: string;
|
|
21
|
+
};
|
|
22
|
+
export default function TransactionHistory({ totals, pending, months, }: {
|
|
23
|
+
totals: {
|
|
24
|
+
saved: string;
|
|
25
|
+
earned: string;
|
|
26
|
+
available: string;
|
|
27
|
+
expired: string;
|
|
28
|
+
};
|
|
29
|
+
pending?: PendingBanner;
|
|
30
|
+
months: MonthGroup[];
|
|
31
|
+
}): React.JSX.Element;
|
|
32
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./modal.css";
|
|
3
|
+
import { RewardsModalProps } from "./types";
|
|
4
|
+
export declare const isEmailValid: (email: string) => boolean;
|
|
5
|
+
export declare const COUNTRY_PHONE_CODE_MAP: Record<string, string>;
|
|
6
|
+
export declare const COUNTRY_OPTIONS: {
|
|
7
|
+
cc: string;
|
|
8
|
+
value: string;
|
|
9
|
+
label: string;
|
|
10
|
+
}[];
|
|
11
|
+
export default function RewardsModal({ config }: {
|
|
12
|
+
config: RewardsModalProps;
|
|
13
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export default function RibbonLauncher({ textColor, backgroundColor, launcherTitle, offerTitle, borderColor, iconType, addVisibilityDelay, onClick, }: {
|
|
3
|
+
textColor?: string | undefined;
|
|
4
|
+
backgroundColor?: string | undefined;
|
|
5
|
+
launcherTitle?: string | undefined;
|
|
6
|
+
offerTitle?: string | undefined;
|
|
7
|
+
borderColor?: string | undefined;
|
|
8
|
+
iconType?: string | undefined;
|
|
9
|
+
addVisibilityDelay?: boolean | undefined;
|
|
10
|
+
onClick?: (() => void) | undefined;
|
|
11
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export default function StickyLauncher({ textColor, backgroundColor, position, yOffsetValue, launcherTitle, borderColor, iconType, addVisibilityDelay, addAttentionWaves, onClick, }: {
|
|
3
|
+
textColor?: string | undefined;
|
|
4
|
+
backgroundColor?: string | undefined;
|
|
5
|
+
position?: string | undefined;
|
|
6
|
+
yOffsetValue?: string | undefined;
|
|
7
|
+
launcherTitle?: string | undefined;
|
|
8
|
+
borderColor?: string | undefined;
|
|
9
|
+
iconType?: string | undefined;
|
|
10
|
+
addVisibilityDelay?: boolean | undefined;
|
|
11
|
+
addAttentionWaves?: boolean | undefined;
|
|
12
|
+
onClick?: (() => void) | undefined;
|
|
13
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./VIPTiers.css";
|
|
3
|
+
import { RewardTier, UserRewardTier } from "./types";
|
|
4
|
+
type VIPTiersScreenProps = {
|
|
5
|
+
onBack: () => void;
|
|
6
|
+
brandRewardTiers?: RewardTier[];
|
|
7
|
+
balanceCoins?: number | string;
|
|
8
|
+
userRewardTier?: UserRewardTier;
|
|
9
|
+
currencyCode?: string;
|
|
10
|
+
};
|
|
11
|
+
export default function VIPTiersScreen({ brandRewardTiers, balanceCoins, userRewardTier, currencyCode, }: VIPTiersScreenProps): React.JSX.Element;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export default function WTRCoupon({ couponHeading, couponCode, copyFunction, themePrimaryColor, themeContrastColor, themeSecondaryContrastColor, themeSecondaryColor, setScreenType, showCTA, borderRadius, }: {
|
|
3
|
+
couponHeading?: string | undefined;
|
|
4
|
+
couponCode?: string | undefined;
|
|
5
|
+
copyFunction?: ((code: string) => void) | undefined;
|
|
6
|
+
themePrimaryColor?: string | undefined;
|
|
7
|
+
themeContrastColor?: string | undefined;
|
|
8
|
+
themeSecondaryContrastColor?: string | undefined;
|
|
9
|
+
themeSecondaryColor?: string | undefined;
|
|
10
|
+
setScreenType?: ((type: string) => void) | undefined;
|
|
11
|
+
showCTA?: boolean | undefined;
|
|
12
|
+
borderRadius?: string | undefined;
|
|
13
|
+
}): React.JSX.Element;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./DobPopup.css";
|
|
3
|
+
import { BrandActivityRewardSettings, BrandRewardProgram, ReferralRewardDetails, UserData } from "./types";
|
|
4
|
+
type WaysToEarnProps = {
|
|
5
|
+
ctaPrimaryColor: string;
|
|
6
|
+
ctaContrastColor: string;
|
|
7
|
+
currencyCode?: string;
|
|
8
|
+
userData?: UserData;
|
|
9
|
+
activityRewards?: BrandActivityRewardSettings;
|
|
10
|
+
onBirthdayUpdate: (date: string) => Promise<boolean>;
|
|
11
|
+
onSocialClick: (url: string, type: string) => Promise<boolean>;
|
|
12
|
+
isLoading: boolean;
|
|
13
|
+
brandRewardProgram: BrandRewardProgram;
|
|
14
|
+
};
|
|
15
|
+
export default function WaysToEarn({ userData, ctaContrastColor, ctaPrimaryColor, currencyCode, activityRewards, onBirthdayUpdate, onSocialClick, isLoading, brandRewardProgram, }: WaysToEarnProps): JSX.Element;
|
|
16
|
+
export declare function formatReferralRewardValue(reward?: ReferralRewardDetails, coinName?: string, currencyCode?: string): string | null;
|
|
17
|
+
export declare function ReferralRewardTitle({ title, referrerReward, refereeReward, }: {
|
|
18
|
+
title?: string;
|
|
19
|
+
referrerReward?: string | null;
|
|
20
|
+
refereeReward?: string | null;
|
|
21
|
+
}): React.JSX.Element;
|
|
22
|
+
interface DOBPopupProps {
|
|
23
|
+
open: boolean;
|
|
24
|
+
value: string | null;
|
|
25
|
+
onSave: (dob: string) => void;
|
|
26
|
+
onClose: () => void;
|
|
27
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
28
|
+
isLoading: boolean;
|
|
29
|
+
}
|
|
30
|
+
export declare function DOBPopup({ open, value, onSave, onClose, onChange, isLoading, }: DOBPopupProps): React.JSX.Element | null;
|
|
31
|
+
export {};
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import "./WaysToRedeem.css";
|
|
3
|
+
import { CouponAvailResponse } from "./types";
|
|
4
|
+
export interface IdsActive {
|
|
5
|
+
ids: number[];
|
|
6
|
+
active: boolean;
|
|
7
|
+
}
|
|
8
|
+
export interface IdsOnly {
|
|
9
|
+
ids: number[];
|
|
10
|
+
}
|
|
11
|
+
export interface ProductIds {
|
|
12
|
+
ids: number[];
|
|
13
|
+
active: boolean;
|
|
14
|
+
products: any[];
|
|
15
|
+
}
|
|
16
|
+
export interface AllowedProducts {
|
|
17
|
+
products: any[];
|
|
18
|
+
}
|
|
19
|
+
export interface CouponTemplate {
|
|
20
|
+
couponTemplateId: number;
|
|
21
|
+
name: string;
|
|
22
|
+
couponType: string;
|
|
23
|
+
discountPercentage: number;
|
|
24
|
+
discountValue: number;
|
|
25
|
+
minimumOrderValue: number;
|
|
26
|
+
pointsRequired: number;
|
|
27
|
+
createdAt: string;
|
|
28
|
+
updatedAt: string;
|
|
29
|
+
brandId: number;
|
|
30
|
+
expiresInMinutes: number;
|
|
31
|
+
couponTemplateConsumer: string;
|
|
32
|
+
quantityThreshold: number;
|
|
33
|
+
isActive: boolean;
|
|
34
|
+
combinesWithOrderDiscount: boolean;
|
|
35
|
+
combinesWithProductDiscount: boolean;
|
|
36
|
+
combinesWithShippingDiscount: boolean;
|
|
37
|
+
isDummyCouponTemplate: boolean;
|
|
38
|
+
customerBuysCollectionIds: IdsActive;
|
|
39
|
+
customerBuysProductIds: IdsActive;
|
|
40
|
+
customerGetsCollectionIds: IdsActive;
|
|
41
|
+
customerGetsProductIds: ProductIds;
|
|
42
|
+
automaticBXGYDiscount: boolean;
|
|
43
|
+
automaticBXGYDiscountId: number | null;
|
|
44
|
+
allowedCollections: IdsOnly;
|
|
45
|
+
excludedCollections: IdsOnly;
|
|
46
|
+
allowedProducts: AllowedProducts;
|
|
47
|
+
combinesWithOtherFreebies: boolean;
|
|
48
|
+
autoAddEnabled: boolean;
|
|
49
|
+
percentageOffOnCustomerGetsProducts: number | null;
|
|
50
|
+
customCartProgressBarCriteria: string;
|
|
51
|
+
discountId: number | null;
|
|
52
|
+
limitFreebieQuantity: number;
|
|
53
|
+
hideFromSEO: boolean;
|
|
54
|
+
freebieType: string | null;
|
|
55
|
+
startDate: string | null;
|
|
56
|
+
endDate: string | null;
|
|
57
|
+
scheduleIds: number[] | null;
|
|
58
|
+
scheduleType: string;
|
|
59
|
+
maxFreebiesInTier: number;
|
|
60
|
+
__entity: string;
|
|
61
|
+
}
|
|
62
|
+
export interface WaysToRedeemProps {
|
|
63
|
+
couponList?: CouponTemplate[];
|
|
64
|
+
couponHeading?: string;
|
|
65
|
+
couponCode?: string;
|
|
66
|
+
onCouponAvail: (couponTemplateId: number) => Promise<CouponAvailResponse>;
|
|
67
|
+
copyFunction?: (code: string) => void;
|
|
68
|
+
themeSecondaryContrastColor?: string;
|
|
69
|
+
themeSecondaryColor?: string;
|
|
70
|
+
themeBackgroundColor?: string;
|
|
71
|
+
setScreenType?: (type: string) => void;
|
|
72
|
+
showCTA?: boolean;
|
|
73
|
+
balanceCoins: number;
|
|
74
|
+
ctaBorderRadius?: string;
|
|
75
|
+
}
|
|
76
|
+
export default function WaysToRedeem({ couponList, couponHeading, couponCode, onCouponAvail, copyFunction, themeSecondaryContrastColor, themeSecondaryColor, themeBackgroundColor, setScreenType, showCTA, balanceCoins, ctaBorderRadius, }: WaysToRedeemProps): JSX.Element;
|
|
@@ -1,2 +1,7 @@
|
|
|
1
|
+
export { default as LoyaltyProfile } from "./LoyaltyProfile";
|
|
2
|
+
export { default as LoyaltyLauncher } from "./loyaltyLauncher";
|
|
3
|
+
export { default as RewardsModal } from "./RewardsModal";
|
|
4
|
+
export { default as LoyaltyWidget } from "./LoyaltyWidget";
|
|
1
5
|
export { default as LoyaltyProductCatalog } from "./LoyaltyProductCatalog";
|
|
6
|
+
export { default as PointEarnBadge } from "./PointEarnBadge";
|
|
2
7
|
export type { LoyaltyProductCatalogConfig, LoyaltyCatalogProduct, LoyaltyCatalogTier, LoyaltyCatalogFilter, CatalogDisplayMode, CatalogTextAlignment, } from "./LoyaltyProductCatalog";
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./launcher.css";
|
|
3
|
+
export default function LoyaltyLauncher({ launcherType, textColor, backgroundColor, position, yOffsetValue, launcherTitle, offerTitle, borderColor, iconType, addVisibilityDelay, addAttentionWaves, onClick }: {
|
|
4
|
+
launcherType?: string;
|
|
5
|
+
textColor?: string;
|
|
6
|
+
backgroundColor?: string;
|
|
7
|
+
position?: string;
|
|
8
|
+
yOffsetValue?: string | number;
|
|
9
|
+
launcherTitle?: string;
|
|
10
|
+
offerTitle?: string;
|
|
11
|
+
borderColor?: string;
|
|
12
|
+
iconType?: string;
|
|
13
|
+
addVisibilityDelay?: boolean;
|
|
14
|
+
addAttentionWaves?: boolean;
|
|
15
|
+
onClick?: () => void;
|
|
16
|
+
}): React.JSX.Element;
|