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.
@@ -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,5 +1,5 @@
1
1
  import React from "react";
2
- import "./modal.css";
2
+ import "./styles";
3
3
  import { RewardsModalProps } from "./types";
4
4
  import "react-international-phone/style.css";
5
5
  export default function GuestDesktopWithoutImage({ config, }: {
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import "./modal.css";
2
+ import "./styles";
3
3
  import { RewardsModalProps } from "./types";
4
4
  export default function GuestMobile({ config }: {
5
5
  config: RewardsModalProps;
@@ -1,7 +1,6 @@
1
1
  import React from "react";
2
2
  import { LoyaltyProfileProps } from "./types";
3
- import "./profile.css";
4
- import "./fonts.css";
3
+ import "./styles";
5
4
  export default function LoyaltyProfile({ config, }: {
6
5
  config: LoyaltyProfileProps;
7
6
  }): React.JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
- import "./profile.css";
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 "./modal.css";
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,5 +1,5 @@
1
1
  import React from "react";
2
- import "./modal.css";
2
+ import "./styles";
3
3
  import { RewardsModalProps } from "./types";
4
4
  export declare const isEmailValid: (email: string) => boolean;
5
5
  export declare const COUNTRY_PHONE_CODE_MAP: Record<string, string>;
@@ -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 "./launcher.css";
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;