{title}

\n \n

\n {nutritionItems.map((item) => {\n const percentage = item.target \n ? calculateNutritionPercentage(item.value, item.target)\n : 0;\n \n return (\n

{item.icon}

{item.label}

\n {formatNutrition(item.value, item.unit)}\n

\n \n {showProgress && item.target && (\n <>\n

\n Target: {formatNutrition(item.target, item.unit)}\n

\n {percentage}%\n {percentage > 100 && (\n \n ({percentage - 100}% over)\n \n )}\n

\n \n )}\n \n {!showProgress && item.target && (\n

\n Daily target\n

\n )}\n

\n );\n })}\n

\n \n {/* Additional nutrition info if available */}\n {'sugar' in nutrition && 'sodium' in nutrition && (\n

Sugar

{formatNutrition(nutrition.sugar, 'g')}

Sodium

{formatNutrition(nutrition.sodium, 'mg')}

\n )}\n \n {showProgress && targets && (\n

\n Progress bars show percentage of daily targets met\n

\n )}\n

\n \n );\n}","deleted","label",[167,168,149],"frontend","components","permalink","https://www.val.town/x/kiboimichelle/MealplanApp/code/frontend/components/NutritionCard.tsx","extension","actionData","errors"]