Benson Wong
92b90447e8
internal/config,server: implement model capabilities - define the capabilities of a model using a simple config block on the model - v1/models renders out capabilities to be compatible with openrouter, huggingface chat, and mistral formats for broader compatibility - add support for capabilities in UI Fixes #734
60 lines
2.0 KiB
Svelte
60 lines
2.0 KiB
Svelte
<script lang="ts">
|
|
import { models } from "../../stores/api";
|
|
import { groupModels } from "../../lib/modelUtils";
|
|
|
|
interface Props {
|
|
value: string;
|
|
placeholder?: string;
|
|
disabled?: boolean;
|
|
capabilities?: string[];
|
|
matchAny?: boolean;
|
|
}
|
|
|
|
let { value = $bindable(), placeholder = "Select a model...", disabled = false, capabilities, matchAny = false }: Props = $props();
|
|
|
|
let grouped = $derived(groupModels($models, capabilities, matchAny));
|
|
let hasMatching = $derived(grouped.localMatching.length > 0);
|
|
let hasModels = $derived(hasMatching || grouped.local.length > 0 || Object.keys(grouped.peersByProvider).length > 0);
|
|
</script>
|
|
|
|
{#if hasModels}
|
|
<select
|
|
class="min-w-0 flex-1 basis-48 px-3 py-2 rounded border border-gray-200 dark:border-white/10 bg-surface focus:outline-none focus:ring-2 focus:ring-primary"
|
|
bind:value
|
|
{disabled}
|
|
>
|
|
<option value="">{placeholder}</option>
|
|
{#if hasMatching}
|
|
<optgroup label="Matching Capabilities">
|
|
{#each grouped.localMatching as model (model.id)}
|
|
<option value={model.id}>{model.id}</option>
|
|
{#if model.aliases}
|
|
{#each model.aliases as alias (alias)}
|
|
<option value={alias}> ↳ {alias}</option>
|
|
{/each}
|
|
{/if}
|
|
{/each}
|
|
</optgroup>
|
|
{/if}
|
|
{#if grouped.local.length > 0}
|
|
<optgroup label="Local">
|
|
{#each grouped.local as model (model.id)}
|
|
<option value={model.id}>{model.id}</option>
|
|
{#if model.aliases}
|
|
{#each model.aliases as alias (alias)}
|
|
<option value={alias}> ↳ {alias}</option>
|
|
{/each}
|
|
{/if}
|
|
{/each}
|
|
</optgroup>
|
|
{/if}
|
|
{#each Object.entries(grouped.peersByProvider).sort(([a], [b]) => a.localeCompare(b)) as [peerId, peerModels] (peerId)}
|
|
<optgroup label="Peer: {peerId}">
|
|
{#each peerModels as model (model.id)}
|
|
<option value={model.id}>{model.id}</option>
|
|
{/each}
|
|
</optgroup>
|
|
{/each}
|
|
</select>
|
|
{/if}
|