Package Exports
- @dataunlocker/defender-svelte
Readme
DataUnlocker Defender for Svelte
This package provides a Svelte component to integrate DataUnlocker into your Svelte application. DataUnlocker helps you protect your data from ad blockers and other privacy tools.
Prerequisites
Before integrating this package, please ensure you have completed the DataUnlocker setup checklist available at docs.dataunlocker.com/setup/checklist.
Installation
Create a
.dataunlocker.jsonfile in the root of your project with the following content:{ "DATAUNLOCKER_ID": "<ID_COPIED_FROM_DATAUNLOCKER_ADMIN>" }
Note: You can override the
DATAUNLOCKER_IDfor different environments by setting theDATAUNLOCKER_IDenvironment variable.Install the package:
npm install @dataunlocker/defender-svelte
Note: DataUnlocker's domain and a transport endpoint used is "hardcoded" at the package install time. If you change the transport endpoint or
DATAUNLOCKER_ID, you need to reinstall the package or runnpx dataunlocker-defender-refresh. Mind that your local or cloud deployment may also cache dependencies so you may need to flush the cache.
Usage
Wrap your application layout with the <Defender> component.
It's recommended to do this in your root +layout.svelte file.
<script lang="ts">
import { Defender } from '@dataunlocker/defender-svelte';
import '../app.css';
import Header from './Header.svelte';
let { children } = $props();
</script>
<Defender
onLoad={(data) =>
console.log('DataUnlocker loaded with this data returned from the Secure Enclave:', data)}
onError={(code) => console.log('DataUnlocker failed to load with this error code:', code)}
>
<div class="app">
<Header />
<main>
{@render children()}
</main>
</div>
</Defender>
...Component Props
onLoad: A callback function that is executed when the DataUnlocker script has successfully loaded, and the wrapped content becomes interactive.onError: A callback function that is executed if the DataUnlocker script fails to load. The wrapped content stays stale in this case.
Contributing
Contributions are welcome! Please open an issue or submit a pull request on our GitHub repository.
License
This package is licensed under the MIT License.