add tailwindcss animate to docs

package.json

@@ -63,6 +63,7 @@
 		"svelte-wrap-balancer": "^0.0.4",
 		"tailwind-variants": "^0.1.13",
 		"tailwindcss": "^3.3.2",
+		"tailwindcss-animate": "^1.0.6",
 		"tslib": "^2.4.1",
 		"typescript": "^5.0.0",
 		"unist-util-visit": "^5.0.0",

src/routes/docs/sink/+page.svelte

@@ -0,0 +1,35 @@
+<script lang="ts">
+	import * as Sheet from "@/components/ui/sheet";
+	import * as Button from "@/components/ui/button";
+	import * as Label from "@/components/ui/label";
+	import * as Input from "@/components/ui/input";
+</script>
+
+<Sheet.Root>
+	<Sheet.Trigger asChild let:builder>
+		<Button.Root builders={[builder]} variant="outline">Open</Button.Root>
+	</Sheet.Trigger>
+	<Sheet.Content side="right">
+		<Sheet.Header>
+			<Sheet.Title>Edit profile</Sheet.Title>
+			<Sheet.Description>
+				Make changes to your profile here. Click save when you're done.
+			</Sheet.Description>
+		</Sheet.Header>
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-4 items-center gap-4">
+				<Label.Root for="name" class="text-right">Name</Label.Root>
+				<Input.Root id="name" value="Pedro Duarte" class="col-span-3" />
+			</div>
+			<div class="grid grid-cols-4 items-center gap-4">
+				<Label.Root for="username" class="text-right">Username</Label.Root>
+				<Input.Root id="username" value="@peduarte" class="col-span-3" />
+			</div>
+		</div>
+		<Sheet.Footer>
+			<Sheet.Close asChild let:builder>
+				<Button.Root builders={[builder]} type="submit">Save changes</Button.Root>
+			</Sheet.Close>
+		</Sheet.Footer>
+	</Sheet.Content>
+</Sheet.Root>

tailwind.config.ts

@@ -2,6 +2,8 @@ import type { Config } from "tailwindcss";
 import { fontFamily } from "tailwindcss/defaultTheme";
 import plugin from "tailwindcss/plugin";
 import typography from "@tailwindcss/typography";
+import tailwindcssAnimate from "tailwindcss-animate";
+
 export default {
 	darkMode: "class",
 	content: ["./src/**/*.{html,js,svelte,ts}"],
@@ -60,6 +62,7 @@ export default {
 		}
 	},
 	plugins: [
+		tailwindcssAnimate,
 		typography,
 		plugin(function ({ theme, matchUtilities }) {
 			// Square utility