flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/room. tiny 3d rooms saved locally or in your bluesky account, svelte/threlte
flo-bit.dev/room/
1<script lang="ts">
2 import type { WithElementRef } from 'bits-ui';
3 import type { HTMLAttributes } from 'svelte/elements';
4 import { Avatar } from '.';
5 import { cn } from '$lib/utils';
6
7 let {
8 users,
9 ref = $bindable(null),
10
11 avatarClass,
12 imageClass,
13 fallbackClass,
14
15 class: className,
16 ...restProps
17 }: WithElementRef<HTMLAttributes<HTMLDivElement>> & {
18 avatarClass?: string;
19 imageClass?: string;
20 fallbackClass?: string;
21
22 users: {
23 src?: string;
24 alt?: string;
25 fallback?: string;
26 }[];
27
28 class?: string;
29 } = $props();
30</script>
31
32<div class={cn('flex -space-x-2 overflow-hidden', className)} bind:this={ref} {...restProps}>
33 {#each users as user}
34 <Avatar
35 src={user.src}
36 alt={user.alt}
37 fallback={user.fallback}
38 class={cn('border-base-50 dark:border-base-950 border-2', avatarClass)}
39 {imageClass}
40 {fallbackClass}
41 />
42 {/each}
43</div>