ui: update shadcn components

src/lib/components/app/auth-form/auth-form.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { LucideLoaderCircle } from 'lucide-svelte';
+	import { LucideLoaderCircle } from '@lucide/svelte';
 	import { Button } from '$lib/components/ui/button';
 	import { cn } from '$lib/utils.js';
 	import googleIcon from '$lib/assets/google.svg';

src/lib/components/app/code-snippet/code-snippet.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { Button } from '$lib/components/ui/button';
-	import { LucideClipboardCopy, LucideDownload } from 'lucide-svelte';
+	import { LucideClipboardCopy, LucideDownload } from '@lucide/svelte';
 
 	const {
 		data,

src/lib/components/ui/badge/badge.svelte

@@ -43,7 +43,7 @@
 	this={href ? "a" : "span"}
 	bind:this={ref}
 	{href}
-	class={cn(badgeVariants({ variant, className }))}
+	class={cn(badgeVariants({ variant }), className)}
 	{...restProps}
 >
 	{@render children?.()}

src/lib/components/ui/button/button.svelte

@@ -56,7 +56,7 @@
 {#if href}
 	<a
 		bind:this={ref}
-		class={cn(buttonVariants({ variant, size, className }))}
+		class={cn(buttonVariants({ variant, size }), className)}
 		{href}
 		{...restProps}
 	>
@@ -65,7 +65,7 @@
 {:else}
 	<button
 		bind:this={ref}
-		class={cn(buttonVariants({ variant, size, className }))}
+		class={cn(buttonVariants({ variant, size }), className)}
 		{type}
 		{...restProps}
 	>

src/lib/components/ui/checkbox/checkbox.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { Checkbox as CheckboxPrimitive, type WithoutChildrenOrChild } from "bits-ui";
-	import Check from "lucide-svelte/icons/check";
-	import Minus from "lucide-svelte/icons/minus";
+	import Check from "@lucide/svelte/icons/check";
+	import Minus from "@lucide/svelte/icons/minus";
 	import { cn } from "$lib/utils.js";
 
 	let {

src/lib/components/ui/dialog/dialog-content.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { Dialog as DialogPrimitive, type WithoutChildrenOrChild } from "bits-ui";
-	import X from "lucide-svelte/icons/x";
+	import X from "@lucide/svelte/icons/x";
 	import type { Snippet } from "svelte";
 	import * as Dialog from "./index.js";
 	import { cn } from "$lib/utils.js";
@@ -17,7 +17,7 @@
 	} = $props();
 </script>
 
-<Dialog.Portal class="absolute" {...portalProps}>
+<Dialog.Portal {...portalProps}>
 	<Dialog.Overlay />
 	<DialogPrimitive.Content
 		bind:ref

src/lib/components/ui/dialog/dialog-description.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: DialogPrimitive.DescriptionProps = $props();
 </script>
@@ -14,6 +13,4 @@
 	bind:ref
 	class={cn("text-muted-foreground text-sm", className)}
 	{...restProps}
->
-	{@render children?.()}
-</DialogPrimitive.Description>
+/>

src/lib/components/ui/dialog/dialog-overlay.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: DialogPrimitive.OverlayProps = $props();
 </script>
@@ -17,6 +16,4 @@
 		className
 	)}
 	{...restProps}
->
-	{@render children?.()}
-</DialogPrimitive.Overlay>
+/>

src/lib/components/ui/dialog/dialog-title.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: DialogPrimitive.TitleProps = $props();
 </script>
@@ -14,6 +13,4 @@
 	bind:ref
 	class={cn("text-lg font-semibold leading-none tracking-tight", className)}
 	{...restProps}
->
-	{@render children?.()}
-</DialogPrimitive.Title>
+/>

src/lib/components/ui/input/input.svelte

@@ -1,22 +1,46 @@
 <script lang="ts">
-	import type { HTMLInputAttributes } from "svelte/elements";
+	import type { HTMLInputAttributes, HTMLInputTypeAttribute } from "svelte/elements";
 	import type { WithElementRef } from "bits-ui";
 	import { cn } from "$lib/utils.js";
 
+	type InputType = Exclude<HTMLInputTypeAttribute, "file">;
+
+	type Props = WithElementRef<
+		Omit<HTMLInputAttributes, "type"> &
+			({ type: "file"; files?: FileList } | { type?: InputType; files?: undefined })
+	>;
+
 	let {
 		ref = $bindable(null),
 		value = $bindable(),
+		type,
+		files = $bindable(),
 		class: className,
 		...restProps
-	}: WithElementRef<HTMLInputAttributes> = $props();
+	}: Props = $props();
 </script>
 
-<input
-	bind:this={ref}
-	class={cn(
-		"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-base file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-		className
-	)}
-	bind:value
-	{...restProps}
-/>
+{#if type === "file"}
+	<input
+		bind:this={ref}
+		class={cn(
+			"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-base file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+			className
+		)}
+		type="file"
+		bind:files
+		bind:value
+		{...restProps}
+	/>
+{:else}
+	<input
+		bind:this={ref}
+		class={cn(
+			"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-base file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+			className
+		)}
+		{type}
+		bind:value
+		{...restProps}
+	/>
+{/if}

src/lib/components/ui/label/label.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: LabelPrimitive.RootProps = $props();
 </script>
@@ -17,6 +16,4 @@
 		className
 	)}
 	{...restProps}
->
-	{@render children?.()}
-</LabelPrimitive.Root>
+/>

src/lib/components/ui/tabs/tabs-content.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: TabsPrimitive.ContentProps = $props();
 </script>
@@ -17,6 +16,4 @@
 		className
 	)}
 	{...restProps}
->
-	{@render children?.()}
-</TabsPrimitive.Content>
+/>

src/lib/components/ui/tabs/tabs-list.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: TabsPrimitive.ListProps = $props();
 </script>
@@ -17,6 +16,4 @@
 		className
 	)}
 	{...restProps}
->
-	{@render children?.()}
-</TabsPrimitive.List>
+/>

src/lib/components/ui/tabs/tabs-trigger.svelte

@@ -5,7 +5,6 @@
 	let {
 		ref = $bindable(null),
 		class: className,
-		children,
 		...restProps
 	}: TabsPrimitive.TriggerProps = $props();
 </script>
@@ -17,6 +16,4 @@
 		className
 	)}
 	{...restProps}
->
-	{@render children?.()}
-</TabsPrimitive.Trigger>
+/>