{
  "id": "tesla-status",
  "name": "Tesla Status",
  "category": "vehicle",
  "tags": ["tesla", "car", "ev", "vehicle", "battery", "charge"],
  "description": "Tesla-style vehicle status panel with battery, range, and climate controls.",
  "triggers": ["tesla status", "car status", "ev monitor", "battery status", "tesla panel"],
  "defaultSize": { "w": 4, "h": 5 },
  "source": "function TeslaStatus() {\n  const [battery, setBattery] = React.useState(78);\n  const [climateOn, setClimateOn] = React.useState(false);\n  const [locked, setLocked] = React.useState(true);\n  const range = Math.round(battery * 3.2);\n\n  return (\n    <div style={{padding:20,fontFamily:'system-ui',height:'100%',display:'flex',flexDirection:'column',background:'#0a0a0a',color:'#fff',borderRadius:12}}>\n      <div style={{fontSize:20,fontWeight:700,marginBottom:16,textAlign:'center'}}>Model 3</div>\n      <div style={{display:'flex',justifyContent:'center',marginBottom:20}}>\n        <div style={{width:120,height:120,borderRadius:'50%',border:'8px solid #34C759',display:'flex',flexDirection:'column',alignItems:'center',justifyContent:'center'}}>\n          <div style={{fontSize:32,fontWeight:700}}>{battery}%</div>\n          <div style={{fontSize:12,color:'#888'}}>{range} mi</div>\n        </div>\n      </div>\n      <div style={{display:'flex',justifyContent:'space-around',marginBottom:20}}>\n        <button onClick={()=>setClimateOn(!climateOn)}\n          style={{padding:'10px 16px',borderRadius:10,border:'none',background:climateOn?'#007AFF':'#333',color:'#fff',cursor:'pointer',fontSize:13}}>\n          {climateOn?'❄️ AC On':'🌡️ AC Off'}\n        </button>\n        <button onClick={()=>setLocked(!locked)}\n          style={{padding:'10px 16px',borderRadius:10,border:'none',background:locked?'#34C759':'#FF3B30',color:'#fff',cursor:'pointer',fontSize:13}}>\n          {locked?'🔒 Locked':'🔓 Unlocked'}\n        </button>\n      </div>\n      <div style={{display:'flex',gap:8,marginTop:'auto'}}>\n        <button onClick={()=>setBattery(Math.min(100,battery+5))}\n          style={{flex:1,padding:10,borderRadius:8,border:'1px solid #333',background:'#1a1a1a',color:'#fff',cursor:'pointer'}}>\n          +Charge\n        </button>\n        <button onClick={()=>setBattery(Math.max(0,battery-5))}\n          style={{flex:1,padding:10,borderRadius:8,border:'1px solid #333',background:'#1a1a1a',color:'#fff',cursor:'pointer'}}>\n          -Drive\n        </button>\n      </div>\n    </div>\n  );\n}\nrender(<TeslaStatus/>);",
  "placeholders": []
}