@wlloyalty/wll-react-sdk 1.2.1 → 1.3.1

package/dist/index.d.ts

@@ -691,6 +691,7 @@ type SDKConfig = {
     userToken?: string;
     fetcher?: Fetcher;
     locale?: string;
+    environment?: 'PRODUCTION' | 'STAGING' | 'DEVELOPMENT';
 };
 type APIResponse<T> = {
     status: 'success' | 'error';

package/dist/native.js

@@ -1523,7 +1523,18 @@ var useNavigation = function (config) {
     return handleNavigation;
 };
 
-var baseUrl = 'https://api.staging.core.wlloyalty.net/v1';
+var getBaseUrl = function (environment) {
+    if (environment === void 0) { environment = 'STAGING'; }
+    switch (environment) {
+        case 'PRODUCTION':
+            return 'https://api.core.wlloyalty.net/v1';
+        case 'DEVELOPMENT':
+            return 'https://localhost:8080/v1';
+        case 'STAGING':
+        default:
+            return 'https://api.staging.core.wlloyalty.net/v1';
+    }
+};
 var useCreateRequestOptions = function (config) {
     return React.useCallback(function (options) {
         if (options === void 0) { options = {}; }
@@ -1586,9 +1597,11 @@ var createResourceGetter = function (resource, includeHydrate) {
             }
             // Always append locale=en
             params.append('locale', config.locale || 'en');
+            var env = config.environment || 'STAGING';
+            var baseUrl = getBaseUrl(env);
             var queryString = params.toString();
             return makeRequest("".concat(baseUrl, "/tiles-management/").concat(resource, "/").concat(id).concat(queryString ? "?".concat(queryString) : ''));
-        }, [makeRequest]);
+        }, [makeRequest, config.environment]);
     };
 };
 var useGetGroupByID = createResourceGetter('groups', true);
@@ -1917,8 +1930,8 @@ var DIMENSION_MODES = {
     TABLET: 'tablet',
     MOBILE: 'mobile',
 };
