{
  "id": "meal-planner",
  "name": "Meal Planner",
  "category": "cooking",
  "tags": ["meal", "plan", "food", "cooking", "weekly", "menu"],
  "description": "Weekly meal planner with breakfast, lunch, dinner slots for each day.",
  "triggers": ["meal planner", "weekly meals", "menu planner", "meal plan", "what to cook"],
  "defaultSize": { "w": 6, "h": 5 },
  "source": "function MealPlanner() {\n  const days = ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'];\n  const meals = ['Breakfast','Lunch','Dinner'];\n  const [plan, setPlan] = React.useState({\n    Mon:{Breakfast:'REPLACE_WITH_B_MON',Lunch:'REPLACE_WITH_L_MON',Dinner:'REPLACE_WITH_D_MON'},\n    Tue:{Breakfast:'Oatmeal',Lunch:'Salad',Dinner:'Pasta'},\n    Wed:{Breakfast:'Eggs',Lunch:'Sandwich',Dinner:'Curry'},\n    Thu:{Breakfast:'Toast',Lunch:'Soup',Dinner:'Stir-fry'},\n    Fri:{Breakfast:'Pancakes',Lunch:'Bowl',Dinner:'Pizza'},\n    Sat:{Breakfast:'Bagels',Lunch:'Tacos',Dinner:'Burgers'},\n    Sun:{Breakfast:'Waffles',Lunch:'Roast',Dinner:'Fish'}\n  });\n\n  const update = (day, meal, val) => {\n    setPlan(p=>({...p,[day]:{...p[day],[meal]:val}}));\n  };\n\n  return (\n    <div style={{padding:12,fontFamily:'system-ui',height:'100%',display:'flex',flexDirection:'column'}}>\n      <div style={{fontSize:18,fontWeight:700,marginBottom:12}}>Meal Planner</div>\n      <div style={{flex:1,overflow:'auto'}}>\n        <div style={{display:'grid',gridTemplateColumns:'80px repeat(3,1fr)',gap:4,minWidth:400}}>\n          <div style={{fontWeight:700,fontSize:12,color:'#888',padding:4}}>Day</div>\n          {meals.map(m=><div key={m} style={{fontWeight:700,fontSize:12,color:'#888',padding:4}}>{m}</div>)}\n          {days.map(day=> (\n            <React.Fragment key={day}>\n              <div style={{fontWeight:600,fontSize:13,padding:6,background:'#f5f5f5',borderRadius:6,display:'flex',alignItems:'center'}}>{day}</div>\n              {meals.map(meal=> (\n                <input key={meal} value={plan[day]?.[meal]||''}\n                  onChange={e=>update(day,meal,e.target.value)}\n                  style={{padding:6,borderRadius:6,border:'1px solid #ddd',fontSize:12}}/>\n              ))}\n            </React.Fragment>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\nrender(<MealPlanner/>);",
  "placeholders": [
    { "name": "REPLACE_WITH_B_MON", "description": "Monday breakfast", "default": "Oatmeal" },
    { "name": "REPLACE_WITH_L_MON", "description": "Monday lunch", "default": "Salad" },
    { "name": "REPLACE_WITH_D_MON", "description": "Monday dinner", "default": "Chicken" }
  ]
}