@wlloyalty/wll-react-sdk 1.6.20 → 1.7.0

package/dist/native.js

@@ -5519,6 +5519,8 @@ var useVenueTileStyles = function () {
     return reactNative.StyleSheet.create({
         imageContainer: {
             width: '100%',
+            minHeight: 130,
+            overflow: 'hidden',
             marginBottom: useResponsiveValue(theme.sizes.sm, theme.sizes.xxs, isDesktop, isTablet),
         },
         image: {
@@ -5549,6 +5551,7 @@ var useVenueTileStyles = function () {
         },
         header: {
             width: '100%',
+            paddingTop: theme.sizes.xxxs,
             marginBottom: useResponsiveValue(theme.sizes.xxs, theme.sizes.xxxs, isDesktop, isTablet),
         },
         tileTitle: __assign({ maxWidth: '90%', flex: 1 }, getDirectionalMargin(8)),
@@ -5563,29 +5566,29 @@ var useVenueTileStyles = function () {
             alignItems: 'center',
             zIndex: 10,
         },
+        pinOverlay: {
+            position: 'absolute',
+            top: 8,
+            right: 8,
+            zIndex: 20,
+        },
     });
 };
 
 /**
  * Renders the media for a Venue Tile.
  *
- * @param props {VenueTileMediaProps} - Component props
- * @param props.isArtworkOnly {boolean} - Whether the media should be rendered as an artwork only component
  * @returns React.ReactElement or null if no artwork URL is present or artwork should not be shown
  */
-var VenueTileMedia = function (_a) {
-    var _b = _a.isArtworkOnly, isArtworkOnly = _b === void 0 ? false : _b;
+var VenueTileMedia = function () {
     var styles = useVenueTileStyles();
     var tileContext = useTileContext();
     if (!isContextValid(tileContext))
         return null;
-    var _c = tileContext.configuration, artworkUrl = _c.artworkUrl, _d = _c.name, name = _d === void 0 ? 'Venue' : _d, _e = _c.isLocked, isLocked = _e === void 0 ? false : _e;
-    if (!artworkUrl)
-        return null;
-    var containerStyle = {
-        flexBasis: isArtworkOnly ? '100%' : '50%',
-    };
-    return (jsxRuntimeExports.jsxs(reactNative.View, { style: [styles.imageContainer, containerStyle], testID: "venue-tile-media", role: "img", accessibilityLabel: "Venue image for ".concat(name), children: [jsxRuntimeExports.jsx(ProgressiveImage, { source: { uri: artworkUrl }, style: styles.image, alt: "Venue image for ".concat(name) }), isLocked && (jsxRuntimeExports.jsx(reactNative.View, { style: styles.lockOverlay, testID: "lock-overlay", children: jsxRuntimeExports.jsx(Icon, { name: "LockKeyhole", size: 48, color: "white" }) }))] }));
+    var _a = tileContext.configuration, artworkUrl = _a.artworkUrl, _b = _a.name, name = _b === void 0 ? 'Venue' : _b, _c = _a.isLocked, isLocked = _c === void 0 ? false : _c;
+    var containerStyle = __assign({ flexBasis: '50%' }, (tileContext.tileHeight === exports.TileHeight.Half && { minHeight: 0 }));
+    var showCenteredPin = !artworkUrl && !isLocked;
+    return (jsxRuntimeExports.jsxs(reactNative.View, { style: [styles.imageContainer, containerStyle], testID: "venue-tile-media", role: "img", accessibilityLabel: "Venue image for ".concat(name), children: [artworkUrl && (jsxRuntimeExports.jsx(ProgressiveImage, { source: { uri: artworkUrl }, style: styles.image, alt: "Venue image for ".concat(name) })), jsxRuntimeExports.jsxs(reactNative.View, { style: styles.lockOverlay, testID: "lock-overlay", children: [isLocked && jsxRuntimeExports.jsx(Icon, { name: "LockKeyhole", size: 48, color: "white" }), showCenteredPin ? (jsxRuntimeExports.jsx(Icon, { name: "MapPin", size: 48, color: "white" })) : (jsxRuntimeExports.jsx(reactNative.View, { style: styles.pinOverlay, testID: "pin-overlay", children: jsxRuntimeExports.jsx(Icon, { name: "MapPin", size: 24, color: "white" }) }))] })] }));
 };
 
 /**
@@ -5625,11 +5628,10 @@ var VenueTileTitle = function () {
 };
 
 /**
- * The VenueTile component renders a tile with media, title, summary, points, and a chevron.
+ * The VenueTile component renders a tile with media, title, description, and a chevron.
  *
  * @param {VenueTileProps} props - Component props
  * @param {Tile} props.tile - The tile data to render
- * @returns React.ReactElement or null if tile is inactive or not a full-height tile
  */
 var VenueTileRoot = function (_a) {
     var tile = _a.tile;