{#if !collapsed} {#each sections as section} {#if expandedSection === section.key}

{#if section.key === "spaces"} {#if trendingLoading} {/if} {#each SPACE_CATEGORIES as cat} {@const trending = getTrendingByCategory(cat.key)} {#if trending.length > 0}

{cat.label} {trending.length}

{#each trending as space}

onadd?.(trendingToTemplate(space))} ondragstart={(e) => { const template = trendingToTemplate(space); e.dataTransfer!.setData( "node-template", JSON.stringify(template) ); const ghost = document.createElement("div"); ghost.textContent = space.title; ghost.style.cssText = "background:#f97316;color:#0c0d10;padding:4px 10px;border-radius:5px;font-family:Manrope,sans-serif;font-size:11px;font-weight:600;position:fixed;top:-100px"; document.body.appendChild(ghost); e.dataTransfer!.setDragImage(ghost, 0, 0); setTimeout(() => document.body.removeChild(ghost), 0); }} >

{space.title} ♥ {space.likes} e.stopPropagation()} title="Open on HuggingFace">↗

{space.id}

{#if space.description}

{space.description}

{/if}

{/each} {/if} {/each} {:else if section.key === "models"}

{#each MODEL_TASKS as task} {/each}

{#if modelSearching}

Searching...

{:else if modelSearchQuery.length >= 2 || selectedModelTask} {#each modelSearchResults as model} {@const template = modelToTemplate(model)} {@const pt = template.outputs[0]?.type ?? template.inputs[0]?.type ?? "any"}

onadd?.(template)} ondragstart={(e) => { e.dataTransfer!.setData( "node-template", JSON.stringify(template) ); const ghost = document.createElement("div"); ghost.textContent = model.id; ghost.style.cssText = `background:${PORT_COLOR[pt]};color:#0c0d10;padding:4px 10px;border-radius:5px;font-family:Manrope,sans-serif;font-size:11px;font-weight:600;position:fixed;top:-100px`; document.body.appendChild(ghost); e.dataTransfer!.setDragImage(ghost, 0, 0); setTimeout(() => document.body.removeChild(ghost), 0); }} >

{model.id.split("/").pop()} ♥ {model.likes}

{model.id}

{model.pipeline_tag}

{/each} {#if modelSearchResults.length === 0} {/if} {:else if trendingModelsLoading} {:else} {#each MODEL_TASKS.slice(0, 6) as task} {@const models = getModelsForTask(task.key)} {#if models.length > 0}

{task.label} {models.length}

{#each models.slice(0, 3) as model} {@const template = modelToTemplate(model)} {@const pt = template.outputs[0]?.type ?? template.inputs[0]?.type ?? "any"}

onadd?.(template)} ondragstart={(e) => { e.dataTransfer!.setData( "node-template", JSON.stringify(template) ); }} >

{model.id.split("/").pop()} ♥ {model.likes}

{model.id}

{/each} {/if} {/each} {/if} {:else if section.key === "datasets"}

{ if (e.key === "Enter" && datasetSearchQuery.includes("/")) { datasetSearchResults = []; addDataset(datasetSearchQuery.trim()); } if (e.key === "Escape") datasetSearchResults = []; }} />

{#if datasetSearchResults.length > 0} {:else if datasetSearching} {/if}

{#if loadingDataset}

Loading {loadingDatasetName}...

{/if} {#if datasetError} {datasetError} {/if} {:else} {#each section.items as item} {@const pt = primaryType(item)}

onadd?.(item)} ondragstart={(e) => { e.dataTransfer!.setData( "node-template", JSON.stringify(item) ); const ghost = document.createElement("div"); ghost.textContent = item.label; ghost.style.cssText = `background:${PORT_COLOR[pt]};color:#0c0d10;padding:4px 10px;border-radius:5px;font-family:Manrope,sans-serif;font-size:11px;font-weight:600;position:fixed;top:-100px`; document.body.appendChild(ghost); e.dataTransfer!.setDragImage(ghost, 0, 0); setTimeout(() => document.body.removeChild(ghost), 0); }} > {item.label}

{/each} {/if} {#if section.key === "spaces"} {#each customSpaces as item, i} {@const pt = primaryType(item)}

onadd?.(item)} ondragstart={(e) => e.dataTransfer!.setData( "node-template", JSON.stringify(item) )} > {item.label} {#if item.space_id} e.stopPropagation()} title="Open on HuggingFace">↗ {/if}

{/each}

{ if (e.key === "Enter" && customSpaceInput.includes("/")) { searchResults = []; addCustomSpace(); } if (e.key === "Escape") searchResults = []; }} />

{#if searchResults.length > 0} {:else if searching} {/if}

{#if loadingSpace}

Connecting to {loadingSpaceName}...

{/if} {#if spaceError} {spaceError} {/if} {/if}

{/if} {/each} {/if} {#if !collapsed}

{/if}