starred/MediaManager
1
0
Fork 0
mirror of https://github.com/maxdorninger/MediaManager.git synced 2026-04-19 10:54:11 +02:00
Code Issues Packages Projects Releases Wiki Activity

format files

Browse Source
This commit is contained in:
maxDorninger
2025-08-11 21:40:02 +02:00
parent 82edbe73d8
commit dfa58b8f71
260 changed files with 1397 additions and 1400 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
web/src/lib/components/ui/accordion/accordion-content.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Accordion as AccordionPrimitive, type WithoutChild } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Accordion as AccordionPrimitive, type WithoutChild } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,12 +13,12 @@
<AccordionPrimitive.Content
bind:ref
class={cn(
"data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
'data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm',
className
)}
{...restProps}
>
<div class="pb-4 pt-0">
<div class="pt-0 pb-4">
{@render children?.()}
</div>
</AccordionPrimitive.Content>

6
web/src/lib/components/ui/accordion/accordion-item.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Accordion as AccordionPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Accordion as AccordionPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -9,4 +9,4 @@
}: AccordionPrimitive.ItemProps = $props();
</script>
<AccordionPrimitive.Item bind:ref class={cn("border-b", className)} {...restProps} />
<AccordionPrimitive.Item bind:ref class={cn('border-b', className)} {...restProps} />

14
web/src/lib/components/ui/accordion/accordion-trigger.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { Accordion as AccordionPrimitive, type WithoutChild } from "bits-ui";
import ChevronDown from "@lucide/svelte/icons/chevron-down";
import { cn } from "$lib/utils.js";
import { Accordion as AccordionPrimitive, type WithoutChild } from 'bits-ui';
import ChevronDown from '@lucide/svelte/icons/chevron-down';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -10,7 +10,7 @@
children,
...restProps
}: WithoutChild<AccordionPrimitive.TriggerProps> & {
level?: AccordionPrimitive.HeaderProps["level"];
level?: AccordionPrimitive.HeaderProps['level'];
} = $props();
</script>
@@ -18,14 +18,12 @@
<AccordionPrimitive.Trigger
bind:ref
class={cn(
"flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
'flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180',
className
)}
{...restProps}
>
{@render children?.()}
<ChevronDown
class="text-muted-foreground size-4 shrink-0 transition-transform duration-200"
/>
<ChevronDown class="text-muted-foreground size-4 shrink-0 transition-transform duration-200" />
</AccordionPrimitive.Trigger>
</AccordionPrimitive.Header>

10
web/src/lib/components/ui/accordion/index.ts
View File

