@wlloyalty/wll-react-sdk 1.8.1 → 1.10.0

package/dist/index.d.ts

@@ -4,52 +4,6 @@ import * as LucideReactIcons from 'lucide-react';
 import * as react_native from 'react-native';
 import { ViewProps, ImageSourcePropType, StyleProp, TextProps as TextProps$1, TextStyle, ViewStyle, ImageProps, AccessibilityRole, RefreshControl } from 'react-native';
 
-declare const sizes: {
-    readonly borderRadiusSm: 15;
-    readonly borderRadiusLg: 20;
-    readonly borderRadiusButton: 9;
-    readonly borderRadiusRounded: 9999;
-    readonly xxxs: 4;
-    readonly xxs: 8;
-    readonly xs: 10;
-    readonly sm: 12;
-    readonly md: 14;
-    readonly lg: 16;
-    readonly xl: 20;
-    readonly xxl: 24;
-    readonly xxxl: 32;
-    readonly xxxxl: 40;
-    readonly xxxxxl: 60;
-};
-declare const commonStyles: {
-    emptyContainer: {
-        flex: number;
-        justifyContent: "center";
-        alignItems: "center";
-    };
-};
-declare const defaultTheme: BaseThemeObject;
-/**
- * Creates appropriate directional margin styles for both web and native platforms.
- * Handles RTL layouts correctly across platforms by using the I18nManager.
- *
- * @param value - The margin value to apply
- * @returns An object with the appropriate margin style property
- */
-declare const getDirectionalMargin: (value: number) => {
-    marginLeft: number;
-    marginRight?: undefined;
-    marginEnd?: undefined;
-} | {
-    marginRight: number;
-    marginLeft?: undefined;
-    marginEnd?: undefined;
-} | {
-    marginEnd: number;
-    marginLeft?: undefined;
-    marginRight?: undefined;
-};
-
 /**
  * Adds optional children to any component props.
  */
@@ -316,6 +270,23 @@ type DerivedColors = {
     [K in PercentageKey]: string;
 };
 type DesaturationType = BadgeTileType.Specific | BadgeTileType.Latest;
