svelte/packages/svelte/tests/runtime-browser/custom-elements-samples/reflect-attributes/main.svelte

<svelte:options
	customElement={{
		tag: 'custom-element',
		props: { red: { reflect: true, type: 'Boolean' } }
	}}
/>

<script>
	import './my-widget.svelte';
	export let red;
	red;
</script>

<div>hi</div>
<p>hi</p>
<button on:click={() => (red = false)}>off</button>
<my-widget {red} white></my-widget>

<style>
	:host([red]) div {
		color: red;
	}
	:host([white]) p {
		color: white;
	}
</style>