@hyvor/design 1.1.11 → 1.1.12-beta.1

package/dist/marketing/Affiliate/Affiliate.svelte

@@ -0,0 +1,75 @@
+<script lang="ts">
+	import Link from '../../components/Link/Link.svelte';
+	import Modal from '../../components/Modal/Modal.svelte';
+    import { replaceState } from '$app/navigation';
+    import { onMount } from 'svelte';
+
+    let partner: string | null = $state(null);
+    let showModal = $state(false);
+
+    onMount(() => {
+        const params = new URLSearchParams(window.location.search);
+        partner = params.get('partner');
+
+        if (partner) {
+            showModal = true;
+        }
+    });
+
+    function handleConsent() {
+        const coreUrl = `${location.protocol}//${location.hostname.split('.').slice(-2).join('.')}`;
+
+		fetch(coreUrl + '/api/public/affiliate/placement', {
+			method: 'POST',
+			headers: {
+				'Content-Type': 'application/json'
+			},
+			body: JSON.stringify({
+				partner: partner,
+				url: window.location.href
+			}),
+			credentials: 'include'
+		}).then((response) => {
+			if (response.ok) {
+				console.info('Affiliate placement recorded for partner:', partner);
+			}
+		}).finally(() => {
+            const url = new URL(window.location.href);
+            url.searchParams.delete('partner');
+            replaceState(url, {});
+            showModal = false;
+        });
+    }
+</script>
+
+<Modal
+    title="Referred by {partner}"
+    bind:show={showModal}
+    closeOnOutsideClick={false}
+    footer={
+        {
+            cancel: {
+                text: "Do not track"
+            },
+            confirm: {
+                text: "Ok, Visit Site",
+            }
+        }
+    }
+    on:confirm={handleConsent}
+    >
+    <div class="notice">
+        You visited our site through our affiliate partner <strong>{partner}</strong>. To track this referral, we will place a small
+        cookie in your browser. This cookie helps us identify which affiliate partner referred you 
+        if you sign up. It does not collect any personal data.
+    </div>
+    <p>
+        You can read more in our <Link href="https://hyvor.com/privacy" target="_blank">Privacy Policy</Link>.
+    </p>
+</Modal>
+
+<style>
+    .notice {
+        line-height: 24px;
+    }
+</style>

package/dist/marketing/Affiliate/Affiliate.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Affiliate: import("svelte").Component<Record<string, never>, {}, "">;
+type Affiliate = ReturnType<typeof Affiliate>;
+export default Affiliate;

package/dist/marketing/Footer/Footer.svelte

@@ -13,6 +13,7 @@
 	import LanguageToggle from '../../components/Internationalization/LanguageToggle.svelte';
 	import IconBluesky from '@hyvor/icons/IconBluesky';
 	import { SOCIAL_LINKS, type Socials } from '../social.js';
+	import Affiliate from '../Affiliate/Affiliate.svelte';
 
 	const year = new Date().getFullYear();
 
@@ -20,12 +21,14 @@
 		email?: string | null;
 		social?: Partial<Socials>;
 		center?: import('svelte').Snippet;
+		affiliate?: boolean;
 	}
 
 	let {
 		email = null,
 		social = $bindable({} as Record<string, string | null>),
-		center
+		center,
+		affiliate = true
 	}: Props = $props();
 
 	social = {
@@ -109,6 +112,11 @@
 			<div class="footer-bottom-right">From France 🇫🇷</div>
 		</div>
 	</Container>
+
+	{#if affiliate}
+		<Affiliate />
+	{/if}
+
 </footer>
 
 <style>

package/dist/marketing/Footer/Footer.svelte.d.ts

@@ -3,6 +3,7 @@ interface Props {
     email?: string | null;
     social?: Partial<Socials>;
     center?: import('svelte').Snippet;
+    affiliate?: boolean;
 }
 declare const Footer: import("svelte").Component<Props, {}, "social">;
 type Footer = ReturnType<typeof Footer>;

package/package.json

@@ -59,5 +59,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"version": "1.1.11"
+	"version": "1.1.12-beta.1"
 }