+type Sizes = {
+    borderRadiusSm: number;
+    borderRadiusLg: number;
+    borderRadiusButton: number;
+    borderRadiusRounded: number;
+    xxxs: number;
+    xxs: number;
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+    xxl: number;
+    xxxl: number;
+    xxxxl: number;
+    xxxxxl: number;
+};
 type BaseThemeObject = {
     fontFamily: string;
     accent: string;
@@ -329,6 +300,7 @@ type BaseThemeObject = {
     surface: string;
     surfaceText: string;
     text: string;
+    sizes?: Partial<Sizes>;
 };
 type DerivedProperties = {
     accentText: string;
@@ -342,7 +314,7 @@ type DerivedProperties = {
     alphaDerivedText: DerivedColors;
 };
 type ThemeObject = BaseThemeObject & DerivedProperties & {
-    readonly sizes: typeof sizes;
+    sizes: Sizes;
 };
 type ThemeContextType = {
     theme: ThemeObject;
@@ -909,6 +881,52 @@ declare const useGetGroupByID: (config: SDKConfig) => (id: string) => Promise<AP
 declare const useGetSectionByID: (config: SDKConfig) => (id: string) => Promise<APIResponse<unknown>>;
 declare const useGetTileByID: (config: SDKConfig) => (id: string) => Promise<APIResponse<unknown>>;
 
+declare const sizes: {
+    readonly borderRadiusSm: 15;
+    readonly borderRadiusLg: 20;
+    readonly borderRadiusButton: 9;
+    readonly borderRadiusRounded: 9999;
+    readonly xxxs: 4;
+    readonly xxs: 8;
+    readonly xs: 10;
+    readonly sm: 12;
+    readonly md: 14;
+    readonly lg: 16;
+    readonly xl: 20;
+    readonly xxl: 24;
+    readonly xxxl: 32;
+    readonly xxxxl: 40;
+    readonly xxxxxl: 60;
+};
+declare const commonStyles: {
+    emptyContainer: {
+        flex: number;
+        justifyContent: "center";
+        alignItems: "center";
+    };
+};
+declare const defaultTheme: BaseThemeObject;
+/**
+ * Creates appropriate directional margin styles for both web and native platforms.
+ * Handles RTL layouts correctly across platforms by using the I18nManager.
+ *
+ * @param value - The margin value to apply
+ * @returns An object with the appropriate margin style property
+ */
+declare const getDirectionalMargin: (value: number) => {
+    marginLeft: number;
+    marginRight?: undefined;
+    marginEnd?: undefined;
+} | {
+    marginRight: number;
+    marginLeft?: undefined;
+    marginEnd?: undefined;
+} | {
+    marginEnd: number;
+    marginLeft?: undefined;
+    marginRight?: undefined;
+};
+
 type ThemeName = 'default' | 'dark' | 'modern' | 'warm' | 'forest' | 'sunset';
 declare const themes: Record<ThemeName, BaseThemeObject>;
 declare const themeItems: Array<{
@@ -1029,4 +1047,4 @@ declare const useInitialGroupFetch: ({ id, setGroupData, }: UseInitialGroupFetch
 declare const useNavigation: (config: NavigationConfig) => (link: string, ctaTarget: CTALinkTarget) => Promise<void>;
 
 export { BUTTON_SIZE, _default$7 as BadgeTile, BadgeTileConfig, BadgeTileType, _default$6 as BannerTile, BannerTileConfig, BaseBanner, BaseTile, Button, COLOR_CONSTANTS, CTALinkTarget, Carousel, CarouselNavButton, Chip, Column, _default$5 as ContentTile, ContentTileConfig, CoreApiUrl, DIMENSION_MODES, EventEmitter, FullFlex, GRID_GAP, Grid, Group, IS_ANDROID, IS_DESKTOP, IS_IOS, IS_MOBILE, IS_WEB, Icon, Indicator, Layout, LoadingIndicator, MAX_WIDTH, _default$4 as PointsTile, PointsTileConfig, ProgressBar, ProgressIndicator, ProgressType, ProgressiveImage, Reward, _default$3 as RewardCategoryTile, RewardCategoryTileConfig, _default$2 as RewardTile, RewardTileConfig, _default$1 as RoundupTile, RoundupTileConfig, Row, SCREEN_HEIGHT, SCREEN_WIDTH, SLIDE_WIDTH, SMALL_SCREEN_WIDTH, Section, SectionHeader, SectionType, Skeleton, Spacer, StatusVariant, TABLET_SCREEN_WIDTH, Text, TierTileConfig, TierTileType, TierTile as TierTileUpdated, TileContainer, TileHeight, TileType, _default as VenueTile, VenueTileConfig, WllSdkProvider, alignMap, commonStyles, createResourceGetter, defaultTheme, desaturateColor, getAlphaDerivedColors, getDerivedColor, getDerivedColorPercentages, getDimensionMode, getDirectionalMargin, getReadableTextColor, getResponsiveValue, getStateColor, handleLastEarnedDate, justifyMap, sdkEventEmitter, shouldDesaturate, sizes, sortByPriority, themeItems, themes, transformLocale, useCreateRequestOptions, useGetGroupByID, useGetSectionByID, useGetTileByID, useGroupRefresh, useInitialGroupFetch, useInvalidateData, useMakeRequest, useNavigation, usePullToRefresh, useResponsive, useResponsiveValue, useTileSize, useWllSdk, validateTheme };
-export type { APIResponse$1 as APIResponse, Align, AllowedCoreApiUrl, Availability, Badge, BadgeDetail, BaseThemeObject, DerivedColors, DerivedProperties, DesaturationType, EventCallback, EventTypes, FlexDirection, ImagePropsNoSource, Justify, LayoutProps$1 as LayoutProps, NavigationConfig, NavigationType, PercentageKey, ProgessType, RewardCategory, SDKConfig, Size, TGroup, TSection, ThemeContextType, ThemeName, ThemeObject, ThemeProviderProps, TierType, Tile, TileConfig, TileSizeInfo, Variant };
+export type { APIResponse$1 as APIResponse, Align, AllowedCoreApiUrl, Availability, Badge, BadgeDetail, BaseThemeObject, DerivedColors, DerivedProperties, DesaturationType, EventCallback, EventTypes, FlexDirection, ImagePropsNoSource, Justify, LayoutProps$1 as LayoutProps, NavigationConfig, NavigationType, PercentageKey, ProgessType, RewardCategory, SDKConfig, Size, Sizes, TGroup, TSection, ThemeContextType, ThemeName, ThemeObject, ThemeProviderProps, TierType, Tile, TileConfig, TileSizeInfo, Variant };

package/dist/native.js

@@ -1072,8 +1072,9 @@ exports.CoreApiUrl = void 0;
 })(exports.CoreApiUrl || (exports.CoreApiUrl = {}));
 var createTheme = function (baseTheme) {
     if (baseTheme === void 0) { baseTheme = {}; }
-    var mergedTheme = __assign(__assign({}, defaultTheme), baseTheme);
-    return __assign(__assign({}, mergedTheme), { sizes: sizes, derivedBackground: getDerivedColor(mergedTheme.background), primaryText: getReadableTextColor(mergedTheme.primary), accentText: getReadableTextColor(mergedTheme.accent), positiveText: getReadableTextColor(mergedTheme.positive), negativeText: getReadableTextColor(mergedTheme.negative), derivedSurface: getDerivedColorPercentages(mergedTheme.surface), derivedSurfaceText: getDerivedColorPercentages(mergedTheme.surfaceText), alphaDerivedPrimary: getAlphaDerivedColors(mergedTheme.primary), alphaDerivedText: getAlphaDerivedColors(mergedTheme.text) });
+    var userSizes = baseTheme.sizes, restBaseTheme = __rest(baseTheme, ["sizes"]);
+    var mergedTheme = __assign(__assign({}, defaultTheme), restBaseTheme);
+    return __assign(__assign({}, mergedTheme), { sizes: __assign(__assign({}, sizes), userSizes), derivedBackground: getDerivedColor(mergedTheme.background), primaryText: getReadableTextColor(mergedTheme.primary), accentText: getReadableTextColor(mergedTheme.accent), positiveText: getReadableTextColor(mergedTheme.positive), negativeText: getReadableTextColor(mergedTheme.negative), derivedSurface: getDerivedColorPercentages(mergedTheme.surface), derivedSurfaceText: getDerivedColorPercentages(mergedTheme.surfaceText), alphaDerivedPrimary: getAlphaDerivedColors(mergedTheme.primary), alphaDerivedText: getAlphaDerivedColors(mergedTheme.text) });
 };
 var WllSdkContext = React.createContext(undefined);
 var WllSdkProvider = function (_a) {
@@ -2754,6 +2755,14 @@ var useContentTileStyles = function (hasArtwork) {
     });
 };
 
+var getContentTileMediaContainerStyle = function (isArtworkOnly) {
+    return isArtworkOnly
+        ? {
+            flexBasis: '100%',
+            aspectRatio: 1,
+        }
+        : { flexBasis: '50%' };
+};
 var ContentTileMedia = function (_a) {
     var isArtworkOnly = _a.isArtworkOnly;
     var tileContext = useTileContext();
@@ -2764,7 +2773,7 @@ var ContentTileMedia = function (_a) {
         return null;
     var hasArtwork = Boolean(artworkUrl);
     var styles = useContentTileStyles(hasArtwork);
-    var containerStyle = __assign({ flexBasis: isArtworkOnly ? '100%' : '50%' }, (isArtworkOnly && IS_WEB && { aspectRatio: 1 }));
+    var containerStyle = getContentTileMediaContainerStyle(isArtworkOnly);
     return (jsxRuntimeExports.jsx(reactNative.View, { style: [styles.imageContainer, containerStyle], testID: "content-tile-media", role: "img", accessibilityLabel: "Image for ".concat(title), children: jsxRuntimeExports.jsx(ProgressiveImage, { source: { uri: artworkUrl }, style: styles.image, alt: "Image for ".concat(title) }) }));
 };