@wlloyalty/wll-react-sdk 1.0.99 → 1.0.101

package/dist/types/context/WllSdkContext.d.ts

@@ -21,6 +21,7 @@ type WllSdkContextType = ThemeContextType & {
     getSectionByID: (id: string) => Promise<APIResponse<TSection>>;
     getTileByID: (id: string) => Promise<APIResponse<Tile>>;
     handleNavigation: (link: string, target: CTALinkTarget) => Promise<void>;
+    refreshGroup: (id: string) => Promise<APIResponse<TGroup>>;
 } & Readonly<{
     readonly config: SDKConfig;
 }>;

package/dist/web.js

@@ -8252,9 +8252,6 @@ var validateTheme = function (theme) {
 var createSafeColor = function (color) {
   try {
     var colorInstance = Color(color);
-    console.log('Original color:', color);
-    console.log('Color instance toString:', colorInstance.toString());
-    console.log('Color instance hex:', colorInstance.hex());
     return colorInstance;
   } catch (error) {
     console.error("Invalid color value: ".concat(color), error);
@@ -8521,6 +8518,13 @@ var WllSdkProvider = function (_a) {
   var getSectionByID = useGetSectionByID(config);
   var getTileByID = useGetTileByID(config);
   var handleNavigation = useNavigation(navigationConfig);
+  var refreshGroup = React.useCallback(function (id) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      return __generator(this, function (_a) {
+        return [2 /*return*/, getGroupByID(id)];
+      });
+    });
+  }, [getGroupByID]);
   var contextValue = React.useMemo(function () {
     return {
       theme: theme,
@@ -8529,9 +8533,10 @@ var WllSdkProvider = function (_a) {
       getSectionByID: getSectionByID,
       getTileByID: getTileByID,
       handleNavigation: handleNavigation,
+      refreshGroup: refreshGroup,
       config: config
     };
-  }, [theme, setTheme, getGroupByID, getSectionByID, getTileByID, handleNavigation, config]);
+  }, [theme, setTheme, getGroupByID, getSectionByID, getTileByID, handleNavigation, refreshGroup, config]);
   return /*#__PURE__*/React.createElement(WllSdkContext.Provider, {
     value: contextValue
   }, /*#__PURE__*/React.createElement(ResponsiveProvider, null, children));
@@ -18915,12 +18920,27 @@ var Text = function (_a) {
     }
   };
   var variantStyle = getVariantStyle(variant);
-  var baseTextStyle = {
-    fontFamily: theme.fontFamily
-  };
-  // NOTE: We must apply fontFamily as base style to ensure it's always applied
+  // NOTE: React Native Web has different style resolution rules compared to CSS.
+  // 1. We create styles using StyleSheet.create for better performance
+  // 2. Base styles set the initial fontFamily
+  // 3. variantStyle contains responsive fontSize and other variant-specific styles
+  // 4. webOverrides ensures fontFamily is correctly applied on web platform
+  //    (prevents system font stack from being incorrectly applied)
+  // 5. custom style prop has highest precedence
+  // The order matters because RN Web resolves styles by specific properties
+  // rather than last-declaration-wins like in CSS
+  // https://necolas.github.io/react-native-web/docs/styling/#how-it-works
+  var styles = StyleSheet$1.create({
+    base: {
+      fontFamily: theme.fontFamily
+    },
+    webOverrides: IS_WEB ? {
+      fontFamily: theme.fontFamily
+    } : {}
+  });
+  var combinedStyles = [styles.base, variantStyle, styles.webOverrides, style];
   return /*#__PURE__*/React__namespace.createElement(Text$3, __assign({
-    style: [baseTextStyle, variantStyle, style]
+    style: combinedStyles
   }, props));
 };
 
@@ -21075,8 +21095,15 @@ var useGroupData = function (id) {
     isLoading = _c[0],
     setIsLoading = _c[1];
   var fetchGroup = React.useCallback(function () {
-    return __awaiter(void 0, void 0, void 0, function () {
+    var args_1 = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+      args_1[_i] = arguments[_i];
+    }
+    return __awaiter(void 0, __spreadArray([], args_1, true), void 0, function (showLoading) {
       var response, err_1;
+      if (showLoading === void 0) {
+        showLoading = true;
+      }
       return __generator(this, function (_a) {
         switch (_a.label) {
           case 0:
@@ -21085,12 +21112,14 @@ var useGroupData = function (id) {
               setIsLoading(false);
               return [2 /*return*/];
             }
-            setIsLoading(true);
+            if (showLoading) {
+              setIsLoading(true);
+            }
             setError(null);
             _a.label = 1;
           case 1:
             _a.trys.push([1, 3, 4, 5]);
-            return [4 /*yield*/, sdk.getGroupByID(id)];
+            return [4 /*yield*/, sdk.refreshGroup(id)];
           case 2:
             response = _a.sent();
             if (response && response.status === 'success' && response.data) {
@@ -21105,7 +21134,9 @@ var useGroupData = function (id) {
             console.error('Error fetching group:', err_1);
             return [3 /*break*/, 5];
           case 4:
-            setIsLoading(false);
+            if (showLoading) {
+              setIsLoading(false);
+            }
             return [7 /*endfinally*/];
           case 5:
             return [2 /*return*/];
@@ -21113,13 +21144,17 @@ var useGroupData = function (id) {
       });
     });
   }, [id, sdk]);
+  var refreshGroup = React.useCallback(function () {
+    return fetchGroup(false);
+  }, [fetchGroup]);
   React.useEffect(function () {
-    fetchGroup();
+    fetchGroup(true);
   }, [fetchGroup]);
   return {
     groupData: groupData,
     isLoading: isLoading,
-    error: error
+    error: error,
+    refreshGroup: refreshGroup
   };
 };
 /**