ProfessorNovaandClaude Opus 5
97dbff309c
Self-hosted knowledge management for SMEs: a split-screen Markdown editor whose sections an LLM refines while you write, and RAG question answering over the documents that result. FastAPI + Postgres/pgvector on the back, SvelteKit on the front, everything OpenAI-compatible and self-hostable. Squashed into a single commit; the development history stays local. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01CA43ZJda8Rbp2hKXNy8f6b
38 lines
1.2 KiB
Svelte
38 lines
1.2 KiB
Svelte
<script lang="ts">
|
|
import type { Component } from 'svelte';
|
|
import Tooltip from '$lib/components/Tooltip.svelte';
|
|
|
|
// An icon-only action: a round hover target with the label as its tooltip
|
|
// AND its accessible name. The pattern appeared per table and per header
|
|
// before; one component keeps hit area, hover colour and naming identical
|
|
// wherever a row or a title offers something to do.
|
|
type Props = {
|
|
icon: Component<{ size?: number }>;
|
|
label: string;
|
|
onclick: () => void;
|
|
/** danger tints the hover state — deleting should not look like editing. */
|
|
variant?: 'neutral' | 'danger';
|
|
size?: 'sm' | 'md';
|
|
testid?: string;
|
|
};
|
|
|
|
let { icon: Icon, label, onclick, variant = 'neutral', size = 'md', testid }: Props = $props();
|
|
|
|
const box = $derived(size === 'sm' ? 'h-8 w-8' : 'h-9 w-9');
|
|
const glyph = $derived(size === 'sm' ? 15 : 17);
|
|
const hover = $derived(
|
|
variant === 'danger'
|
|
? 'hover:bg-danger-muted hover:text-danger'
|
|
: 'hover:bg-surface-sunken hover:text-ink'
|
|
);
|
|
</script>
|
|
|
|
<Tooltip text={label} {label} {onclick}>
|
|
<span
|
|
class="flex items-center justify-center rounded-full text-ink-muted transition-colors {box} {hover}"
|
|
data-testid={testid}
|
|
>
|
|
<Icon size={glyph} />
|
|
</span>
|
|
</Tooltip>
|