@@ -1,7 +1,7 @@
import { Accordion as AccordionPrimitive } from "bits-ui";
import Content from "./accordion-content.svelte";
import Item from "./accordion-item.svelte";
import Trigger from "./accordion-trigger.svelte";
import { Accordion as AccordionPrimitive } from 'bits-ui';
import Content from './accordion-content.svelte';
import Item from './accordion-item.svelte';
import Trigger from './accordion-trigger.svelte';
const Root = AccordionPrimitive.Root;
export {
@@ -13,5 +13,5 @@ export {
Root as Accordion,
Content as AccordionContent,
Item as AccordionItem,
Trigger as AccordionTrigger,
Trigger as AccordionTrigger
};

6
web/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
import { buttonVariants } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils.js";
import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
import { buttonVariants } from '$lib/components/ui/button/index.js';
import { cn } from '$lib/utils.js';
let {
class: className,

8
web/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
import { buttonVariants } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils.js";
import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
import { buttonVariants } from '$lib/components/ui/button/index.js';
import { cn } from '$lib/utils.js';
let {
class: className,
@@ -12,6 +12,6 @@
<AlertDialogPrimitive.Cancel
bind:ref
class={cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className)}
class={cn(buttonVariants({ variant: 'outline' }), 'mt-2 sm:mt-0', className)}
{...restProps}
/>

8
web/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { AlertDialog as AlertDialogPrimitive, type WithoutChild } from "bits-ui";
import AlertDialogOverlay from "./alert-dialog-overlay.svelte";
import { cn } from "$lib/utils.js";
import { AlertDialog as AlertDialogPrimitive, type WithoutChild } from 'bits-ui';
import AlertDialogOverlay from './alert-dialog-overlay.svelte';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -18,7 +18,7 @@
<AlertDialogPrimitive.Content
bind:ref
class={cn(
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg",
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg',
className
)}
{...restProps}

6
web/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
class: className,
@@ -11,6 +11,6 @@
<AlertDialogPrimitive.Description
bind:ref
class={cn("text-muted-foreground text-sm", className)}
class={cn('text-muted-foreground text-sm', className)}
{...restProps}
/>

8
web/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
class={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
{...restProps}
>
{@render children?.()}

8
web/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("flex flex-col space-y-2 text-center sm:text-left", className)}
class={cn('flex flex-col space-y-2 text-center sm:text-left', className)}
{...restProps}
>
{@render children?.()}

6
web/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
class: className,
@@ -12,7 +12,7 @@
<AlertDialogPrimitive.Overlay
bind:ref
class={cn(
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80",
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80',
className
)}
{...restProps}

6
web/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
class: className,
@@ -12,7 +12,7 @@
<AlertDialogPrimitive.Title
bind:ref
class={cn("text-lg font-semibold", className)}
class={cn('text-lg font-semibold', className)}
{level}
{...restProps}
/>

20
web/src/lib/components/ui/alert-dialog/index.ts
View File

@@ -1,13 +1,13 @@
import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
import Title from "./alert-dialog-title.svelte";
import Action from "./alert-dialog-action.svelte";
import Cancel from "./alert-dialog-cancel.svelte";
import Footer from "./alert-dialog-footer.svelte";
import Header from "./alert-dialog-header.svelte";
import Overlay from "./alert-dialog-overlay.svelte";
import Content from "./alert-dialog-content.svelte";
import Description from "./alert-dialog-description.svelte";
import Title from './alert-dialog-title.svelte';
import Action from './alert-dialog-action.svelte';
import Cancel from './alert-dialog-cancel.svelte';
import Footer from './alert-dialog-footer.svelte';
import Header from './alert-dialog-header.svelte';
import Overlay from './alert-dialog-overlay.svelte';
import Content from './alert-dialog-content.svelte';
import Description from './alert-dialog-description.svelte';
const Root = AlertDialogPrimitive.Root;
const Trigger = AlertDialogPrimitive.Trigger;
@@ -36,5 +36,5 @@ export {
Trigger as AlertDialogTrigger,
Overlay as AlertDialogOverlay,
Content as AlertDialogContent,
Description as AlertDialogDescription,
Description as AlertDialogDescription
};

8
web/src/lib/components/ui/alert/alert-description.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div bind:this={ref} class={cn("text-sm [&_p]:leading-relaxed", className)} {...restProps}>
<div bind:this={ref} class={cn('text-sm [&_p]:leading-relaxed', className)} {...restProps}>
{@render children?.()}
</div>

8
web/src/lib/components/ui/alert/alert-title.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import type { WithElementRef } from "bits-ui";
import { cn } from "$lib/utils.js";
import type { HTMLAttributes } from 'svelte/elements';
import type { WithElementRef } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -17,7 +17,7 @@
<div
bind:this={ref}
aria-level={level}
class={cn("mb-1 font-medium leading-none tracking-tight", className)}
class={cn('mb-1 leading-none font-medium tracking-tight', className)}
{...restProps}
>
{@render children?.()}

24
web/src/lib/components/ui/alert/alert.svelte
View File

@@ -1,32 +1,32 @@
<script lang="ts" module>
import { type VariantProps, tv } from "tailwind-variants";
import { type VariantProps, tv } from 'tailwind-variants';
export const alertVariants = tv({
base: "[&>svg]:text-foreground relative w-full rounded-lg border px-4 py-3 text-sm [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg~*]:pl-7",
base: '[&>svg]:text-foreground relative w-full rounded-lg border px-4 py-3 text-sm [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg~*]:pl-7',
variants: {
variant: {
default: "bg-background text-foreground",
default: 'bg-background text-foreground',
destructive:
"border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
},
'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive'
}
},
defaultVariants: {
variant: "default",
},
variant: 'default'
}
});
export type AlertVariant = VariantProps<typeof alertVariants>["variant"];
export type AlertVariant = VariantProps<typeof alertVariants>['variant'];
</script>
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import type { WithElementRef } from "bits-ui";
import { cn } from "$lib/utils.js";
import type { HTMLAttributes } from 'svelte/elements';
import type { WithElementRef } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
class: className,
variant = "default",
variant = 'default',
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> & {

10
web/src/lib/components/ui/alert/index.ts
View File

@@ -1,7 +1,7 @@
import Root from "./alert.svelte";
import Description from "./alert-description.svelte";
import Title from "./alert-title.svelte";
export { alertVariants, type AlertVariant } from "./alert.svelte";
import Root from './alert.svelte';
import Description from './alert-description.svelte';
import Title from './alert-title.svelte';
export { alertVariants, type AlertVariant } from './alert.svelte';
export {
Root,
@@ -10,5 +10,5 @@ export {
//
Root as Alert,
Description as AlertDescription,
Title as AlertTitle,
Title as AlertTitle
};

6
web/src/lib/components/ui/avatar/avatar-fallback.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Avatar as AvatarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Avatar as AvatarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
class: className,
@@ -11,6 +11,6 @@
<AvatarPrimitive.Fallback
bind:ref
class={cn("bg-muted flex size-full items-center justify-center", className)}
class={cn('bg-muted flex size-full items-center justify-center', className)}
{...restProps}
/>

6
web/src/lib/components/ui/avatar/avatar-image.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Avatar as AvatarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Avatar as AvatarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
class: className,
@@ -15,6 +15,6 @@
bind:ref
{src}
{alt}
class={cn("aspect-square size-full", className)}
class={cn('aspect-square size-full', className)}
{...restProps}
/>

8
web/src/lib/components/ui/avatar/avatar.svelte
View File

@@ -1,11 +1,11 @@
<script lang="ts">
import { Avatar as AvatarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Avatar as AvatarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
class: className,
ref = $bindable(null),
loadingStatus = $bindable("loading"),
loadingStatus = $bindable('loading'),
...restProps
}: AvatarPrimitive.RootProps = $props();
</script>
@@ -13,6 +13,6 @@
<AvatarPrimitive.Root
bind:loadingStatus
bind:ref
class={cn("relative flex size-10 shrink-0 overflow-hidden rounded-full", className)}
class={cn('relative flex size-10 shrink-0 overflow-hidden rounded-full', className)}
{...restProps}
/>

8
web/src/lib/components/ui/avatar/index.ts
View File

@@ -1,6 +1,6 @@
import Root from "./avatar.svelte";
import Image from "./avatar-image.svelte";
import Fallback from "./avatar-fallback.svelte";
import Root from './avatar.svelte';
import Image from './avatar-image.svelte';
import Fallback from './avatar-fallback.svelte';
export {
Root,
@@ -9,5 +9,5 @@ export {
//
Root as Avatar,
Image as AvatarImage,
Fallback as AvatarFallback,
Fallback as AvatarFallback
};

31
web/src/lib/components/ui/badge/badge.svelte
View File

@@ -1,36 +1,35 @@
<script lang="ts" module>
import { type VariantProps, tv } from "tailwind-variants";
import { type VariantProps, tv } from 'tailwind-variants';
export const badgeVariants = tv({
base: "focus:ring-ring inline-flex select-none items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2",
base: 'focus:ring-ring inline-flex select-none items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2',
variants: {
variant: {
default:
"bg-primary text-primary-foreground hover:bg-primary/80 border-transparent shadow",
default: 'bg-primary text-primary-foreground hover:bg-primary/80 border-transparent shadow',
secondary:
"bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent",
'bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent',
destructive:
"bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent shadow",
outline: "text-foreground",
},
'bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent shadow',
outline: 'text-foreground'
}
},
defaultVariants: {
variant: "default",
},
variant: 'default'
}
});
export type BadgeVariant = VariantProps<typeof badgeVariants>["variant"];
export type BadgeVariant = VariantProps<typeof badgeVariants>['variant'];
</script>
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAnchorAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAnchorAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
href,
class: className,
variant = "default",
variant = 'default',
children,
...restProps
}: WithElementRef<HTMLAnchorAttributes> & {
@@ -39,7 +38,7 @@
</script>
<svelte:element
this={href ? "a" : "span"}
this={href ? 'a' : 'span'}
bind:this={ref}
{href}
class={cn(badgeVariants({ variant }), className)}

4
web/src/lib/components/ui/badge/index.ts
View File

@@ -1,2 +1,2 @@
export { default as Badge } from "./badge.svelte";
export { badgeVariants, type BadgeVariant } from "./badge.svelte";
export { default as Badge } from './badge.svelte';
export { badgeVariants, type BadgeVariant } from './badge.svelte';

10
web/src/lib/components/ui/breadcrumb/breadcrumb-ellipsis.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import Ellipsis from "@lucide/svelte/icons/ellipsis";
import type { WithElementRef, WithoutChildren } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import Ellipsis from '@lucide/svelte/icons/ellipsis';
import type { WithElementRef, WithoutChildren } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -15,7 +15,7 @@
bind:this={ref}
role="presentation"
aria-hidden="true"
class={cn("flex size-9 items-center justify-center", className)}
class={cn('flex size-9 items-center justify-center', className)}
{...restProps}
>
<Ellipsis class="size-4" />

8
web/src/lib/components/ui/breadcrumb/breadcrumb-item.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLLiAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLLiAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
}: WithElementRef<HTMLLiAttributes> = $props();
</script>
<li bind:this={ref} class={cn("inline-flex items-center gap-1.5", className)} {...restProps}>
<li bind:this={ref} class={cn('inline-flex items-center gap-1.5', className)} {...restProps}>
{@render children?.()}
</li>

12
web/src/lib/components/ui/breadcrumb/breadcrumb-link.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import type { HTMLAnchorAttributes } from "svelte/elements";
import type { Snippet } from "svelte";
import type { WithElementRef } from "bits-ui";
import { cn } from "$lib/utils.js";
import type { HTMLAnchorAttributes } from 'svelte/elements';
import type { Snippet } from 'svelte';
import type { WithElementRef } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -16,9 +16,9 @@
} = $props();
const attrs = $derived({
class: cn("hover:text-foreground transition-colors", className),
class: cn('hover:text-foreground transition-colors', className),
href,
...restProps,
...restProps
});
</script>

8
web/src/lib/components/ui/breadcrumb/breadcrumb-list.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLOlAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLOlAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -14,7 +14,7 @@
<ol
bind:this={ref}
class={cn(
"text-muted-foreground flex flex-wrap items-center gap-1.5 break-words text-sm sm:gap-2.5",
'text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5',
className
)}
{...restProps}

8
web/src/lib/components/ui/breadcrumb/breadcrumb-page.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -16,7 +16,7 @@
role="link"
aria-disabled="true"
aria-current="page"
class={cn("text-foreground font-normal", className)}
class={cn('text-foreground font-normal', className)}
{...restProps}
>
{@render children?.()}

