@revenuecat/purchases-ui-js 4.14.1 → 4.14.2
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.
|
@@ -478,6 +478,9 @@
|
|
|
478
478
|
let headerHeight = $state(0);
|
|
479
479
|
let footerHeight = $state(0);
|
|
480
480
|
|
|
481
|
+
// A horizontal root's direction is row, so the spacer would incorrectly sit beside the content
|
|
482
|
+
const spacerFitsRoot = stack.dimension.type !== "horizontal";
|
|
483
|
+
|
|
481
484
|
const contentColumnStyle = $derived(
|
|
482
485
|
maxContentWidth
|
|
483
486
|
? `max-width: ${maxContentWidth}; margin-inline: auto;`
|
|
@@ -501,6 +504,12 @@
|
|
|
501
504
|
<div class="paywall-content" style={contentColumnStyle}>
|
|
502
505
|
<Stack
|
|
503
506
|
{...stack}
|
|
507
|
+
padding={sticky_footer && !spacerFitsRoot
|
|
508
|
+
? {
|
|
509
|
+
...stack.padding,
|
|
510
|
+
bottom: (stack.padding?.bottom ?? 0) + footerHeight,
|
|
511
|
+
}
|
|
512
|
+
: stack.padding}
|
|
504
513
|
class="paywall-content-scroll"
|
|
505
514
|
style={mapPaywallContentStackStyle(
|
|
506
515
|
stack.size.height,
|
|
@@ -508,9 +517,9 @@
|
|
|
508
517
|
headerHeight,
|
|
509
518
|
)}
|
|
510
519
|
>
|
|
511
|
-
{#if sticky_footer}
|
|
512
|
-
<!-- Adds a
|
|
513
|
-
a footer because iOS Safari ignores the padding if the content
|
|
520
|
+
{#if sticky_footer && spacerFitsRoot}
|
|
521
|
+
<!-- Adds a real flex item rather than bottom padding to clear
|
|
522
|
+
a footer because iOS Safari ignores the padding if the content
|
|
514
523
|
still fits on screen leaving content stuck behind the footer. -->
|
|
515
524
|
<div
|
|
516
525
|
class="footer-scroll-spacer"
|
|
@@ -64,7 +64,8 @@ export function mapStackSize(size, parentDimension) {
|
|
|
64
64
|
}
|
|
65
65
|
export function mapDimension(dimension) {
|
|
66
66
|
if (dimension.type === "zlayer") {
|
|
67
|
-
|
|
67
|
+
// The default direction is row, so we need to set it to column to keep the flow vertical.
|
|
68
|
+
return { "flex-direction": "column" };
|
|
68
69
|
}
|
|
69
70
|
const direction = dimension.type === "vertical" ? "column" : "row";
|
|
70
71
|
const justify = DISTRIBUTION_MAP[dimension.distribution] || "center";
|