50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T57c2,"use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Card, CardContent } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { Select, SelectContent, SelectItem, SelectTrigger } from "@/components/ui/select" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Avatar, AvatarImage } from "@/components/ui/avatar" import { Badge } from "@/components/ui/badge" import { Headphones, X, FileText, ChevronDown, ArrowDownNarrowWide, Upload, Link, FolderOpen, Search, Play, Clock, Globe, Youtube, FileImage, Copy, Star, } from "lucide-react" interface Project { id: string name: string type: "pdf" | "url" | "audio" size?: string duration?: string createdAt: string thumbnail?: string status: "completed" | "processing" | "draft" } const mockProjects: Project[] = [ { id: "1", name: "Future Thinking Talk.pdf", type: "pdf", size: "45.4 KB", createdAt: "2 hours ago", status: "completed", }, { id: "2", name: "AI Revolution Article", type: "url", duration: "12:34", createdAt: "1 day ago", status: "completed", }, { id: "3", name: "Tech Trends 2024", type: "audio", duration: "8:45", createdAt: "3 days ago", status: "processing", }, { id: "4", name: "Climate Change Report", type: "pdf", size: "2.1 MB", createdAt: "1 week ago", status: "draft", }, ] export default function InputModel() { const [isOpen, setIsOpen] = useState(true) const [activeTab, setActiveTab] = useState("upload") const [urlInput, setUrlInput] = useState("") const [searchQuery, setSearchQuery] = useState("") const [selectedProject, setSelectedProject] = useState(null) const [selected, setSelected] = useState("morgan"); const [selected2, setSelected2] = useState(""); const [selected3, setSelected3] = useState(""); const [selected4, setSelected4] = useState(""); const [selected5, setSelected5] = useState(""); const [selected6, setSelected6] = useState(""); const filteredProjects = mockProjects.filter((project) => project.name.toLowerCase().includes(searchQuery.toLowerCase()), ) const getProjectIcon = (type: string) => { switch (type) { case "pdf": return case "url": return case "audio": return default: return } } const getStatusColor = (status: string) => { switch (status) { case "completed": return "bg-green-100 text-green-800 dark:bg-green-900/20 dark:text-green-400" case "processing": return "bg-yellow-100 text-yellow-800 dark:bg-yellow-900/20 dark:text-yellow-400" case "draft": return "bg-neutral-100 text-neutral-800 dark:bg-neutral-800 dark:text-neutral-400" default: return "bg-neutral-100 text-neutral-800 dark:bg-neutral-800 dark:text-neutral-400" } } if (!isOpen) { return (

) } return (

Create Your Audio Show

Drop a document or paste a link — GenFM will instantly turn it into a fully voiced podcast you can preview, edit, and download.

Upload File Upload Import via URL URL Choose Existing Existing

Drop your file here

Support for PDF, DOCX, TXT files up to 10MB

Content URL

setUrlInput(e.target.value)} className="w-full h-12 rounded-xl border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-900" />

Articles

YouTube

Blogs

News

{urlInput && (

Ready to import content

{urlInput}

)}

setSearchQuery(e.target.value)} className="pl-10 h-12 rounded-xl border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-900" />

{filteredProjects.map((project) => (

setSelectedProject(project.id)} className={`p-4 rounded-xl border cursor-pointer transition-all ${ selectedProject === project.id ? "border-neutral-400 dark:border-neutral-600 bg-neutral-100 dark:bg-neutral-800" : "border-neutral-200 dark:border-neutral-700 hover:border-neutral-300 dark:hover:border-neutral-600 bg-white dark:bg-neutral-900/50" }`} >

{getProjectIcon(project.type)}

{project.name}

{project.status}

{project.createdAt} {project.size && {project.size}} {project.duration && ( {project.duration} )}

))}

Format Style

Host Voice

Guest Voice

Voice Engine

Language

Audio Quality

) } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L50",null,{"namespace":"@spectrumui","registryDependencies":["input","label","select","button","tab","avatar","badge"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"app/registry/input-model/inputmodel.tsx","content":"$52","type":"registry:component","target":"components/spectrumui/inputmodel.tsx"}],"className":"h-[70svh] min-h-80"}]]}]