10
web/src/lib/components/ui/breadcrumb/breadcrumb-separator.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import ChevronRight from "@lucide/svelte/icons/chevron-right";
import type { WithElementRef } from "bits-ui";
import type { HTMLLiAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import ChevronRight from '@lucide/svelte/icons/chevron-right';
import type { WithElementRef } from 'bits-ui';
import type { HTMLLiAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -15,7 +15,7 @@
<li
role="presentation"
aria-hidden="true"
class={cn("[&>svg]:size-3.5", className)}
class={cn('[&>svg]:size-3.5', className)}
bind:this={ref}
{...restProps}
>

4
web/src/lib/components/ui/breadcrumb/breadcrumb.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
let {
ref = $bindable(),

16
web/src/lib/components/ui/breadcrumb/index.ts
View File

@@ -1,10 +1,10 @@
import Root from "./breadcrumb.svelte";
import Ellipsis from "./breadcrumb-ellipsis.svelte";
import Item from "./breadcrumb-item.svelte";
import Separator from "./breadcrumb-separator.svelte";
import Link from "./breadcrumb-link.svelte";
import List from "./breadcrumb-list.svelte";
import Page from "./breadcrumb-page.svelte";
import Root from './breadcrumb.svelte';
import Ellipsis from './breadcrumb-ellipsis.svelte';
import Item from './breadcrumb-item.svelte';
import Separator from './breadcrumb-separator.svelte';
import Link from './breadcrumb-link.svelte';
import List from './breadcrumb-list.svelte';
import Page from './breadcrumb-page.svelte';
export {
Root,
@@ -21,5 +21,5 @@ export {
Separator as BreadcrumbSeparator,
Link as BreadcrumbLink,
List as BreadcrumbList,
Page as BreadcrumbPage,
Page as BreadcrumbPage
};

56
web/src/lib/components/ui/button/button.svelte
View File

@@ -1,36 +1,35 @@
<script lang="ts" module>
import type { WithElementRef } from "bits-ui";
import type { HTMLAnchorAttributes, HTMLButtonAttributes } from "svelte/elements";
import { type VariantProps, tv } from "tailwind-variants";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAnchorAttributes, HTMLButtonAttributes } from 'svelte/elements';
import { type VariantProps, tv } from 'tailwind-variants';
export const buttonVariants = tv({
base: "focus-visible:ring-ring inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
base: 'focus-visible:ring-ring inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
variants: {
variant: {
default: "bg-primary text-primary-foreground hover:bg-primary/90 shadow",
destructive:
"bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm",
default: 'bg-primary text-primary-foreground hover:bg-primary/90 shadow',
destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm',
outline:
"border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm",
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm",
ghost: "hover:bg-accent hover:text-accent-foreground",
link: "text-primary underline-offset-4 hover:underline",
'border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm',
secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm',
ghost: 'hover:bg-accent hover:text-accent-foreground',
link: 'text-primary underline-offset-4 hover:underline'
},
size: {
default: "h-9 px-4 py-2",
sm: "h-8 rounded-md px-3 text-xs",
lg: "h-10 rounded-md px-8",
icon: "h-9 w-9",
},
default: 'h-9 px-4 py-2',
sm: 'h-8 rounded-md px-3 text-xs',
lg: 'h-10 rounded-md px-8',
icon: 'h-9 w-9'
}
},
defaultVariants: {
variant: "default",
size: "default",
},
variant: 'default',
size: 'default'
}
});
export type ButtonVariant = VariantProps<typeof buttonVariants>["variant"];
export type ButtonSize = VariantProps<typeof buttonVariants>["size"];
export type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
export type ButtonSize = VariantProps<typeof buttonVariants>['size'];
export type ButtonProps = WithElementRef<HTMLButtonAttributes> &
WithElementRef<HTMLAnchorAttributes> & {
@@ -40,27 +39,22 @@
</script>
<script lang="ts">
import { cn } from "$lib/utils.js";
import { cn } from '$lib/utils.js';
let {
class: className,
variant = "default",
size = "default",
variant = 'default',
size = 'default',
ref = $bindable(null),
href = undefined,
type = "button",
type = 'button',
children,
...restProps
}: ButtonProps = $props();
</script>
{#if href}
<a
bind:this={ref}
class={cn(buttonVariants({ variant, size }), className)}
{href}
{...restProps}
>
<a bind:this={ref} class={cn(buttonVariants({ variant, size }), className)} {href} {...restProps}>
{@render children?.()}
</a>
{:else}

6
web/src/lib/components/ui/button/index.ts
View File

@@ -2,8 +2,8 @@ import Root, {
type ButtonProps,
type ButtonSize,
type ButtonVariant,
buttonVariants,
} from "./button.svelte";
buttonVariants
} from './button.svelte';
export {
Root,
@@ -13,5 +13,5 @@ export {
buttonVariants,
type ButtonProps,
type ButtonSize,
type ButtonVariant,
type ButtonVariant
};

6
web/src/lib/components/ui/calendar/calendar-cell.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,7 +11,7 @@
<CalendarPrimitive.Cell
class={cn(
"[&:has([data-selected])]:bg-accent [&:has([data-selected][data-outside-month])]:bg-accent/50 relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([data-selected])]:rounded-md",
'[&:has([data-selected])]:bg-accent [&:has([data-selected][data-outside-month])]:bg-accent/50 relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([data-selected])]:rounded-md',
className
)}
bind:ref

20
web/src/lib/components/ui/calendar/calendar-day.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { buttonVariants } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { buttonVariants } from '$lib/components/ui/button/index.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -12,18 +12,18 @@
<CalendarPrimitive.Day
class={cn(
buttonVariants({ variant: "ghost" }),
"size-8 p-0 font-normal",
buttonVariants({ variant: 'ghost' }),
'size-8 p-0 font-normal',
// Today
"[&[data-today]:not([data-selected])]:bg-accent [&[data-today]:not([data-selected])]:text-accent-foreground",
'[&[data-today]:not([data-selected])]:bg-accent [&[data-today]:not([data-selected])]:text-accent-foreground',
// Selected
"data-[selected]:bg-primary data-[selected]:text-primary-foreground data-[selected]:hover:bg-primary data-[selected]:hover:text-primary-foreground data-[selected]:focus:bg-primary data-[selected]:focus:text-primary-foreground data-[selected]:opacity-100",
'data-[selected]:bg-primary data-[selected]:text-primary-foreground data-[selected]:hover:bg-primary data-[selected]:hover:text-primary-foreground data-[selected]:focus:bg-primary data-[selected]:focus:text-primary-foreground data-[selected]:opacity-100',
// Disabled
"data-[disabled]:text-muted-foreground data-[disabled]:opacity-50",
'data-[disabled]:text-muted-foreground data-[disabled]:opacity-50',
// Unavailable
"data-[unavailable]:text-destructive-foreground data-[unavailable]:line-through",
'data-[unavailable]:text-destructive-foreground data-[unavailable]:line-through',
// Outside months
"data-[outside-month]:text-muted-foreground [&[data-outside-month][data-selected]]:bg-accent/50 [&[data-outside-month][data-selected]]:text-muted-foreground data-[outside-month]:pointer-events-none data-[outside-month]:opacity-50 [&[data-outside-month][data-selected]]:opacity-30",
'data-[outside-month]:text-muted-foreground [&[data-outside-month][data-selected]]:bg-accent/50 [&[data-outside-month][data-selected]]:text-muted-foreground data-[outside-month]:pointer-events-none data-[outside-month]:opacity-50 [&[data-outside-month][data-selected]]:opacity-30',
className
)}
bind:ref

4
web/src/lib/components/ui/calendar/calendar-grid-body.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),

4
web/src/lib/components/ui/calendar/calendar-grid-head.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),

6
web/src/lib/components/ui/calendar/calendar-grid-row.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -9,4 +9,4 @@
}: CalendarPrimitive.GridRowProps = $props();
</script>
<CalendarPrimitive.GridRow bind:ref class={cn("flex", className)} {...restProps} />
<CalendarPrimitive.GridRow bind:ref class={cn('flex', className)} {...restProps} />

6
web/src/lib/components/ui/calendar/calendar-grid.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<CalendarPrimitive.Grid
bind:ref
class={cn("w-full border-collapse space-y-1", className)}
class={cn('w-full border-collapse space-y-1', className)}
{...restProps}
/>

6
web/src/lib/components/ui/calendar/calendar-head-cell.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<CalendarPrimitive.HeadCell
bind:ref
class={cn("text-muted-foreground w-8 rounded-md text-[0.8rem] font-normal", className)}
class={cn('text-muted-foreground w-8 rounded-md text-[0.8rem] font-normal', className)}
{...restProps}
/>

