@revenuecat/purchases-ui-js 2.0.3 → 2.0.5

package/dist/components/paywall/fixtures/sheet-paywall.js

@@ -0,0 +1,325 @@
+export const SHEET_PAYWALL = {
+    default_locale: "en_US",
+    components_localizations: {
+        en_US: {
+            "5GWqi3MXpt": "Sheet",
+            E6CK5Xd1cE: "Sheet button",
+        },
+    },
+    components_config: {
+        base: {
+            background: {
+                type: "color",
+                value: {
+                    light: {
+                        type: "hex",
+                        value: "#ffffffff",
+                    },
+                },
+            },
+            stack: {
+                background: null,
+                background_color: null,
+                badge: null,
+                border: null,
+                components: [
+                    {
+                        action: {
+                            destination: "sheet",
+                            sheet: {
+                                background: null,
+                                background_blur: true,
+                                id: "ByNqcHZCBa",
+                                name: "",
+                                position: "bottom",
+                                size: {
+                                    height: {
+                                        type: "relative",
+                                        value: 0.5,
+                                    },
+                                    width: {
+                                        type: "fill",
+                                        value: null,
+                                    },
+                                },
+                                stack: {
+                                    background: {
+                                        type: "color",
+                                        value: {
+                                            light: {
+                                                type: "hex",
+                                                value: "#ddffddff",
+                                            },
+                                        },
+                                    },
+                                    background_color: null,
+                                    badge: null,
+                                    border: {
+                                        color: {
+                                            light: {
+                                                type: "hex",
+                                                value: "#00aa00ff",
+                                            },
+                                        },
+                                        width: 3,
+                                    },
+                                    components: [
+                                        {
+                                            background_color: null,
+                                            color: {
+                                                light: {
+                                                    type: "hex",
+                                                    value: "#000000",
+                                                },
+                                            },
+                                            font_name: null,
+                                            font_size: 32,
+                                            font_weight: "regular",
+                                            font_weight_int: 400,
+                                            horizontal_alignment: "leading",
+                                            id: "_SFE-Jfx2H",
+                                            margin: {
+                                                bottom: 0,
+                                                leading: 0,
+                                                top: 0,
+                                                trailing: 0,
+                                            },
+                                            name: "",
+                                            padding: {
+                                                bottom: 0,
+                                                leading: 0,
+                                                top: 0,
+                                                trailing: 0,
+                                            },
+                                            size: {
+                                                height: {
+                                                    type: "fit",
+                                                    value: null,
+                                                },
+                                                width: {
+                                                    type: "fit",
+                                                    value: null,
+                                                },
+                                            },
+                                            text_lid: "5GWqi3MXpt",
+                                            type: "text",
+                                        },
+                                    ],
+                                    dimension: {
+                                        alignment: "center",
+                                        distribution: "center",
+                                        type: "vertical",
+                                    },
+                                    id: "vtyGD4yg8U",
+                                    margin: {
+                                        bottom: 0,
+                                        leading: 32,
+                                        top: 0,
+                                        trailing: 32,
+                                    },
+                                    name: "Sheet Content",
+                                    padding: {
+                                        bottom: 32,
+                                        leading: 32,
+                                        top: 32,
+                                        trailing: 32,
+                                    },
+                                    shadow: {
+                                        color: {
+                                            light: {
+                                                type: "hex",
+                                                value: "#ff000040",
+                                            },
+                                        },
+                                        radius: 16,
+                                        x: 0,
+                                        y: -8,
+                                    },
+                                    shape: {
+                                        corners: {
+                                            bottom_leading: 0,
+                                            bottom_trailing: 0,
+                                            top_leading: 32,
+                                            top_trailing: 32,
+                                        },
+                                        type: "rectangle",
+                                    },
+                                    size: {
+                                        height: {
+                                            type: "fill",
+                                            value: null,
+                                        },
+                                        width: {
+                                            type: "fill",
+                                            value: null,
+                                        },
+                                    },
+                                    spacing: 0,
+                                    type: "stack",
+                                },
+                                type: "sheet",
+                            },
+                            type: "navigate_to",
+                        },
+                        id: "dTnaiaphr5",
+                        name: "",
+                        stack: {
+                            background: {
+                                type: "color",
+                                value: {
+                                    light: {
+                                        type: "hex",
+                                        value: "#ddffddff",
+                                    },
+                                },
+                            },
+                            background_color: null,
+                            badge: null,
+                            border: {
+                                color: {
+                                    light: {
+                                        type: "hex",
+                                        value: "#00aa00ff",
+                                    },
+                                },
+                                width: 1,
+                            },
+                            components: [
+                                {
+                                    background_color: null,
+                                    color: {
+                                        light: {
+                                            type: "hex",
+                                            value: "#000000",
+                                        },
+                                    },
+                                    font_name: null,
+                                    font_size: 14,
+                                    font_weight: "regular",
+                                    font_weight_int: 400,
+                                    horizontal_alignment: "leading",
+                                    id: "o7XZa4SJLW",
+                                    margin: {
+                                        bottom: 0,
+                                        leading: 0,
+                                        top: 0,
+                                        trailing: 0,
+                                    },
+                                    name: "",
+                                    padding: {
+                                        bottom: 0,
+                                        leading: 0,
+                                        top: 0,
+                                        trailing: 0,
+                                    },
+                                    size: {
+                                        height: {
+                                            type: "fit",
+                                            value: null,
+                                        },
+                                        width: {
+                                            type: "fit",
+                                            value: null,
+                                        },
+                                    },
+                                    text_lid: "E6CK5Xd1cE",
+                                    type: "text",
+                                },
+                            ],
+                            dimension: {
+                                alignment: "leading",
+                                distribution: "start",
+                                type: "vertical",
+                            },
+                            id: "el3qmQd6hR",
+                            margin: {
+                                bottom: 0,
+                                leading: 0,
+                                top: 0,
+                                trailing: 0,
+                            },
+                            name: "",
+                            padding: {
+                                bottom: 16,
+                                leading: 16,
+                                top: 16,
+                                trailing: 16,
+                            },
+                            shadow: {
+                                color: {
+                                    light: {
+                                        type: "hex",
+                                        value: "#ff000040",
+                                    },
+                                },
+                                radius: 16,
+                                x: 8,
+                                y: 8,
+                            },
+                            shape: {
+                                corners: null,
+                                type: "pill",
+                            },
+                            size: {
+                                height: {
+                                    type: "fit",
+                                    value: null,
+                                },
+                                width: {
+                                    type: "fit",
+                                    value: null,
+                                },
+                            },
+                            spacing: 0,
+                            type: "stack",
+                        },
+                        transition: null,
+                        type: "button",
+                    },
+                ],
+                dimension: {
+                    alignment: "center",
+                    distribution: "start",
+                    type: "vertical",
+                },
+                id: "rocJhuHfiP",
+                margin: {
+                    bottom: 0,
+                    leading: 0,
+                    top: 0,
+                    trailing: 0,
+                },
+                name: "Content",
+                padding: {
+                    bottom: 0,
+                    leading: 0,
+                    top: 0,
+                    trailing: 0,
+                },
+                shadow: null,
+                shape: {
+                    corners: {
+                        bottom_leading: 0,
+                        bottom_trailing: 0,
+                        top_leading: 0,
+                        top_trailing: 0,
+                    },
+                    type: "rectangle",
+                },
+                size: {
+                    height: {
+                        type: "fit",
+                        value: null,
+                    },
+                    width: {
+                        type: "fill",
+                        value: null,
+                    },
+                },
+                spacing: 16,
+                type: "stack",
+            },
+            sticky_footer: null,
+        },
+    },
+};

