diff --git a/bun.lockb b/bun.lockb
index df67a53..6b812f7 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index e9f1e5b..fe62aa2 100644
--- a/package.json
+++ b/package.json
@@ -19,43 +19,43 @@
 	"devDependencies": {
 		"@oslojs/crypto": "^1.0.1",
 		"@oslojs/encoding": "^1.1.0",
-		"@sveltejs/adapter-auto": "^3.0.0",
+		"@sveltejs/adapter-auto": "^3.3.1",
 		"@sveltejs/adapter-node": "^5.2.11",
 		"@sveltejs/kit": "^2.15.0",
-		"@sveltejs/vite-plugin-svelte": "^4.0.0",
+		"@sveltejs/vite-plugin-svelte": "^5.0.3",
 		"@tailwindcss/container-queries": "^0.1.1",
 		"@tailwindcss/forms": "^0.5.9",
 		"@tailwindcss/typography": "^0.5.15",
-		"@types/better-sqlite3": "^7.6.11",
-		"@types/eslint": "^9.6.0",
+		"@types/better-sqlite3": "^7.6.12",
+		"@types/eslint": "^9.6.1",
 		"@types/qrcode-svg": "^1.1.5",
-		"arctic": "^2.2.1",
+		"arctic": "^2.3.3",
 		"autoprefixer": "^10.4.20",
-		"bits-ui": "^1.0.0-next.74",
+		"bits-ui": "^0.22.0",
 		"clsx": "^2.1.1",
-		"eslint": "^9.7.0",
+		"eslint": "^9.17.0",
 		"eslint-config-prettier": "^9.1.0",
-		"eslint-plugin-svelte": "^2.36.0",
-		"globals": "^15.0.0",
+		"eslint-plugin-svelte": "^2.46.1",
+		"globals": "^15.14.0",
 		"ip-address": "^10.0.1",
 		"lucide-svelte": "^0.469.0",
-		"prettier": "^3.3.2",
-		"prettier-plugin-svelte": "^3.2.6",
-		"prettier-plugin-tailwindcss": "^0.6.5",
+		"prettier": "^3.4.2",
+		"prettier-plugin-svelte": "^3.3.2",
+		"prettier-plugin-tailwindcss": "^0.6.9",
 		"qrcode-svg": "^1.1.0",
-		"svelte": "^5.0.0",
-		"svelte-check": "^4.0.0",
+		"svelte": "^5.16.0",
+		"svelte-check": "^4.1.1",
 		"tailwind-merge": "^2.6.0",
 		"tailwind-variants": "^0.3.0",
-		"tailwindcss": "^3.4.9",
+		"tailwindcss": "^3.4.17",
 		"tailwindcss-animate": "^1.0.7",
-		"typescript": "^5.0.0",
-		"typescript-eslint": "^8.0.0",
-		"vite": "^5.0.3"
+		"typescript": "^5.7.2",
+		"typescript-eslint": "^8.18.2",
+		"vite": "^6.0.6"
 	},
 	"dependencies": {
 		"@libsql/client": "^0.14.0",
 		"drizzle-kit": "^0.30.1",
-		"drizzle-orm": "^0.38.2"
+		"drizzle-orm": "^0.38.3"
 	}
 }
diff --git a/src/lib/components/ui/dialog/dialog-description.svelte b/src/lib/components/ui/dialog/dialog-description.svelte
index bc048e4..0272457 100644
--- a/src/lib/components/ui/dialog/dialog-description.svelte
+++ b/src/lib/components/ui/dialog/dialog-description.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: DialogPrimitive.DescriptionProps = $props();
 </script>
@@ -13,4 +14,6 @@
 	bind:ref
 	class={cn("text-muted-foreground text-sm", className)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</DialogPrimitive.Description>
diff --git a/src/lib/components/ui/dialog/dialog-overlay.svelte b/src/lib/components/ui/dialog/dialog-overlay.svelte
index 05c30ac..1fe9593 100644
--- a/src/lib/components/ui/dialog/dialog-overlay.svelte
+++ b/src/lib/components/ui/dialog/dialog-overlay.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: DialogPrimitive.OverlayProps = $props();
 </script>
@@ -16,4 +17,6 @@
 		className
 	)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</DialogPrimitive.Overlay>
