{
  "id": "news-feed",
  "name": "News Feed",
  "category": "web",
  "tags": ["news", "feed", "headlines", "rss", "articles", "current events"],
  "description": "Latest news headlines with search using a public news API.",
  "triggers": ["news feed", "headlines", "news panel", "latest news", "current events", "news ticker"],
  "defaultSize": { "w": 5, "h": 6 },
  "source": "function NewsFeed() {\n  const [topic, setTopic] = React.useState('REPLACE_WITH_TOPIC');\n  const [articles, setArticles] = React.useState([]);\n  const [loading, setLoading] = React.useState(false);\n\n  React.useEffect(() => { search(); }, []);\n\n  const search = () => {\n    setLoading(true);\n    // Using Hacker News Algolia as a free, reliable news source\n    fetch(`https://hn.algolia.com/api/v1/search?query=${encodeURIComponent(topic||'technology')}&hitsPerPage=12`)\n      .then(r=>r.json())\n      .then(d=>{setArticles(d.hits||[]);setLoading(false);})\n      .catch(()=>setLoading(false));\n  };\n\n  return (\n    <div style={{padding:16,fontFamily:'system-ui',height:'100%',display:'flex',flexDirection:'column'}}>\n      <div style={{display:'flex',justifyContent:'space-between',alignItems:'center',marginBottom:12}}>\n        <span style={{fontSize:18,fontWeight:700}}>News Feed</span>\n        <div style={{display:'flex',gap:8}}>\n          <input value={topic} onChange={e=>setTopic(e.target.value)} onKeyDown={e=>e.key==='Enter'&&search()}\n            style={{padding:'6px 10px',borderRadius:6,border:'1px solid #ccc',fontSize:13,width:140}}\n            placeholder=\"Topic…\"/>\n          <button onClick={search}\n            style={{padding:'6px 12px',borderRadius:6,background:'#007AFF',color:'#fff',border:'none',cursor:'pointer',fontSize:13}}>\n            Search\n          </button>\n        </div>\n      </div>\n      {loading && <div style={{textAlign:'center',color:'#888'}}>Loading…</div>}\n      <div style={{flex:1,overflow:'auto'}}>\n        {articles.map(a=> (\n          <a key={a.objectID} href={a.url} target=\"_blank\" rel=\"noopener noreferrer\"\n            style={{display:'block',padding:'10px 0',borderBottom:'1px solid #eee',textDecoration:'none',color:'inherit'}}>\n            <div style={{fontSize:14,fontWeight:600,color:'#007AFF',marginBottom:4}}>{a.title}</div>\n            <div style={{fontSize:12,color:'#888',display:'flex',gap:8}}>\n              <span>{a.points} points</span>\n              <span>{a.author}</span>\n              <span>{a.num_comments} comments</span>\n            </div>\n          </a>\n        ))}\n      </div>\n    </div>\n  );\n}\nrender(<NewsFeed/>);",
  "placeholders": [
    { "name": "REPLACE_WITH_TOPIC", "description": "Default news topic", "default": "technology" }
  ]
}
