Преглед на файлове

feat: add tags component

Thomas Zhang преди 3 месеца
родител
ревизия
0bdbfbc2f3
променени са 2 файла, в които са добавени 22 реда и са изтрити 0 реда
  1. 3 0
      src/lib/components/common/tags/index.ts
  2. 19 0
      src/lib/components/common/tags/tags.svelte

+ 3 - 0
src/lib/components/common/tags/index.ts

@@ -0,0 +1,3 @@
+import Tags from './tags.svelte';
+
+export { Tags };

+ 19 - 0
src/lib/components/common/tags/tags.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	let { tags, activeTags }: { tags: string[]; activeTags?: Set<string> } = $props();
+</script>
+
+<div class="flex flex-wrap gap-1">
+	{#each tags as tag (tag)}
+		{@const active = activeTags?.has(tag)}
+		<div
+			class={[
+				'h-min rounded-sm border px-2 text-xs transition-colors',
+				active
+					? 'border-primary/50 bg-primary/25 text-white/75'
+					: 'border-transparent bg-white/10 text-white/50',
+			]}
+		>
+			{tag}
+		</div>
+	{/each}
+</div>