diff --git a/src/lib/components/ui/dialog/dialog-title.svelte b/src/lib/components/ui/dialog/dialog-title.svelte
index 9cf592c..4346b52 100644
--- a/src/lib/components/ui/dialog/dialog-title.svelte
+++ b/src/lib/components/ui/dialog/dialog-title.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: DialogPrimitive.TitleProps = $props();
 </script>
@@ -13,4 +14,6 @@
 	bind:ref
 	class={cn("text-lg font-semibold leading-none tracking-tight", className)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</DialogPrimitive.Title>
diff --git a/src/lib/components/ui/label/label.svelte b/src/lib/components/ui/label/label.svelte
index 247d23c..35d0619 100644
--- a/src/lib/components/ui/label/label.svelte
+++ b/src/lib/components/ui/label/label.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: LabelPrimitive.RootProps = $props();
 </script>
@@ -16,4 +17,6 @@
 		className
 	)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</LabelPrimitive.Root>
diff --git a/src/lib/components/ui/tabs/tabs-content.svelte b/src/lib/components/ui/tabs/tabs-content.svelte
index f1c0515..a25fe81 100644
--- a/src/lib/components/ui/tabs/tabs-content.svelte
+++ b/src/lib/components/ui/tabs/tabs-content.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: TabsPrimitive.ContentProps = $props();
 </script>
@@ -16,4 +17,6 @@
 		className
 	)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</TabsPrimitive.Content>
diff --git a/src/lib/components/ui/tabs/tabs-list.svelte b/src/lib/components/ui/tabs/tabs-list.svelte
index f03e5fc..2381115 100644
--- a/src/lib/components/ui/tabs/tabs-list.svelte
+++ b/src/lib/components/ui/tabs/tabs-list.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: TabsPrimitive.ListProps = $props();
 </script>
@@ -16,4 +17,6 @@
 		className
 	)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</TabsPrimitive.List>
diff --git a/src/lib/components/ui/tabs/tabs-trigger.svelte b/src/lib/components/ui/tabs/tabs-trigger.svelte
index f1f5825..d36f608 100644
--- a/src/lib/components/ui/tabs/tabs-trigger.svelte
+++ b/src/lib/components/ui/tabs/tabs-trigger.svelte
@@ -5,6 +5,7 @@
 	let {
 		ref = $bindable(null),
 		class: className,
+		children,
 		...restProps
 	}: TabsPrimitive.TriggerProps = $props();
 </script>
@@ -16,4 +17,6 @@
 		className
 	)}
 	{...restProps}
-/>
+>
+	{@render children?.()}
+</TabsPrimitive.Trigger>
diff --git a/src/routes/clients/+page.svelte b/src/routes/clients/+page.svelte
index 20e6fef..853f68d 100644
--- a/src/routes/clients/+page.svelte
+++ b/src/routes/clients/+page.svelte
@@ -2,7 +2,7 @@
 	import * as Table from '$lib/components/ui/table';
 	import * as Dialog from '$lib/components/ui/dialog';
 	import { Badge } from '$lib/components/ui/badge';
-	import { Button } from '$lib/components/ui/button';
+	import { Button, buttonVariants } from '$lib/components/ui/button';
 	import { Input } from '$lib/components/ui/input';
 	import { LucidePlus } from 'lucide-svelte';
 	import type { PageData } from './$types';
@@ -64,11 +64,9 @@
 <!--Not sure if this is the best place for the input field, will think about it later-->
 <div class="mt-auto flex self-end pt-4">
 	<Dialog.Root bind:open={dialogOpen}>
-		<Dialog.Trigger asChild let:builder>
-			<Button builders={[builder]}>
-				<LucidePlus class="mr-2 h-4 w-4" />
-				Add Client
-			</Button>
+		<Dialog.Trigger class={buttonVariants({ variant: "default" }) + "flex gap-4"}>
+			<LucidePlus />
+			Add Client
 		</Dialog.Trigger>
 		<Dialog.Content class="max-w-xs">
 			<form class="contents" method="post" action="?/create">