-var TABLET_SCREEN_WIDTH = 728;
-var SMALL_SCREEN_WIDTH = 530;
+var TABLET_SCREEN_WIDTH = 768;
+var SMALL_SCREEN_WIDTH = 480;
 
 var isWeb = reactNative.Platform.OS === 'web';
 function getDimensionMode(window) {
@@ -2090,6 +2103,9 @@ var validateConfig = function (config) {
     if (config.locale && !/^[a-z]{2}$/.test(config.locale)) {
         throw new Error('Invalid locale format. Expected ISO 639-1 language code (e.g. "en")');
     }
+    if (!config.environment) {
+        config.environment = 'STAGING';
+    }
 };
 
 function createVariantSystem(baseStyle, variantStyles) {
@@ -2387,7 +2403,7 @@ var Text = function (_a) {
             case 'eyebrow':
                 return __assign(__assign({}, baseStyle), { fontSize: useResponsiveValue(theme.sizes.md, theme.sizes.sm, isDesktop, isTablet), marginBottom: useResponsiveValue(theme.sizes.xxs, theme.sizes.xxxs, isDesktop, isTablet) });
             case 'title':
-                return __assign(__assign({}, baseStyle), { fontSize: useResponsiveValue(theme.sizes.xxl, theme.sizes.md, isDesktop, isTablet), fontWeight: 'bold' });
+                return __assign(__assign({}, baseStyle), { fontSize: useResponsiveValue(theme.sizes.xl, theme.sizes.md, isDesktop, isTablet), fontWeight: 'bold' });
             case 'body':
                 return {
                     color: theme.derivedSurfaceText[20],
@@ -2398,7 +2414,7 @@ var Text = function (_a) {
             case 'description':
             case 'label':
             default:
-                return __assign(__assign({}, baseStyle), { fontSize: useResponsiveValue(theme.sizes.sm, theme.sizes.xs, isDesktop, isTablet) });
+                return __assign(__assign({}, baseStyle), { fontSize: useResponsiveValue(theme.sizes.sm, theme.sizes.xxs, isDesktop, isTablet) });
         }
     };
     var variantStyle = getVariantStyle(variant);
@@ -3323,6 +3339,7 @@ var BadgeTileDateEarned = function () {
  */
 var BadgeTileDescription = function () {
     var tileContext = useTileContext();
+    var width = reactNative.useWindowDimensions().width;
     if (!isContextValid(tileContext))
         return null;
     var _a = tileContext.configuration, count = _a.count, description = _a.description, type = _a.type;
@@ -3332,7 +3349,19 @@ var BadgeTileDescription = function () {
     // For Specific type, always show description
     if (count === 0 && type === exports.BadgeTileType.Latest)
         return null;
-    return (jsxRuntimeExports.jsx(reactNative.View, { accessible: true, accessibilityLabel: "Badge description: ".concat(description), testID: "badge-tile-description", children: jsxRuntimeExports.jsx(Text, { variant: "body", numberOfLines: 2, ellipsizeMode: "tail", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: description }) }));
+    var numberOfLines = React.useMemo(function () {
+        if (width <= 480)
+            return 2;
+        if (width <= 768)
+            return 3;
+        if (width <= 1024)
+            return 1;
+        return 2;
+    }, [width]);
+    return (jsxRuntimeExports.jsx(reactNative.View, { accessible: true, accessibilityLabel: "Badge description: ".concat(description), testID: "badge-tile-description", style: {
+            width: '100%',
+            overflow: 'hidden',
+        }, children: jsxRuntimeExports.jsx(Text, { variant: "body", numberOfLines: numberOfLines, ellipsizeMode: "tail", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: description }) }));
 };
 
 /**
@@ -3394,7 +3423,7 @@ var BadgeTileTitle = function () {
             : name;
     if (!displayText)
         return null;
-    return (jsxRuntimeExports.jsx(reactNative.View, { accessible: true, accessibilityLabel: "Badge title: ".concat(displayText), testID: "badge-tile-title", children: jsxRuntimeExports.jsx(Text, { variant: "title", style: styles.titleText, numberOfLines: count === 0 ? 2 : 1, ellipsizeMode: "tail", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: displayText }) }));
+    return (jsxRuntimeExports.jsx(reactNative.View, { accessible: true, accessibilityLabel: "Badge title: ".concat(displayText), testID: "badge-tile-title", children: jsxRuntimeExports.jsx(Text, { variant: "title", style: styles.titleText, numberOfLines: 1, ellipsizeMode: "tail", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: displayText }) }));
 };
 
 /**
@@ -3631,27 +3660,58 @@ var ContentTileMedia = function (_a) {
 
 var ContentTileSummary = function () {
     var tileContext = useTileContext();
+    var sizeInfo = useTileSize(tileContext);
     if (!isContextValid(tileContext))
         return null;
-    var body = tileContext.configuration.body;
+    var _a = tileContext.configuration, body = _a.body, title = _a.title, artworkUrl = _a.artworkUrl;
     if (!body)
         return null;
-    var sizeInfo = useTileSize(tileContext);
     if (!sizeInfo)
         return null;
-    var isFullSize = sizeInfo.isFullSize, isHalfSize = sizeInfo.isHalfSize;
-    var getNumberOfLines = function () {
-        return isFullSize ? 3 : isHalfSize ? 4 : 3;
-    };
-    return (jsxRuntimeExports.jsx(Text, { variant: "body", role: "article", accessibilityLabel: body, numberOfLines: getNumberOfLines(), testID: "content-tile-summary", children: body }));
+    var isHalfSize = sizeInfo.isHalfSize;
+    var numberOfLines = React.useMemo(function () {
+        if (!body)
+            return undefined;
+        if (isHalfSize) {
+            if (!title && body)
+                return 4;
+            if (title && body)
+                return 2;
+        }
+        if (artworkUrl)
+            return 3;
+        if (!title)
+            return 8;
+        return 6;
+    }, [title, body, artworkUrl, isHalfSize]);
+    return (jsxRuntimeExports.jsx(Text, { variant: "body", role: "article", accessibilityLabel: body, numberOfLines: numberOfLines, testID: "content-tile-summary", children: body }));
 };
 
 var ContentTileTitle = function () {
     var tileContext = useTileContext();
     var styles = useContentTileStyles();
+    var sizeInfo = useTileSize(tileContext);
     if (!isContextValid(tileContext))
         return null;
-    var _a = tileContext.configuration, title = _a.title, ctaLink = _a.ctaLink;
+    var _a = tileContext.configuration, title = _a.title, ctaLink = _a.ctaLink, body = _a.body, artworkUrl = _a.artworkUrl;
+    if (!sizeInfo)
+        return null;
+    var isHalfSize = sizeInfo.isHalfSize;
+    var numberOfLines = React.useMemo(function () {
+        if (!title)
+            return undefined;
+        if (isHalfSize) {
+            if (title && !body)
+                return 3;
+            if (title && body)
+                return 1;
+        }
+        if (artworkUrl)
+            return 1;
+        if (!body)
+            return 7;
+        return 2;
+    }, [title, body, artworkUrl, isHalfSize]);
     if (!title)
         return null;
     var handleTitleWidth = function () {
@@ -3659,7 +3719,7 @@ var ContentTileTitle = function () {
             return styles.titleWithLink;
         }
     };
-    return (jsxRuntimeExports.jsx(Text, { variant: "title", role: "heading", accessibilityLabel: title, numberOfLines: 1, style: handleTitleWidth(), testID: "content-tile-title", children: title }));
+    return (jsxRuntimeExports.jsx(Text, { variant: "title", role: "heading", accessibilityLabel: title, numberOfLines: numberOfLines, style: handleTitleWidth(), testID: "content-tile-title", children: title }));
 };
 
 /**
@@ -3821,14 +3881,14 @@ var useSectionHeaderStyles = function () {
             marginBottom: useResponsiveValue(theme.sizes.lg, theme.sizes.xxs, isDesktop, isTablet),
         },
         sectionTitle: {
-            fontSize: useResponsiveValue(theme.sizes.xxxl, theme.sizes.xl, isDesktop, isTablet),
+            fontSize: useResponsiveValue(theme.sizes.xxl, theme.sizes.xl, isDesktop, isTablet),
             marginBottom: useResponsiveValue(theme.sizes.xxs, theme.sizes.xxxs, isDesktop, isTablet),
             fontWeight: '700',
             color: theme.text,
             fontFamily: theme.fontFamily,
         },
         sectionDescription: {
-            fontSize: useResponsiveValue(theme.sizes.xxl, theme.sizes.md, isDesktop, isTablet),
+            fontSize: useResponsiveValue(theme.sizes.xl, theme.sizes.md, isDesktop, isTablet),
             color: theme.alphaDerivedText[80],
             fontFamily: theme.fontFamily,
         },
@@ -4934,10 +4994,12 @@ var RewardTileSummary = function () {
     var tileContext = useTileContext();
     if (!isContextValid(tileContext))
         return null;
-    var summary = tileContext.configuration.summary;
+    var _a = tileContext.configuration, summary = _a.summary, _b = _a.showPrice, showPrice = _b === void 0 ? true : _b, price = _a.price;
+    var shouldShowPrice = showPrice && price !== undefined && price !== null && price !== 0;
+    var numberOfLines = shouldShowPrice ? 1 : 3;
     if (!summary)
         return null;
-    return (jsxRuntimeExports.jsx(Text, { variant: "body", role: "article", accessibilityLabel: summary, testID: "reward-tile-summary", children: summary }));
+    return (jsxRuntimeExports.jsx(Text, { variant: "body", role: "article", accessibilityLabel: summary, testID: "reward-tile-summary", numberOfLines: numberOfLines, ellipsizeMode: "tail", children: summary }));
 };
 
 /**