Skip to main content
Glama
select-item.svelte1.03 kB
<script lang="ts"> import Check from "@lucide/svelte/icons/check"; import { Select as SelectPrimitive, type WithoutChild } from "bits-ui"; import { cn } from "$lib/utils.js"; let { ref = $bindable(null), class: className, value, label, children: childrenProp, ...restProps }: WithoutChild<SelectPrimitive.ItemProps> = $props(); </script> <SelectPrimitive.Item bind:ref {value} class={cn( "data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex w-full 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", className )} {...restProps} > {#snippet children({ selected, highlighted })} <span class="absolute left-2 flex size-3.5 items-center justify-center"> {#if selected} <Check class="size-4" /> {/if} </span> {#if childrenProp} {@render childrenProp({ selected, highlighted })} {:else} {label || value} {/if} {/snippet} </SelectPrimitive.Item>

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/jhawkins11/task-manager-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server