package/dist/components/paywall/fixtures/stack-paywall.d.ts

@@ -1,2 +1,2 @@
-import type { PaywallData } from "../../../data/entities";
+import type { PaywallData } from "../../../types/paywall";
 export declare const STACK_PAYWALL: PaywallData;

package/dist/components/stack/Stack.svelte

@@ -14,13 +14,17 @@
     px,
   } from "../../utils/base-utils";
   import { getActiveStateProps } from "../../utils/style-utils";
+  import type { Snippet } from "svelte";
   import { mapBadge, mapDimension, mapLayerAlignment } from "./stack-utils";
 
   interface MiscProps {
     onclick?: () => void;
+    children?: Snippet;
   }
 
   const props: StackProps & MiscProps = $props();
+  const { onclick, children } = props;
+
   const selectedState = getSelectedStateContext();
   const {
     components,
@@ -35,7 +39,6 @@
     shape,
     shadow,
     badge,
-    onclick,
   } = $derived.by(() => {
     return {
       ...props,
@@ -110,6 +113,8 @@
       <Node nodeData={component} />
     {/each}
   {/if}
+
+  {@render children?.()}
 </svelte:element>
 
 <style>

package/dist/components/stack/Stack.svelte.d.ts

@@ -1,6 +1,8 @@
 import type { StackProps } from "../../types/components/stack";
+import type { Snippet } from "svelte";
 interface MiscProps {
     onclick?: () => void;
+    children?: Snippet;
 }
 type $$ComponentProps = StackProps & MiscProps;
 declare const Stack: import("svelte").Component<$$ComponentProps, {}, "">;

package/dist/components/tabs/TabControl.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+  import type { TabControlProps } from "../../types/components/tabs";
+  import Stack from "../stack/Stack.svelte";
+  import { getTabsContext } from "./tabs-context";
+
+  const _: TabControlProps = $props();
+
+  const { control } = getTabsContext();
+</script>
+
+<Stack {...$control.stack} />

package/dist/components/tabs/TabControl.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { TabControlProps } from "../../types/components/tabs";
+declare const TabControl: import("svelte").Component<TabControlProps, {}, "">;
+type TabControl = ReturnType<typeof TabControl>;
+export default TabControl;

package/dist/components/tabs/TabControlButton.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import { setSelectedStateContext } from "../../stores/selected";
+  import type { TabControlButtonProps } from "../../types/components/tabs";
+  import { derived } from "svelte/store";
+  import Stack from "../stack/Stack.svelte";
+  import { getTabsContext } from "./tabs-context";
+
+  const { stack, tab_id, tab_index }: TabControlButtonProps = $props();
+
+  const { selectedTabId, selectTab } = getTabsContext();
+
+  setSelectedStateContext(derived(selectedTabId, (value) => value === tab_id));
+
+  const onclick = () => {
+    selectTab(tab_id, tab_index);
+  };
+</script>
+
+<Stack {...stack} {onclick}></Stack>

package/dist/components/tabs/TabControlButton.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { TabControlButtonProps } from "../../types/components/tabs";
+declare const TabControlButton: import("svelte").Component<TabControlButtonProps, {}, "">;
+type TabControlButton = ReturnType<typeof TabControlButton>;
+export default TabControlButton;