{
  "id": "idea-spark",
  "name": "Idea Spark",
  "category": "creative",
  "tags": ["ideas", "creativity", "brainstorm", "inspiration", "prompt"],
  "description": "Random idea generator with categories and save-to-list feature.",
  "triggers": ["idea generator", "brainstorm", "creative ideas", "idea spark", "inspiration"],
  "defaultSize": { "w": 4, "h": 5 },
  "source": "function IdeaSpark() {\n  const prompts = {\n    business:['A subscription box for…','An app that connects…','A marketplace for…','A service that automates…','A tool that simplifies…'],\n    creative:['A painting of…','A song about…','A story where…','A photo series capturing…','A sculpture representing…'],\n    tech:['A wearable that…','An AI that…','A drone for…','A robot that…','A VR experience of…'],\n    life:['A workout routine for…','A meal plan featuring…','A travel itinerary to…','A morning ritual with…','A hobby involving…']\n  };\n  const [category, setCategory] = React.useState('business');\n  const [idea, setIdea] = React.useState('');\n  const [saved, setSaved] = React.useState([]);\n\n  const generate = ()=>{\n    const list = prompts[category];\n    setIdea(list[Math.floor(Math.random()*list.length)]);\n  };\n\n  React.useEffect(()=>generate(),[category]);\n\n  return (\n    <div style={{padding:16,fontFamily:'system-ui',height:'100%',display:'flex',flexDirection:'column'}}>\n      <div style={{fontSize:18,fontWeight:700,marginBottom:12}}>Idea Spark</div>\n      <div style={{display:'flex',gap:6,marginBottom:12}}>\n        {Object.keys(prompts).map(c=> (\n          <button key={c} onClick={()=>setCategory(c)}\n            style={{padding:'6px 12px',borderRadius:8,border:'1px solid #ccc',background:category===c?'#007AFF':'#fff',color:category===c?'#fff':'#000',cursor:'pointer',fontSize:12,textTransform:'capitalize'}}>\n            {c}\n          </button>\n        ))}\n      </div>\n      <div style={{padding:16,background:'#f5f5f5',borderRadius:12,marginBottom:12,textAlign:'center'}}>\n        <div style={{fontSize:20,fontWeight:600,marginBottom:12}}>{idea}</div>\n        <button onClick={generate}\n          style={{padding:'8px 16px',borderRadius:8,background:'#FF9500',color:'#fff',border:'none',cursor:'pointer'}}>\n          Spark Another\n        </button>\n      </div>\n      <div style={{display:'flex',gap:8,marginBottom:8}}>\n        <input id=\"ideaInput\" style={{flex:1,padding:'6px 10px',borderRadius:6,border:'1px solid #ccc',fontSize:13}} placeholder=\"Add your own idea…\"/>\n        <button onClick={()=>{\n          const el=document.getElementById('ideaInput');\n          if(el&&el.value.trim()){setSaved([...saved,el.value.trim()]);el.value='';}\n        }} style={{padding:'6px 12px',borderRadius:6,background:'#34C759',color:'#fff',border:'none',cursor:'pointer',fontSize:13}}>\n          Save\n        </button>\n      </div>\n      <div style={{flex:1,overflow:'auto'}}>\n        {saved.map((s,i)=> (\n          <div key={i} style={{display:'flex',justifyContent:'space-between',padding:'6px 0',borderBottom:'1px solid #eee'}}>\n            <span style={{fontSize:13}}>{s}</span>\n            <button onClick={()=>setSaved(saved.filter((_,j)=>j!==i))}\n              style={{background:'none',border:'none',color:'#FF3B30',cursor:'pointer',fontSize:12}}>×</button>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n}\nrender(<IdeaSpark/>);",
  "placeholders": []
}