Skip to content

Commit 8469df9

Browse files
committed
fix(clarity): proxying broken once clarity loads
Fixes #442
1 parent d4d8f31 commit 8469df9

File tree

2 files changed

+31
-4
lines changed

2 files changed

+31
-4
lines changed
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,28 @@
11
<script lang="ts" setup>
2-
import { useHead, useScriptClarity } from '#imports'
2+
import { onMounted, useHead, useScriptClarity } from '#imports'
33
44
useHead({
55
title: 'Clarity',
66
})
77
88
// composables return the underlying api as a proxy object and the script state
9-
const { status } = useScriptClarity({
9+
const { status, proxy } = useScriptClarity({
1010
id: 'mqk2m9dr2v',
1111
})
12+
13+
onMounted(() => {
14+
setTimeout(() => {
15+
proxy.clarity('consent')
16+
}, 3000)
17+
})
18+
19+
function accept() {
20+
window.clarity('consent', true)
21+
}
22+
23+
function decline() {
24+
window.clarity('consent', false)
25+
}
1226
</script>
1327

1428
<template>
@@ -17,6 +31,12 @@ const { status } = useScriptClarity({
1731
<div>
1832
status: {{ status }}
1933
</div>
34+
<button @click="accept">
35+
Force Accept
36+
</button>
37+
<button @click="decline">
38+
Force Decline
39+
</button>
2040
</ClientOnly>
2141
</div>
2242
</template>

src/runtime/registry/clarity.ts

+9-2
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ type ClarityFunctions = ((fn: 'start', options: { content: boolean, cookies: str
99
page: string
1010
userHint: string
1111
}>)
12-
& ((fn: 'consent') => void)
12+
& ((fn: 'consent', enabled?: boolean) => void)
1313
& ((fn: 'set', key: any, value: any) => void)
1414
& ((fn: 'event', value: any) => void)
1515
& ((fn: 'upgrade', upgradeReason: any) => void)
@@ -46,7 +46,14 @@ export function useScriptClarity<T extends ClarityApi>(
4646
schema: import.meta.dev ? ClarityOptions : undefined,
4747
scriptOptions: {
4848
use() {
49-
return { clarity: window.clarity }
49+
return {
50+
// @ts-expect-error untyped
51+
clarity: Object.assign(function (...params) {
52+
const clarity = window.clarity
53+
// @ts-expect-error untyped
54+
return clarity.apply(this, params)
55+
}, window.clarity),
56+
}
5057
},
5158
},
5259
clientInit: import.meta.server

0 commit comments

Comments
 (0)