import React, { useState } from ‘react’;
import {
ShoppingBasket,
Check,
Leaf,
Fish,
Wheat,
Milk,
Nut,
Carrot,
Info,
Printer,
Mail
} from ‘lucide-react’;
const GroceryList = () => {
const [checkedItems, setCheckedItems] = useState({});
const categories = [
{
title: “Eiwitten (Vlees, Vis, Ei, Vega)”,
icon:
{/* Intro Card */}
Gezonde Voorraadlijst
Een goede voorbereiding is het halve werk.
Met deze spullen in huis ben je voorbereid om gezonde keuzes te maken.
Doordat je goed gevoed bent, zul je minder cravings hebben voor suikers en vette voeding.
{categories.map((category, idx) => (
))}
{/* Footer Text */}
{category.icon}
{category.title}
-
{category.items.map((item, itemIdx) => {
const isChecked = checkedItems[item];
return (
- toggleItem(item)}
className={`
flex items-center gap-3 p-3 rounded-xl cursor-pointer transition-all print:p-1 print:bg-transparent
${isChecked ? ‘bg-emerald-100 text-emerald-800 print:text-gray-400’ : ‘bg-white hover:bg-gray-50 text-gray-700’}
`}
>
{isChecked &&{item}
}
);
})}