add YouTubeLite.svelte, closes #195

package.json

@@ -25,6 +25,7 @@
 	},
 	"devDependencies": {
 		"@babel/core": "7.19.3",
+		"@justinribeiro/lite-youtube": "^1.4.0",
 		"@storybook/addon-a11y": "6.5.12",
 		"@storybook/addon-actions": "6.5.12",
 		"@storybook/addon-essentials": "6.5.12",

src/lib/YouTubeLite.svelte

@@ -0,0 +1,13 @@
+<script type="ts">
+	export let id: string;
+	export let title = 'YouTube Video';
+
+	onMount(async () => {
+		await import('@justinribeiro/lite-youtube');
+	});
+	import { onMount } from 'svelte';
+</script>
+
+<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
+	<lite-youtube videoid={id} videotitle={title} />
+</div>

src/stories/YouTubeLite.stories.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+	import { Meta, Template, Story } from '@storybook/addon-svelte-csf';
+	import YouTubeLite from '$lib/YouTubeLite.svelte';
+</script>
+
+<Meta
+	title="Embeds/YouTube Lite"
+	component={YouTubeLite}
+	argTypes={{
+		title: { control: 'text' },
+		id: { control: 'text' }
+	}}
+/>
+
+<Template let:args><YouTubeLite {...args} /></Template>
+
+<Story
+	name="standard"
+	args={{ id: 'dByckr7h1Zk', title: 'Video Title' }}
+	parameters={{ chromatic: { disableSnapshot: true } }}
+/>