6
web/src/lib/components/ui/calendar/calendar-header.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<CalendarPrimitive.Header
bind:ref
class={cn("relative flex w-full items-center justify-between pt-1", className)}
class={cn('relative flex w-full items-center justify-between pt-1', className)}
{...restProps}
/>

6
web/src/lib/components/ui/calendar/calendar-heading.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -9,4 +9,4 @@
}: CalendarPrimitive.HeadingProps = $props();
</script>
<CalendarPrimitive.Heading bind:ref class={cn("text-sm font-medium", className)} {...restProps} />
<CalendarPrimitive.Heading bind:ref class={cn('text-sm font-medium', className)} {...restProps} />

8
web/src/lib/components/ui/calendar/calendar-months.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("mt-4 flex flex-col space-y-4 sm:flex-row sm:space-x-4 sm:space-y-0", className)}
class={cn('mt-4 flex flex-col space-y-4 sm:flex-row sm:space-y-0 sm:space-x-4', className)}
{...restProps}
>
{@render children?.()}

12
web/src/lib/components/ui/calendar/calendar-next-button.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import ChevronRight from "@lucide/svelte/icons/chevron-right";
import { buttonVariants } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import ChevronRight from '@lucide/svelte/icons/chevron-right';
import { buttonVariants } from '$lib/components/ui/button/index.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -19,8 +19,8 @@
<CalendarPrimitive.NextButton
bind:ref
class={cn(
buttonVariants({ variant: "outline" }),
"size-7 bg-transparent p-0 opacity-50 hover:opacity-100",
buttonVariants({ variant: 'outline' }),
'size-7 bg-transparent p-0 opacity-50 hover:opacity-100',
className
)}
{...restProps}

12
web/src/lib/components/ui/calendar/calendar-prev-button.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import { Calendar as CalendarPrimitive } from "bits-ui";
import ChevronLeft from "@lucide/svelte/icons/chevron-left";
import { buttonVariants } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive } from 'bits-ui';
import ChevronLeft from '@lucide/svelte/icons/chevron-left';
import { buttonVariants } from '$lib/components/ui/button/index.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -19,8 +19,8 @@
<CalendarPrimitive.PrevButton
bind:ref
class={cn(
buttonVariants({ variant: "outline" }),
"size-7 bg-transparent p-0 opacity-50 hover:opacity-100",
buttonVariants({ variant: 'outline' }),
'size-7 bg-transparent p-0 opacity-50 hover:opacity-100',
className
)}
{...restProps}

10
web/src/lib/components/ui/calendar/calendar.svelte
View File

@@ -1,14 +1,14 @@
<script lang="ts">
import { Calendar as CalendarPrimitive, type WithoutChildrenOrChild } from "bits-ui";
import * as Calendar from "./index.js";
import { cn } from "$lib/utils.js";
import { Calendar as CalendarPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import * as Calendar from './index.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
value = $bindable(),
placeholder = $bindable(),
class: className,
weekdayFormat = "short",
weekdayFormat = 'short',
...restProps
}: WithoutChildrenOrChild<CalendarPrimitive.RootProps> = $props();
</script>
@@ -22,7 +22,7 @@ get along, so we shut typescript up by casting `value` to `never`.
bind:ref
bind:placeholder
{weekdayFormat}
class={cn("p-3", className)}
class={cn('p-3', className)}
{...restProps}
>
{#snippet children({ months, weekdays })}

28
web/src/lib/components/ui/calendar/index.ts
View File

@@ -1,16 +1,16 @@
import Root from "./calendar.svelte";
import Cell from "./calendar-cell.svelte";
import Day from "./calendar-day.svelte";
import Grid from "./calendar-grid.svelte";
import Header from "./calendar-header.svelte";
import Months from "./calendar-months.svelte";
import GridRow from "./calendar-grid-row.svelte";
import Heading from "./calendar-heading.svelte";
import GridBody from "./calendar-grid-body.svelte";
import GridHead from "./calendar-grid-head.svelte";
import HeadCell from "./calendar-head-cell.svelte";
import NextButton from "./calendar-next-button.svelte";
import PrevButton from "./calendar-prev-button.svelte";
import Root from './calendar.svelte';
import Cell from './calendar-cell.svelte';
import Day from './calendar-day.svelte';
import Grid from './calendar-grid.svelte';
import Header from './calendar-header.svelte';
import Months from './calendar-months.svelte';
import GridRow from './calendar-grid-row.svelte';
import Heading from './calendar-heading.svelte';
import GridBody from './calendar-grid-body.svelte';
import GridHead from './calendar-grid-head.svelte';
import HeadCell from './calendar-head-cell.svelte';
import NextButton from './calendar-next-button.svelte';
import PrevButton from './calendar-prev-button.svelte';
export {
Day,
@@ -26,5 +26,5 @@ export {
NextButton,
PrevButton,
//
Root as Calendar,
Root as Calendar
};

8
web/src/lib/components/ui/card/card-content.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div bind:this={ref} class={cn("p-6", className)} {...restProps}>
<div bind:this={ref} class={cn('p-6', className)} {...restProps}>
{@render children?.()}
</div>

8
web/src/lib/components/ui/card/card-description.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
}: WithElementRef<HTMLAttributes<HTMLParagraphElement>> = $props();
</script>
<p bind:this={ref} class={cn("text-muted-foreground text-sm", className)} {...restProps}>
<p bind:this={ref} class={cn('text-muted-foreground text-sm', className)} {...restProps}>
{@render children?.()}
</p>

8
web/src/lib/components/ui/card/card-footer.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div bind:this={ref} class={cn("flex items-center p-6 pt-0", className)} {...restProps}>
<div bind:this={ref} class={cn('flex items-center p-6 pt-0', className)} {...restProps}>
{@render children?.()}
</div>

8
web/src/lib/components/ui/card/card-header.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div bind:this={ref} class={cn("flex flex-col space-y-1.5 p-6 pb-0", className)} {...restProps}>
<div bind:this={ref} class={cn('flex flex-col space-y-1.5 p-6 pb-0', className)} {...restProps}>
{@render children?.()}
</div>

8
web/src/lib/components/ui/card/card-title.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -18,7 +18,7 @@
role="heading"
aria-level={level}
bind:this={ref}
class={cn("font-semibold leading-none tracking-tight", className)}
class={cn('leading-none font-semibold tracking-tight', className)}
{...restProps}
>
{@render children?.()}

8
web/src/lib/components/ui/card/card.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("bg-card text-card-foreground rounded-xl border shadow", className)}
class={cn('bg-card text-card-foreground rounded-xl border shadow', className)}
{...restProps}
>
{@render children?.()}

14
web/src/lib/components/ui/card/index.ts
View File

