import{e as f,n as g,b as d,r as c,t as x}from"./vendor-lit-B2r-dKc0.js";import{D as y,c as M,i as p,a as m,b as I}from"./vendor-mini-lit-CpUQub-j.js";import{p as w}from"./app-review-C3CmcSYC.js";import"./app-session-runtime-CeFJDILJ.js";import{I as $}from"./Input-Ck0OPeqZ.js";import{ad as b,aM as C}from"./vendor-lucide-B9Yl1Gez.js";import"./vendor-marked-_iteVaMm.js";import"./app-panel-workspace-C3XDRCgE.js";import"./app-routing-C_r2pdnC.js";import"./app-message-reducer-wATqnZGf.js";import"./vendor-sortable-B1o3v0Qs.js";import"./app-inbox-CaZD85aD.js";import"./app-pr-walkthrough-WipZACSB.js";var S=Object.defineProperty,R=Object.getOwnPropertyDescriptor,a=(t,e,s,r)=>{for(var i=r>1?void 0:r?R(e,s):e,o=t.length-1,l;o>=0;o--)(l=t[o])&&(i=(r?l(e,s,i):l(i))||i);return r&&i&&S(e,s,i),i};function v(t,e){const s=e.findIndex(r=>r.provider===t.provider&&r.id===t.id);return s<0?-1:e.length-s}function u(t,e){return!!t&&t.provider===e.provider&&t.id===e.id}let n=class extends y{constructor(){super(...arguments),this.currentModel=null,this.searchQuery="",this.selectedIndex=0,this.serverModels=[],this.loading=!1,this.scrollContainerRef=f(),this.searchInputRef=f(),this.modalWidth="min(400px, 90vw)"}static async open(t,e){const s=new n;s.currentModel=t,s.onSelectCallback=e,s.open(),s.loadModels()}async loadModels(){this.loading=!0;try{const t=await w("/api/image-models");t.ok&&(this.serverModels=await t.json())}catch(t){console.error("Failed to load image models:",t)}finally{this.loading=!1}}async firstUpdated(t){super.firstUpdated(t),await this.updateComplete,typeof window<"u"&&typeof window.matchMedia=="function"&&!window.matchMedia("(min-width: 640px)").matches||this.searchInputRef.value?.focus(),this.addEventListener("keydown",s=>{const r=this.getFilteredModels();s.key==="ArrowDown"?(s.preventDefault(),this.selectedIndex=Math.min(this.selectedIndex+1,r.length-1),this.scrollToSelected()):s.key==="ArrowUp"?(s.preventDefault(),this.selectedIndex=Math.max(this.selectedIndex-1,0),this.scrollToSelected()):s.key==="Enter"&&r[this.selectedIndex]&&(s.preventDefault(),this.handleSelect(r[this.selectedIndex]))})}getFilteredModels(){const t=this.searchQuery.toLowerCase().trim();let e=this.serverModels;if(t){const r=t.split(/\s+/).filter(Boolean);e=e.filter(i=>r.every(o=>`${i.provider} ${i.id} ${i.name}`.toLowerCase().includes(o)))}const s=this.serverModels;return[...e].sort((r,i)=>{const o=u(this.currentModel,r),l=u(this.currentModel,i);if(o&&!l)return-1;if(!o&&l)return 1;if(r.authenticated&&!i.authenticated)return-1;if(!r.authenticated&&i.authenticated)return 1;const h=v(i,s)-v(r,s);return h||r.provider.localeCompare(i.provider)||r.id.localeCompare(i.id)})}handleSelect(t){this.onSelectCallback?.(t),this.close()}scrollToSelected(){requestAnimationFrame(()=>{this.scrollContainerRef.value?.querySelectorAll("[data-image-model-item]")[this.selectedIndex]?.scrollIntoView({block:"nearest",behavior:"smooth"})})}renderContent(){const t=this.getFilteredModels();return d`
			<div class="p-6 pb-4 flex flex-col gap-4 border-b border-border flex-shrink-0">
				${M({title:"Select Image Model"})}
				${$({placeholder:p("Search models..."),value:this.searchQuery,inputRef:this.searchInputRef,onInput:e=>{this.searchQuery=e.target.value,this.selectedIndex=0,this.scrollContainerRef.value&&(this.scrollContainerRef.value.scrollTop=0)}})}
			</div>
			<div class="flex-1 overflow-y-auto" ${g(this.scrollContainerRef)}>
				${this.loading&&this.serverModels.length===0?d`<div class="flex items-center justify-center py-8 text-muted-foreground text-sm">Loading models...</div>`:t.map((e,s)=>{const r=u(this.currentModel,e),i=s===this.selectedIndex,o=e.authenticated??!1;return d`
							<div
								data-image-model-item
								class="px-4 py-3 hover:bg-muted cursor-pointer border-b border-border ${i?"bg-accent":""} ${o?"":"opacity-45"}"
								title=${o?"":p("API key required — set up in Settings > Providers")}
								@click=${()=>this.handleSelect(e)}
								@mouseenter=${()=>{this.selectedIndex=s}}
							>
								<div class="flex items-center justify-between gap-2 mb-1">
									<div class="flex items-center gap-2 flex-1 min-w-0">
										<span class="text-muted-foreground">${m(b,"sm")}</span>
										<span class="text-sm font-medium text-foreground truncate">${e.name||e.id}</span>
										${r?d`<span class="text-green-500">✓</span>`:""}
									</div>
									<div class="flex items-center gap-1.5">
										${o?"":d`<span class="text-muted-foreground" title=${p("API key required")}>${m(C,"sm")}</span>`}
										${I(e.provider,"outline")}
									</div>
								</div>
								<div class="text-xs text-muted-foreground flex items-center justify-between gap-2">
									<span class="truncate">${e.id}</span>
									<span>${e.api==="gemini-images"?"Gemini":e.api==="google-imagen"?"Imagen":"Images API"}</span>
								</div>
							</div>
						`})}
			</div>
		`}};a([c()],n.prototype,"currentModel",2);a([c()],n.prototype,"searchQuery",2);a([c()],n.prototype,"selectedIndex",2);a([c()],n.prototype,"serverModels",2);a([c()],n.prototype,"loading",2);n=a([x("image-model-selector")],n);export{n as ImageModelSelector,v as imageModelRank};