@@ -1,9 +1,9 @@
import Root from "./card.svelte";
import Content from "./card-content.svelte";
import Description from "./card-description.svelte";
import Footer from "./card-footer.svelte";
import Header from "./card-header.svelte";
import Title from "./card-title.svelte";
import Root from './card.svelte';
import Content from './card-content.svelte';
import Description from './card-description.svelte';
import Footer from './card-footer.svelte';
import Header from './card-header.svelte';
import Title from './card-title.svelte';
export {
Root,
@@ -18,5 +18,5 @@ export {
Description as CardDescription,
Footer as CardFooter,
Header as CardHeader,
Title as CardTitle,
Title as CardTitle
};

24
web/src/lib/components/ui/carousel/carousel-content.svelte
View File

@@ -1,9 +1,9 @@
<script lang="ts">
import emblaCarouselSvelte from "embla-carousel-svelte";
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { getEmblaContext } from "./context.js";
import { cn } from "$lib/utils.js";
import emblaCarouselSvelte from 'embla-carousel-svelte';
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { getEmblaContext } from './context.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -12,7 +12,7 @@
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
const emblaCtx = getEmblaContext("<Carousel.Content/>");
const emblaCtx = getEmblaContext('<Carousel.Content/>');
</script>
<!-- svelte-ignore event_directive_deprecated -->
@@ -20,20 +20,20 @@
class="overflow-hidden"
use:emblaCarouselSvelte={{
options: {
container: "[data-embla-container]",
slides: "[data-embla-slide]",
container: '[data-embla-container]',
slides: '[data-embla-slide]',
...emblaCtx.options,
axis: emblaCtx.orientation === "horizontal" ? "x" : "y",
axis: emblaCtx.orientation === 'horizontal' ? 'x' : 'y'
},
plugins: emblaCtx.plugins,
plugins: emblaCtx.plugins
}}
on:emblaInit={emblaCtx.onInit}
>
<div
bind:this={ref}
class={cn(
"flex",
emblaCtx.orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
'flex',
emblaCtx.orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col',
className
)}
data-embla-container=""

14
web/src/lib/components/ui/carousel/carousel-item.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { getEmblaContext } from "./context.js";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { getEmblaContext } from './context.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,7 +11,7 @@
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
const emblaCtx = getEmblaContext("<Carousel.Item/>");
const emblaCtx = getEmblaContext('<Carousel.Item/>');
</script>
<div
@@ -19,8 +19,8 @@
role="group"
aria-roledescription="slide"
class={cn(
"min-w-0 shrink-0 grow-0 basis-full",
emblaCtx.orientation === "horizontal" ? "pl-4" : "pt-4",
'min-w-0 shrink-0 grow-0 basis-full',
emblaCtx.orientation === 'horizontal' ? 'pl-4' : 'pt-4',
className
)}
data-embla-slide=""

24
web/src/lib/components/ui/carousel/carousel-next.svelte
View File

@@ -1,29 +1,29 @@
<script lang="ts">
import ArrowRight from "@lucide/svelte/icons/arrow-right";
import type { WithoutChildren } from "bits-ui";
import { getEmblaContext } from "./context.js";
import { cn } from "$lib/utils.js";
import { Button, type Props } from "$lib/components/ui/button/index.js";
import ArrowRight from '@lucide/svelte/icons/arrow-right';
import type { WithoutChildren } from 'bits-ui';
import { getEmblaContext } from './context.js';
import { cn } from '$lib/utils.js';
import { Button, type Props } from '$lib/components/ui/button/index.js';
let {
ref = $bindable(null),
class: className,
variant = "outline",
size = "icon",
variant = 'outline',
size = 'icon',
...restProps
}: WithoutChildren<Props> = $props();
const emblaCtx = getEmblaContext("<Carousel.Next/>");
const emblaCtx = getEmblaContext('<Carousel.Next/>');
</script>
<Button
{variant}
{size}
class={cn(
"absolute size-8 touch-manipulation rounded-full",
emblaCtx.orientation === "horizontal"
? "-right-12 top-1/2 -translate-y-1/2"
: "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
'absolute size-8 touch-manipulation rounded-full',
emblaCtx.orientation === 'horizontal'
? 'top-1/2 -right-12 -translate-y-1/2'
: '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',
className
)}
disabled={!emblaCtx.canScrollNext}

24
web/src/lib/components/ui/carousel/carousel-previous.svelte
View File

@@ -1,29 +1,29 @@
<script lang="ts">
import ArrowLeft from "@lucide/svelte/icons/arrow-left";
import type { WithoutChildren } from "bits-ui";
import { getEmblaContext } from "./context.js";
import { cn } from "$lib/utils.js";
import { Button, type Props } from "$lib/components/ui/button/index.js";
import ArrowLeft from '@lucide/svelte/icons/arrow-left';
import type { WithoutChildren } from 'bits-ui';
import { getEmblaContext } from './context.js';
import { cn } from '$lib/utils.js';
import { Button, type Props } from '$lib/components/ui/button/index.js';
let {
ref = $bindable(null),
class: className,
variant = "outline",
size = "icon",
variant = 'outline',
size = 'icon',
...restProps
}: WithoutChildren<Props> = $props();
const emblaCtx = getEmblaContext("<Carousel.Previous/>");
const emblaCtx = getEmblaContext('<Carousel.Previous/>');
</script>
<Button
{variant}
{size}
class={cn(
"absolute size-8 touch-manipulation rounded-full",
emblaCtx.orientation === "horizontal"
? "-left-12 top-1/2 -translate-y-1/2"
: "-top-12 left-1/2 -translate-x-1/2 rotate-90",
'absolute size-8 touch-manipulation rounded-full',
emblaCtx.orientation === 'horizontal'
? 'top-1/2 -left-12 -translate-y-1/2'
: '-top-12 left-1/2 -translate-x-1/2 rotate-90',
className
)}
disabled={!emblaCtx.canScrollPrev}

22
web/src/lib/components/ui/carousel/carousel.svelte
View File

@@ -3,15 +3,15 @@
type CarouselAPI,
type CarouselProps,
type EmblaContext,
setEmblaContext,
} from "./context.js";
import { cn } from "$lib/utils.js";
setEmblaContext
} from './context.js';
import { cn } from '$lib/utils.js';
let {
opts = {},
plugins = [],
setApi = () => {},
orientation = "horizontal",
orientation = 'horizontal',
class: className,
children,
...restProps
@@ -30,7 +30,7 @@
onInit,
scrollSnaps: [],
selectedIndex: 0,
scrollTo,
scrollTo
});
setEmblaContext(carouselState);
@@ -55,16 +55,16 @@
$effect(() => {
if (carouselState.api) {
onSelect(carouselState.api);
carouselState.api.on("select", onSelect);
carouselState.api.on("reInit", onSelect);
carouselState.api.on('select', onSelect);
carouselState.api.on('reInit', onSelect);
}
});
function handleKeyDown(e: KeyboardEvent) {
if (e.key === "ArrowLeft") {
if (e.key === 'ArrowLeft') {
e.preventDefault();
scrollPrev();
} else if (e.key === "ArrowRight") {
} else if (e.key === 'ArrowRight') {
e.preventDefault();
scrollNext();
}
@@ -82,11 +82,11 @@
$effect(() => {
return () => {
carouselState.api?.off("select", onSelect);
carouselState.api?.off('select', onSelect);
};
});
</script>
<div class={cn("relative", className)} role="region" aria-roledescription="carousel" {...restProps}>
<div class={cn('relative', className)} role="region" aria-roledescription="carousel" {...restProps}>
{@render children?.()}
</div>

24
web/src/lib/components/ui/carousel/context.ts
View File

@@ -1,11 +1,11 @@
import type { EmblaCarouselSvelteType } from "embla-carousel-svelte";
import type emblaCarouselSvelte from "embla-carousel-svelte";
import { getContext, hasContext, setContext } from "svelte";
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import type { EmblaCarouselSvelteType } from 'embla-carousel-svelte';
import type emblaCarouselSvelte from 'embla-carousel-svelte';
import { getContext, hasContext, setContext } from 'svelte';
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
export type CarouselAPI =
NonNullable<NonNullable<EmblaCarouselSvelteType["$$_attributes"]>["on:emblaInit"]> extends (
NonNullable<NonNullable<EmblaCarouselSvelteType['$$_attributes']>['on:emblaInit']> extends (
evt: CustomEvent<infer CarouselAPI>
) => void
? CarouselAPI
@@ -13,8 +13,8 @@ export type CarouselAPI =
type EmblaCarouselConfig = NonNullable<Parameters<typeof emblaCarouselSvelte>[1]>;
export type CarouselOptions = EmblaCarouselConfig["options"];
export type CarouselPlugins = EmblaCarouselConfig["plugins"];
export type CarouselOptions = EmblaCarouselConfig['options'];
export type CarouselPlugins = EmblaCarouselConfig['plugins'];
////
@@ -22,14 +22,14 @@ export type CarouselProps = {
opts?: CarouselOptions;
plugins?: CarouselPlugins;
setApi?: (api: CarouselAPI | undefined) => void;
orientation?: "horizontal" | "vertical";
orientation?: 'horizontal' | 'vertical';
} & WithElementRef<HTMLAttributes<HTMLDivElement>>;
const EMBLA_CAROUSEL_CONTEXT = Symbol("EMBLA_CAROUSEL_CONTEXT");
const EMBLA_CAROUSEL_CONTEXT = Symbol('EMBLA_CAROUSEL_CONTEXT');
export type EmblaContext = {
api: CarouselAPI | undefined;
orientation: "horizontal" | "vertical";
orientation: 'horizontal' | 'vertical';
scrollNext: () => void;
scrollPrev: () => void;
canScrollNext: boolean;
@@ -48,7 +48,7 @@ export function setEmblaContext(config: EmblaContext): EmblaContext {
return config;
}
export function getEmblaContext(name = "This component") {
export function getEmblaContext(name = 'This component') {
if (!hasContext(EMBLA_CAROUSEL_CONTEXT)) {
throw new Error(`${name} must be used within a <Carousel.Root> component`);
}

12
web/src/lib/components/ui/carousel/index.ts
View File

@@ -1,8 +1,8 @@
import Root from "./carousel.svelte";
import Content from "./carousel-content.svelte";
import Item from "./carousel-item.svelte";
import Previous from "./carousel-previous.svelte";
import Next from "./carousel-next.svelte";
import Root from './carousel.svelte';
import Content from './carousel-content.svelte';
import Item from './carousel-item.svelte';
import Previous from './carousel-previous.svelte';
import Next from './carousel-next.svelte';
export {
Root,
@@ -15,5 +15,5 @@ export {
Content as CarouselContent,
Item as CarouselItem,
Previous as CarouselPrevious,
Next as CarouselNext,
Next as CarouselNext
};

12
web/src/lib/components/ui/checkbox/checkbox.svelte
View File

@@ -1,8 +1,8 @@
<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 { cn } from "$lib/utils.js";
import { Checkbox as CheckboxPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import Check from '@lucide/svelte/icons/check';
import Minus from '@lucide/svelte/icons/minus';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -15,7 +15,7 @@
<CheckboxPrimitive.Root
class={cn(
"border-primary focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground peer box-content size-4 shrink-0 rounded-sm border shadow focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50 data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50",
'border-primary focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground peer box-content size-4 shrink-0 rounded-sm border shadow focus-visible:ring-1 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50',
className
)}
bind:checked
@@ -28,7 +28,7 @@
{#if indeterminate}
<Minus class="size-4" />
{:else}
<Check class={cn("size-4", !checked && "text-transparent")} />
<Check class={cn('size-4', !checked && 'text-transparent')} />
{/if}
</span>
{/snippet}

4
web/src/lib/components/ui/checkbox/index.ts
View File

@@ -1,6 +1,6 @@
import Root from "./checkbox.svelte";
import Root from './checkbox.svelte';
export {
Root,
//
Root as Checkbox,
Root as Checkbox
};

14
web/src/lib/components/ui/command/command-dialog.svelte
View File

@@ -2,16 +2,16 @@
import {
Command as CommandPrimitive,
Dialog as DialogPrimitive,
type WithoutChildrenOrChild,
} from "bits-ui";
import type { Snippet } from "svelte";
import Command from "./command.svelte";
import * as Dialog from "$lib/components/ui/dialog/index.js";
type WithoutChildrenOrChild
} from 'bits-ui';
import type { Snippet } from 'svelte';
import Command from './command.svelte';
import * as Dialog from '$lib/components/ui/dialog/index.js';
let {
open = $bindable(false),
ref = $bindable(null),
value = $bindable(""),
value = $bindable(''),
portalProps,
children,
...restProps
@@ -25,7 +25,7 @@
<Dialog.Root bind:open {...restProps}>
<Dialog.Content class="overflow-hidden p-0" {portalProps}>
<Command
class="[&_[data-cmdk-group-heading]]:px-2 [&_[data-cmdk-group-heading]]:font-medium [&_[data-cmdk-group]:not([hidden])_~[data-cmdk-group]]:pt-0 [&_[data-cmdk-group]]:px-2 [&_[data-cmdk-input-wrapper]_svg]:h-5 [&_[data-cmdk-input-wrapper]_svg]:w-5 [&_[data-cmdk-input]]:h-12 [&_[data-cmdk-item]]:px-2 [&_[data-cmdk-item]]:py-3 [&_[data-cmdk-item]_svg]:h-5 [&_[data-cmdk-item]_svg]:w-5"
class="[&_[data-cmdk-group-heading]]:px-2 [&_[data-cmdk-group-heading]]:font-medium [&_[data-cmdk-group]]:px-2 [&_[data-cmdk-group]:not([hidden])_~[data-cmdk-group]]:pt-0 [&_[data-cmdk-input-wrapper]_svg]:h-5 [&_[data-cmdk-input-wrapper]_svg]:w-5 [&_[data-cmdk-input]]:h-12 [&_[data-cmdk-item]]:px-2 [&_[data-cmdk-item]]:py-3 [&_[data-cmdk-item]_svg]:h-5 [&_[data-cmdk-item]_svg]:w-5"
{...restProps}
bind:value
bind:ref

6
web/src/lib/components/ui/command/command-empty.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -9,4 +9,4 @@
}: CommandPrimitive.EmptyProps = $props();
</script>
<CommandPrimitive.Empty bind:ref class={cn("py-6 text-center text-sm", className)} {...restProps} />
<CommandPrimitive.Empty bind:ref class={cn('py-6 text-center text-sm', className)} {...restProps} />

10
web/src/lib/components/ui/command/command-group.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive, useId } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive, useId } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -15,15 +15,13 @@
</script>
<CommandPrimitive.Group
class={cn("text-foreground overflow-hidden p-1", className)}
class={cn('text-foreground overflow-hidden p-1', className)}
bind:ref
value={value ?? heading ?? `----${useId()}`}
{...restProps}
>
{#if heading}
<CommandPrimitive.GroupHeading
class="text-muted-foreground px-2 py-1.5 text-xs font-medium"
>
<CommandPrimitive.GroupHeading class="text-muted-foreground px-2 py-1.5 text-xs font-medium">
{heading}
</CommandPrimitive.GroupHeading>
{/if}

10
web/src/lib/components/ui/command/command-input.svelte
View File

@@ -1,12 +1,12 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import Search from "@lucide/svelte/icons/search";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import Search from '@lucide/svelte/icons/search';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
class: className,
value = $bindable(""),
value = $bindable(''),
...restProps
}: CommandPrimitive.InputProps = $props();
</script>
@@ -15,7 +15,7 @@
<Search class="mr-2 size-4 shrink-0 opacity-50" />
<CommandPrimitive.Input
class={cn(
"placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-base outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
'placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-base outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
className
)}
bind:ref

6
web/src/lib/components/ui/command/command-item.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,7 +11,7 @@
<CommandPrimitive.Item
class={cn(
"aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
'aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
className
)}
bind:ref

6
web/src/lib/components/ui/command/command-link-item.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,7 +11,7 @@
<CommandPrimitive.LinkItem
class={cn(
"aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
'aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
className
)}
bind:ref

6
web/src/lib/components/ui/command/command-list.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -10,7 +10,7 @@
</script>
<CommandPrimitive.List
class={cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className)}
class={cn('max-h-[300px] overflow-x-hidden overflow-y-auto', className)}
bind:ref
{...restProps}
/>

6
web/src/lib/components/ui/command/command-separator.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -9,4 +9,4 @@
}: CommandPrimitive.SeparatorProps = $props();
</script>
<CommandPrimitive.Separator bind:ref class={cn("bg-border -mx-1 h-px", className)} {...restProps} />
<CommandPrimitive.Separator bind:ref class={cn('bg-border -mx-1 h-px', className)} {...restProps} />

8
web/src/lib/components/ui/command/command-shortcut.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -12,7 +12,7 @@
</script>
<span
class={cn("text-muted-foreground ml-auto text-xs tracking-widest", className)}
class={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)}
{...restProps}
bind:this={ref}
>

8
web/src/lib/components/ui/command/command.svelte
View File

@@ -1,9 +1,9 @@
<script lang="ts">
import { Command as CommandPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Command as CommandPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
value = $bindable(""),
value = $bindable(''),
ref = $bindable(null),
class: className,
...restProps
@@ -12,7 +12,7 @@
<CommandPrimitive.Root
class={cn(
"bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md',
className
)}
bind:ref

24
web/src/lib/components/ui/command/index.ts
View File

@@ -1,15 +1,15 @@
import { Command as CommandPrimitive } from "bits-ui";
import { Command as CommandPrimitive } from 'bits-ui';
import Root from "./command.svelte";
import Dialog from "./command-dialog.svelte";
import Empty from "./command-empty.svelte";
import Group from "./command-group.svelte";
import Item from "./command-item.svelte";
import Input from "./command-input.svelte";
import List from "./command-list.svelte";
import Separator from "./command-separator.svelte";
import Shortcut from "./command-shortcut.svelte";
import LinkItem from "./command-link-item.svelte";
import Root from './command.svelte';
import Dialog from './command-dialog.svelte';
import Empty from './command-empty.svelte';
import Group from './command-group.svelte';
import Item from './command-item.svelte';
import Input from './command-input.svelte';
import List from './command-list.svelte';
import Separator from './command-separator.svelte';
import Shortcut from './command-shortcut.svelte';
import LinkItem from './command-link-item.svelte';
const Loading: typeof CommandPrimitive.Loading = CommandPrimitive.Loading;
@@ -36,5 +36,5 @@ export {
List as CommandList,
Separator as CommandSeparator,
Shortcut as CommandShortcut,
Loading as CommandLoading,
Loading as CommandLoading
};

14
web/src/lib/components/ui/context-menu/context-menu-checkbox-item.svelte
View File

@@ -1,9 +1,9 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive, type WithoutChildrenOrChild } from "bits-ui";
import Check from "@lucide/svelte/icons/check";
import Minus from "@lucide/svelte/icons/minus";
import type { Snippet } from "svelte";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import Check from '@lucide/svelte/icons/check';
import Minus from '@lucide/svelte/icons/minus';
import type { Snippet } from 'svelte';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -22,7 +22,7 @@
bind:checked
bind:indeterminate
class={cn(
"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
className
)}
{...restProps}
@@ -32,7 +32,7 @@
{#if indeterminate}
<Minus class="size-4" />
{:else}
<Check class={cn("size-4", !checked && "text-transparent")} />
<Check class={cn('size-4', !checked && 'text-transparent')} />
{/if}
</span>
{@render childrenProp?.()}

6
web/src/lib/components/ui/context-menu/context-menu-content.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -15,7 +15,7 @@
<ContextMenuPrimitive.Portal {...portalProps}>
<ContextMenuPrimitive.Content
class={cn(
"bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-md focus:outline-none",
'bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-md focus:outline-none',
className
)}
{...restProps}

6
web/src/lib/components/ui/context-menu/context-menu-group-heading.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -14,6 +14,6 @@
<ContextMenuPrimitive.GroupHeading
bind:ref
class={cn("text-foreground px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
class={cn('text-foreground px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className)}
{...restProps}
/>

8
web/src/lib/components/ui/context-menu/context-menu-item.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -14,8 +14,8 @@
<ContextMenuPrimitive.Item
class={cn(
"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
inset && "pl-8",
'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
inset && 'pl-8',
className
)}
bind:ref

8
web/src/lib/components/ui/context-menu/context-menu-radio-item.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive, type WithoutChild } from "bits-ui";
import Circle from "@lucide/svelte/icons/circle";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive, type WithoutChild } from 'bits-ui';
import Circle from '@lucide/svelte/icons/circle';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -14,7 +14,7 @@
<ContextMenuPrimitive.RadioItem
bind:ref
class={cn(
"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
className
)}
{...restProps}

6
web/src/lib/components/ui/context-menu/context-menu-separator.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<ContextMenuPrimitive.Separator
bind:ref
class={cn("bg-border -mx-1 my-1 h-px", className)}
class={cn('bg-border -mx-1 my-1 h-px', className)}
{...restProps}
/>

8
web/src/lib/components/ui/context-menu/context-menu-shortcut.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<span
bind:this={ref}
class={cn("text-muted-foreground ml-auto text-xs tracking-widest", className)}
class={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)}
{...restProps}
>
{@render children?.()}

6
web/src/lib/components/ui/context-menu/context-menu-sub-content.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -12,7 +12,7 @@
<ContextMenuPrimitive.SubContent
bind:ref
class={cn(
"bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-lg focus:outline-none",
'bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-lg focus:outline-none',
className
)}
{...restProps}

10
web/src/lib/components/ui/context-menu/context-menu-sub-trigger.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive, type WithoutChild } from "bits-ui";
import ChevronRight from "@lucide/svelte/icons/chevron-right";
import { cn } from "$lib/utils.js";
import { ContextMenu as ContextMenuPrimitive, type WithoutChild } from 'bits-ui';
import ChevronRight from '@lucide/svelte/icons/chevron-right';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -17,8 +17,8 @@
<ContextMenuPrimitive.SubTrigger
bind:ref
class={cn(
"data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none",
inset && "pl-8",
'data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none',
inset && 'pl-8',
className
)}
{...restProps}

22
web/src/lib/components/ui/context-menu/index.ts
View File

@@ -1,14 +1,14 @@
import { ContextMenu as ContextMenuPrimitive } from "bits-ui";
import { ContextMenu as ContextMenuPrimitive } from 'bits-ui';
import Item from "./context-menu-item.svelte";
import GroupHeading from "./context-menu-group-heading.svelte";
import Content from "./context-menu-content.svelte";
import Shortcut from "./context-menu-shortcut.svelte";
import RadioItem from "./context-menu-radio-item.svelte";
import Separator from "./context-menu-separator.svelte";
import SubContent from "./context-menu-sub-content.svelte";
import SubTrigger from "./context-menu-sub-trigger.svelte";
import CheckboxItem from "./context-menu-checkbox-item.svelte";
import Item from './context-menu-item.svelte';
import GroupHeading from './context-menu-group-heading.svelte';
import Content from './context-menu-content.svelte';
import Shortcut from './context-menu-shortcut.svelte';
import RadioItem from './context-menu-radio-item.svelte';
import Separator from './context-menu-separator.svelte';
import SubContent from './context-menu-sub-content.svelte';
import SubTrigger from './context-menu-sub-trigger.svelte';
import CheckboxItem from './context-menu-checkbox-item.svelte';
const Sub: typeof ContextMenuPrimitive.Sub = ContextMenuPrimitive.Sub;
const Root: typeof ContextMenuPrimitive.Root = ContextMenuPrimitive.Root;
@@ -45,5 +45,5 @@ export {
RadioGroup as ContextMenuRadioGroup,
SubContent as ContextMenuSubContent,
SubTrigger as ContextMenuSubTrigger,
CheckboxItem as ContextMenuCheckboxItem,
CheckboxItem as ContextMenuCheckboxItem
};

6
web/src/lib/components/ui/data-table/flex-render.svelte
View File

@@ -1,5 +1,5 @@
<script lang="ts" module>
import type { CellContext, ColumnDefTemplate, HeaderContext } from "@tanstack/table-core";
import type { CellContext, ColumnDefTemplate, HeaderContext } from '@tanstack/table-core';
type TData = unknown;
type TValue = unknown;
type TContext = unknown;
@@ -9,7 +9,7 @@
lang="ts"
generics="TData, TValue, TContext extends HeaderContext<TData, TValue> | CellContext<TData, TValue>"
>
import { RenderComponentConfig, RenderSnippetConfig } from "./render-helpers.js";
import { RenderComponentConfig, RenderSnippetConfig } from './render-helpers.js';
type Props = {
/** The cell or header field of the current cell's column definition. */
@@ -25,7 +25,7 @@
let { content, context }: Props = $props();
</script>
{#if typeof content === "string"}
{#if typeof content === 'string'}
{content}
{:else if content instanceof Function}
<!-- It's unlikely that a CellContext will be passed to a Header -->

6
web/src/lib/components/ui/data-table/index.ts
View File

@@ -1,3 +1,3 @@
export { default as FlexRender } from "./flex-render.svelte";
export { renderComponent, renderSnippet } from "./render-helpers.js";
export { createSvelteTable } from "./data-table.svelte.js";
export { default as FlexRender } from './flex-render.svelte';
export { renderComponent, renderSnippet } from './render-helpers.js';
export { createSvelteTable } from './data-table.svelte.js';

4
web/src/lib/components/ui/data-table/render-helpers.ts
View File

@@ -1,4 +1,4 @@
import type { Component, ComponentProps, Snippet } from "svelte";
import type { Component, ComponentProps, Snippet } from 'svelte';
/**
* A helper class to make it easy to identify Svelte components in
@@ -77,7 +77,7 @@ export class RenderSnippetConfig<TProps> {
export function renderComponent<
// eslint-disable-next-line @typescript-eslint/no-explicit-any
T extends Component<any>,
Props extends ComponentProps<T>,
Props extends ComponentProps<T>
>(component: T, props: Props) {
return new RenderComponentConfig(component, props);
}

14
web/src/lib/components/ui/dialog/dialog-content.svelte
View File

@@ -1,9 +1,9 @@
<script lang="ts">
import { Dialog as DialogPrimitive, type WithoutChildrenOrChild } from "bits-ui";
import X from "@lucide/svelte/icons/x";
import type { Snippet } from "svelte";
import * as Dialog from "./index.js";
import { cn } from "$lib/utils.js";
import { Dialog as DialogPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import X from '@lucide/svelte/icons/x';
import type { Snippet } from 'svelte';
import * as Dialog from './index.js';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -22,14 +22,14 @@
<DialogPrimitive.Content
bind:ref
class={cn(
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg",
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg',
className
)}
{...restProps}
>
{@render children?.()}
<DialogPrimitive.Close
class="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none"
class="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-none disabled:pointer-events-none"
>
<X class="size-4" />
<span class="sr-only">Close</span>

6
web/src/lib/components/ui/dialog/dialog-description.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Dialog as DialogPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<DialogPrimitive.Description
bind:ref
class={cn("text-muted-foreground text-sm", className)}
class={cn('text-muted-foreground text-sm', className)}
{...restProps}
/>

8
web/src/lib/components/ui/dialog/dialog-footer.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
class={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
{...restProps}
>
{@render children?.()}

8
web/src/lib/components/ui/dialog/dialog-header.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import type { WithElementRef } from "bits-ui";
import { cn } from "$lib/utils.js";
import type { HTMLAttributes } from 'svelte/elements';
import type { WithElementRef } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("flex flex-col space-y-1.5 text-center sm:text-left", className)}
class={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)}
{...restProps}
>
{@render children?.()}

6
web/src/lib/components/ui/dialog/dialog-overlay.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Dialog as DialogPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -12,7 +12,7 @@
<DialogPrimitive.Overlay
bind:ref
class={cn(
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80",
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80',
className
)}
{...restProps}

6
web/src/lib/components/ui/dialog/dialog-title.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Dialog as DialogPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
import { Dialog as DialogPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<DialogPrimitive.Title
bind:ref
class={cn("text-lg font-semibold leading-none tracking-tight", className)}
class={cn('text-lg leading-none font-semibold tracking-tight', className)}
{...restProps}
/>

16
web/src/lib/components/ui/dialog/index.ts
View File

@@ -1,11 +1,11 @@
import { Dialog as DialogPrimitive } from "bits-ui";
import { Dialog as DialogPrimitive } from 'bits-ui';
import Title from "./dialog-title.svelte";
import Footer from "./dialog-footer.svelte";
import Header from "./dialog-header.svelte";
import Overlay from "./dialog-overlay.svelte";
import Content from "./dialog-content.svelte";
import Description from "./dialog-description.svelte";
import Title from './dialog-title.svelte';
import Footer from './dialog-footer.svelte';
import Header from './dialog-header.svelte';
import Overlay from './dialog-overlay.svelte';
import Content from './dialog-content.svelte';
import Description from './dialog-description.svelte';
const Root: typeof DialogPrimitive.Root = DialogPrimitive.Root;
const Trigger: typeof DialogPrimitive.Trigger = DialogPrimitive.Trigger;
@@ -33,5 +33,5 @@ export {
Overlay as DialogOverlay,
Content as DialogContent,
Description as DialogDescription,
Close as DialogClose,
Close as DialogClose
};

8
web/src/lib/components/ui/drawer/drawer-content.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { Drawer as DrawerPrimitive } from "vaul-svelte";
import DrawerOverlay from "./drawer-overlay.svelte";
import { cn } from "$lib/utils.js";
import { Drawer as DrawerPrimitive } from 'vaul-svelte';
import DrawerOverlay from './drawer-overlay.svelte';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -19,7 +19,7 @@
<DrawerPrimitive.Content
bind:ref
class={cn(
"bg-background fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border",
'bg-background fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border',
className
)}
{...restProps}

6
web/src/lib/components/ui/drawer/drawer-description.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Drawer as DrawerPrimitive } from "vaul-svelte";
import { cn } from "$lib/utils.js";
import { Drawer as DrawerPrimitive } from 'vaul-svelte';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<DrawerPrimitive.Description
bind:ref
class={cn("text-muted-foreground text-sm", className)}
class={cn('text-muted-foreground text-sm', className)}
{...restProps}
/>

8
web/src/lib/components/ui/drawer/drawer-footer.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { cn } from "$lib/utils.js";
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from '$lib/utils.js';
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
let {
ref = $bindable(null),
@@ -13,6 +13,6 @@
export { className as class };
</script>
<div bind:this={ref} class={cn("mt-auto flex flex-col gap-2 p-4", className)} {...restProps}>
<div bind:this={ref} class={cn('mt-auto flex flex-col gap-2 p-4', className)} {...restProps}>
{@render children?.()}
</div>

8
web/src/lib/components/ui/drawer/drawer-header.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import type { WithElementRef } from "bits-ui";
import type { HTMLAttributes } from "svelte/elements";
import { cn } from "$lib/utils.js";
import type { WithElementRef } from 'bits-ui';
import type { HTMLAttributes } from 'svelte/elements';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -13,7 +13,7 @@
<div
bind:this={ref}
class={cn("grid gap-1.5 p-4 text-center sm:text-left", className)}
class={cn('grid gap-1.5 p-4 text-center sm:text-left', className)}
{...restProps}
>
{@render children?.()}

2
web/src/lib/components/ui/drawer/drawer-nested.svelte
View File

@@ -1,5 +1,5 @@
<script lang="ts">
import { Drawer as DrawerPrimitive } from "vaul-svelte";
import { Drawer as DrawerPrimitive } from 'vaul-svelte';
let {
shouldScaleBackground = true,

6
web/src/lib/components/ui/drawer/drawer-overlay.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { Drawer as DrawerPrimitive } from "vaul-svelte";
import { cn } from "$lib/utils.js";
import { Drawer as DrawerPrimitive } from 'vaul-svelte';
import { cn } from '$lib/utils.js';
let {
ref = $bindable(null),
@@ -11,6 +11,6 @@
<DrawerPrimitive.Overlay
bind:ref
class={cn("fixed inset-0 z-50 bg-black/80", className)}
class={cn('fixed inset-0 z-50 bg-black/80', className)}
{...restProps}
/>

Some files were not shown because too many files have changed in this diff Show More