Procházet zdrojové kódy

P1-41 helft 2: categorietags van de afbeelding af naar de tekstkolom

Op de drie levende kaartcomponenten staat het groene categorielabel niet
langer over de (donkerste hoek van de) afbeelding, maar als laatste regel
onder de tekst — zelfde plek als de horeca-overzichtskaart uit P1-36:

- HomeUitgaantabelKaartComponent (Home, alle 5 tabs)
- UitgaantabelKaart (Favorieten tab 1)
- PUitgaanSliderKaartComponent (Home-slider en PUitgaan-slider)

De Align-wrapper uit de Stack is per component gewist, zodat de labels
links uitlijnen met de rest van de tekst. Op de sliderkaart (carousel met
vaste hoogte) paste de extra regel niet: verticale padding van de kaart-
Row van 20/20 naar 4/4.

Geverifieerd via verse export (List.generate + categorieTag-binding
intact, 0 dart-analyze-errors) en een profile-build op de telefoon-
emulator. Bijvangst bevestigd: "Kindvriendelijk" breekt niet meer midden
in het woord af.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
bob před 1 týdnem
rodič
revize
587976ec11

+ 40 - 0
CLAUDE.md

@@ -1573,6 +1573,46 @@ spoor hierboven: kopiëren kan niet, **verplaatsen wel**.
   Container weg en tilt de kinderen een niveau omhoog — precies wat je
   wilt, en het scheelt het gevecht met de padding-velden (die vielen hier
   buiten het klikbare gebied, zie de clipping-notities elders).
+- **"Node naar achteren verplaatsen" wordt één herhaalde sleep als je
+  eerst alle siblings inklapt** (bevestigd 2026-09-04, P1-41 op drie
+  kaartcomponenten). Klap elke kind-rij van de doel-`Column` in (chevrons
+  van onder naar boven, dan schuiven de nog te klikken chevrons niet), zet
+  de te verplaatsen node erin (landt op positie 0) en sleep daarna telkens
+  **de onderste rij naar de `Column`-rij**, net zo vaak als er siblings
+  zijn. Bron- en doelcoördinaat blijven dan élke keer identiek — bij een
+  `Column` met 5 kinderen zijn dat 5 exact dezelfde sleepacties.
+- **Doe niet meer dan één sleep per tool-aanroep.** Twee `left_click_drag`s
+  in één `browser_batch` (zelfs met 5s ertussen) lieten er structureel maar
+  één landen, zonder foutmelding — de boom is nog aan het herrenderen.
+  Verifieer elke sleep met een `zoom` op het boompaneel.
+- **De `Align`-wrapper die een widget in een `Stack` had, hoort ná de
+  verhuizing weg.** Er is geen aparte `Align`-tree-node om te verwijderen:
+  het is de sectie **Alignment** in het rechterpaneel van de verplaatste
+  node zelf. Het **↺-icoontje rechts naast de kop "Alignment"** wist X én
+  Y in één klik, en dán verdwijnt de `Align(...)` ook echt uit de export
+  (X/Y handmatig op -1/0 zetten laat de wrapper staan).
+
+**Numerieke velden in het rechterpaneel (Padding, Border Radius, …):
+één `left_click` + `ctrl+a` + typen — `triple_click` focust ze niet.**
+Bevestigd 2026-09-04, nadat `triple_click` + typen 3x achter elkaar
+niets deed (veld bleef de oude waarde tonen, geen foutmelding — hetzelfde
+"lijkt-gelukt"-patroon als elders). Mik op het **getal zelf**, niet op het
+vak eromheen: bij de padding-widget liggen de vier waarden dicht op elkaar
+en een paar pixels ernaast focust de buurwaarde (een klik bedoeld voor
+"bottom" landde op "left"). Gebruik `zoom` om de exacte pixelpositie van
+het getal te lezen, en verifieer daarna met een tweede `zoom`.
+
+**Een `Align`/tag-blok uit een `Stack` naar een tekstkolom verplaatsen
+kost verticale ruimte — check een kaart met vaste hoogte daarna op een
+echt toestel.** Bevestigd 2026-09-04 (P1-41): op
+`PUitgaanSliderKaartComponent` (carousel met vaste hoogte, 180 dp op
+telefoon) liep het verplaatste categorielabel meteen buiten de witte kaart
+— in een **profile**-build volledig stil: geen gele overflow-streep, niets
+in `dart analyze`, niets in `logcat`, alleen een half afgekapt label op de
+screenshot. Opgelost door de verticale padding van de kaart-`Row` van
+20/20 naar 4/4 te zetten (32 dp gewonnen, ruim genoeg). Bij zo'n
+verplaatsing dus altijd: eerst kijken of de ouder een vaste hoogte
+oplegt, en daarna een screenshot op telefoonformaat (411 dp).
 
 **Een `ListView`/`GridView` met pagination van widgettype wisselen —
 Replace weigert eerst.** Rechtsklik → Replace geeft *"Can't replace a

+ 0 - 66
TASKS.md

@@ -2068,72 +2068,6 @@ in Drupal, geen uitputtende audit.
 
 ---
 
-**P1-41 · Eigenaar: Claude** (helft 1 af, helft 2 open — vrij op te pakken). De kaarten van
-`HomeUitgaantabelKaartComponent` hadden dezelfde ontwerpfout die P1-36 op de
-horeca-overzichtskaart oploste: twee groene categoriepillen liggen linksonder
-óver de afbeelding (donkerste hoek, slecht leesbaar), als pil i.p.v. recht
-blokje, en op smalle kaarten breekt "Kindvriendelijk" midden in het woord af.
-
-**Helft 1 — pilvorm → recht blokje: AFGEROND (2026-09-03b).** De groene tag is
-het gedeelde component `lib/shared/tag_categorie_component/`; daar staat nu
-`BorderRadius.circular(0.0)` i.p.v. 12 (exportgeverifieerd). Dat maakt in één
-keer élke categorietag in de app merkconform. Bob gaf hier expliciet akkoord
-voor, juist omdat het breed doorwerkt.
-
-**Helft 2 — positie (labels van de afbeelding af): nog te doen.** Kan *niet*
-centraal: het component is alleen het groene blokje (`Padding > Container >
-Text`); wáár het landt bepaalt de ouder, via een `Align` binnen de `Stack` van
-elke kaart (op Home: `Align(-0.92, 0.76)`). Dus per kaartcomponent verplaatsen,
-met het sleep-recept uit `CLAUDE.md` ("Een widget VERPLAATSEN lukt wél").
-
-**Het zijn er 3, niet 9** (uitgezocht 2026-09-03b via
-`grep -rl "<Component>Widget("`). Acht bestanden gebruiken het tag-component,
-maar vijf daarvan worden nergens meer aangeroepen —
-`KaartTabelUitgaanComp`, `KaartTabelUitgaanSComp`,
-`KaartSliderUitgaanSComp` (zijn enige gebruiker
-`SliderUitgaanComponentSmallCurrent` is zelf ook nergens in gebruik),
-`PUitgaantabelKaartComponentOrgineelMetKaartjeerin` en
-`HomeUitgaantabelKaartComponentCopy`. Die vallen onder P2-7's opruimactie, niet
-onder deze taak. **Wél levend:**
-1. `HomeUitgaantabelKaartComponent` — Home, alle 5 tabs;
-2. `PUitgaanSliderKaartComponent` — Home-slider én PUitgaan-slider;
-3. `UitgaantabelKaart` — Favorieten tab 1.
-
-**Concreet per component (structuur uitgezocht 2026-09-03b, regelnummers uit
-de export van die dag — controleer ze, ze schuiven bij elke export):**
-- `home_uitgaantabel_kaart_component_widget.dart` — `Stack` (r250) met twee
-  kinderen: `Align(0.0, 1.0)` = de afbeelding (r252) en `Align(-0.92, 0.76)` =
-  de tags (r302, `Wrap` > `List.generate` > `TagCategorieComponentWidget`). De
-  tekstkolom staat ná de Stack in `Align(-1.0, 0.0) > Column` (r384).
-- `uitgaantabel_kaart_widget.dart` — identiek patroon: `Stack` (r185),
-  afbeelding `Align(0.0, 1.0)` (r187), tags `Align(-0.92, 0.76)` (r227),
-  tekstkolom `Align(-1.0, 0.0) > Column` (r299).
-- `p_uitgaan_slider_kaart_component_widget.dart` — wijkt af: `Stack` (r138)
-  met afbeelding `Align(1.0, 0.0)` (r140) en tags `Align(1.0, 1.0)` (r169);
-  de tags zitten hier rechtsonder, en élk los label heeft binnen de `Wrap` nóg
-  een eigen `Align(1.0, 1.0)` (r204). De tekstkolom staat verderop (r249).
-
-**Werkwijze:** sleep in de Widget Tree de tag-`Align` (met zijn hele subtree)
-uit de `Stack` naar de tekst-`Column` eronder. Let op het deterministische
-insert-gedrag uit `CLAUDE.md`: een drop op een container-rij zet de node
-**altijd als eerste kind** — wil je 'm onderaan, drop dan de siblings ná hem
-opnieuw op de ouder in omgekeerde volgorde. Klap de te verslepen node eerst in
-(chevron), anders passen bron en doel niet samen in beeld (het boompaneel
-scrollt niet met het muiswiel). Is de omhullende `Align` daarna alleen nog
-uitlijning: rechtsklik → **Remove Widget** tilt de kinderen een niveau omhoog.
-**Verifieer na élk component met een verse export dat `List.generate(...)` en
-de `categorieTag`-binding nog staan** — dat is precies wat bij een verkeerde
-Wrap/Remove-volgorde stilletjes sneuvelt.
-
-**Bijvangst die tegelijk kan:** op smalle kaarten breekt "Kindvriendelijk"
-midden in het woord af. Zodra de labels onder de tekst staan (volle
-kaartbreedte i.p.v. de halve breedte naast de foto) is dat waarschijnlijk al
-opgelost; check het op telefoonformaat vóór je er extra werk in steekt.
-
-De horeca-overzichtskaart uit P1-36 gebruikt dit gedeelde component
-**niet** (die had een eigen inline groene Container), dus die is met de
-fix van 2026-09-03 al klaar en verandert hier niet door mee.
-
 ## P2 — features & concept, na livegang
 
 **P2-1 · Eigenaar: Bob — testen in de API, komt terug.** Datum-filter:

+ 4 - 4
ios/Runner.xcodeproj/project.pbxproj

@@ -49,8 +49,8 @@
 		97C146FB1CF9000F007C117D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
 		97C146FD1CF9000F007C117D /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
 		97C147001CF9000F007C117D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
-		6436409327A31CDC00820AF7 /* nl */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = nl; path = nl.lproj/InfoPlist.strings; sourceTree = "<group>"; };
-		6436409E27A31CDB00820AF7 /* en */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = en; path = en.lproj/InfoPlist.strings; sourceTree = "<group>"; };
+		6436409B27A31CD900820AF7 /* nl */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = nl; path = nl.lproj/InfoPlist.strings; sourceTree = "<group>"; };
+		6436409C27A31CD400820AF7 /* en */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = en; path = en.lproj/InfoPlist.strings; sourceTree = "<group>"; };
 		97C147021CF9000F007C117D /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		A9C17DEFA21738E5FBD7F54A /* Pods-Runner.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.release.xcconfig"; path = "Target Support Files/Pods-Runner/Pods-Runner.release.xcconfig"; sourceTree = "<group>"; };
 		B8285832C7E7A3262A5A897C /* Pods_Runner.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_Runner.framework; sourceTree = BUILT_PRODUCTS_DIR; };
@@ -317,8 +317,8 @@
 		6436409C27A31CD800820AF7 /* InfoPlist.strings */ = {
 			isa = PBXVariantGroup;
 			children = (
-				6436409327A31CDC00820AF7 /* nl */,
-				6436409E27A31CDB00820AF7 /* en */,
+				6436409B27A31CD900820AF7 /* nl */,
+				6436409C27A31CD400820AF7 /* en */,
 			);
 			name = InfoPlist.strings;
 			sourceTree = "<group>";

+ 67 - 67
lib/uitgaanspaginas/home_uitgaantabel_kaart_component/home_uitgaantabel_kaart_component_widget.dart

@@ -299,73 +299,6 @@ class _HomeUitgaantabelKaartComponentWidgetState
                                     },
                                   ),
                                 ),
-                                Align(
-                                  alignment: AlignmentDirectional(-0.92, 0.76),
-                                  child: Padding(
-                                    padding: EdgeInsetsDirectional.fromSTEB(
-                                        8.0, 4.0, 8.0, 4.0),
-                                    child: Container(
-                                      decoration: BoxDecoration(),
-                                      child: Builder(
-                                        builder: (context) {
-                                          final categorieitem = getJsonField(
-                                            evenementenItem,
-                                            r'''$.categorie''',
-                                          ).toList();
-                                          _model.debugGeneratorVariables[
-                                                  'categorieitem${categorieitem.length > 100 ? ' (first 100)' : ''}'] =
-                                              debugSerializeParam(
-                                            categorieitem.take(100),
-                                            ParamType.JSON,
-                                            isList: true,
-                                            link:
-                                                'https://app.flutterflow.io/project/uitgaanskrant-1qhvtd?tab=uiBuilder&page=HomeUitgaantabelKaartComponent',
-                                            name: 'dynamic',
-                                            nullable: false,
-                                          );
-                                          debugLogWidgetClass(_model);
-
-                                          return Wrap(
-                                            spacing: 0.0,
-                                            runSpacing: 0.0,
-                                            alignment: WrapAlignment.start,
-                                            crossAxisAlignment:
-                                                WrapCrossAlignment.start,
-                                            direction: Axis.horizontal,
-                                            runAlignment: WrapAlignment.start,
-                                            verticalDirection:
-                                                VerticalDirection.down,
-                                            clipBehavior: Clip.none,
-                                            children: List.generate(
-                                                categorieitem.length,
-                                                (categorieitemIndex) {
-                                              final categorieitemItem =
-                                                  categorieitem[
-                                                      categorieitemIndex];
-                                              return Builder(builder: (_) {
-                                                return DebugFlutterFlowModelContext(
-                                                  rootModel: _model.rootModel,
-                                                  parentModelCallback: (m) {
-                                                    _model.tagCategorieComponentModels[
-                                                        'Keyorv_${categorieitemIndex}_of_${categorieitem.length}'] = m;
-                                                  },
-                                                  child:
-                                                      TagCategorieComponentWidget(
-                                                    key: Key(
-                                                        'Keyorv_${categorieitemIndex}_of_${categorieitem.length}'),
-                                                    categorieTag:
-                                                        categorieitemItem
-                                                            .toString(),
-                                                  ),
-                                                );
-                                              });
-                                            }),
-                                          );
-                                        },
-                                      ),
-                                    ),
-                                  ),
-                                ),
                               ],
                             ),
                           ),
@@ -702,6 +635,73 @@ class _HomeUitgaantabelKaartComponentWidgetState
                                             overflow: TextOverflow.ellipsis,
                                           ),
                                         ),
+                                      Padding(
+                                        padding: EdgeInsetsDirectional.fromSTEB(
+                                            0.0, 4.0, 8.0, 4.0),
+                                        child: Container(
+                                          decoration: BoxDecoration(),
+                                          child: Builder(
+                                            builder: (context) {
+                                              final categorieitem =
+                                                  getJsonField(
+                                                evenementenItem,
+                                                r'''$.categorie''',
+                                              ).toList();
+                                              _model.debugGeneratorVariables[
+                                                      'categorieitem${categorieitem.length > 100 ? ' (first 100)' : ''}'] =
+                                                  debugSerializeParam(
+                                                categorieitem.take(100),
+                                                ParamType.JSON,
+                                                isList: true,
+                                                link:
+                                                    'https://app.flutterflow.io/project/uitgaanskrant-1qhvtd?tab=uiBuilder&page=HomeUitgaantabelKaartComponent',
+                                                name: 'dynamic',
+                                                nullable: false,
+                                              );
+                                              debugLogWidgetClass(_model);
+
+                                              return Wrap(
+                                                spacing: 0.0,
+                                                runSpacing: 0.0,
+                                                alignment: WrapAlignment.start,
+                                                crossAxisAlignment:
+                                                    WrapCrossAlignment.start,
+                                                direction: Axis.horizontal,
+                                                runAlignment:
+                                                    WrapAlignment.start,
+                                                verticalDirection:
+                                                    VerticalDirection.down,
+                                                clipBehavior: Clip.none,
+                                                children: List.generate(
+                                                    categorieitem.length,
+                                                    (categorieitemIndex) {
+                                                  final categorieitemItem =
+                                                      categorieitem[
+                                                          categorieitemIndex];
+                                                  return Builder(builder: (_) {
+                                                    return DebugFlutterFlowModelContext(
+                                                      rootModel:
+                                                          _model.rootModel,
+                                                      parentModelCallback: (m) {
+                                                        _model.tagCategorieComponentModels[
+                                                            'Keyorv_${categorieitemIndex}_of_${categorieitem.length}'] = m;
+                                                      },
+                                                      child:
+                                                          TagCategorieComponentWidget(
+                                                        key: Key(
+                                                            'Keyorv_${categorieitemIndex}_of_${categorieitem.length}'),
+                                                        categorieTag:
+                                                            categorieitemItem
+                                                                .toString(),
+                                                      ),
+                                                    );
+                                                  });
+                                                }),
+                                              );
+                                            },
+                                          ),
+                                        ),
+                                      ),
                                     ],
                                   ),
                                 ),

+ 54 - 59
lib/uitgaanspaginas/p_uitgaan_slider_kaart_component/p_uitgaan_slider_kaart_component_widget.dart

@@ -111,7 +111,7 @@ class _PUitgaanSliderKaartComponentWidgetState
     _model.tagCategorieComponentModels.clear();
 
     return Padding(
-      padding: EdgeInsetsDirectional.fromSTEB(0.0, 20.0, 0.0, 20.0),
+      padding: EdgeInsetsDirectional.fromSTEB(0.0, 4.0, 0.0, 4.0),
       child: IntrinsicHeight(
         child: Row(
           mainAxisSize: MainAxisSize.max,
@@ -166,64 +166,6 @@ class _PUitgaanSliderKaartComponentWidgetState
                           },
                         ),
                       ),
-                      Align(
-                        alignment: AlignmentDirectional(1.0, 1.0),
-                        child: Padding(
-                          padding: EdgeInsetsDirectional.fromSTEB(
-                              0.0, 0.0, 15.0, 5.0),
-                          child: Builder(
-                            builder: (context) {
-                              final categorie =
-                                  widget!.categorie?.toList() ?? [];
-                              _model.debugGeneratorVariables[
-                                      'categorie${categorie.length > 100 ? ' (first 100)' : ''}'] =
-                                  debugSerializeParam(
-                                categorie.take(100),
-                                ParamType.String,
-                                isList: true,
-                                link:
-                                    'https://app.flutterflow.io/project/uitgaanskrant-1qhvtd?tab=uiBuilder&page=PUitgaanSliderKaartComponent',
-                                name: 'String',
-                                nullable: false,
-                              );
-                              debugLogWidgetClass(_model);
-
-                              return Wrap(
-                                spacing: 0.0,
-                                runSpacing: 0.0,
-                                alignment: WrapAlignment.start,
-                                crossAxisAlignment: WrapCrossAlignment.start,
-                                direction: Axis.horizontal,
-                                runAlignment: WrapAlignment.start,
-                                verticalDirection: VerticalDirection.down,
-                                clipBehavior: Clip.none,
-                                children: List.generate(categorie.length,
-                                    (categorieIndex) {
-                                  final categorieItem =
-                                      categorie[categorieIndex];
-                                  return Align(
-                                    alignment: AlignmentDirectional(1.0, 1.0),
-                                    child: Builder(builder: (_) {
-                                      return DebugFlutterFlowModelContext(
-                                        rootModel: _model.rootModel,
-                                        parentModelCallback: (m) {
-                                          _model.tagCategorieComponentModels[
-                                              'Keyb8d_${categorieIndex}_of_${categorie.length}'] = m;
-                                        },
-                                        child: TagCategorieComponentWidget(
-                                          key: Key(
-                                              'Keyb8d_${categorieIndex}_of_${categorie.length}'),
-                                          categorieTag: categorieItem,
-                                        ),
-                                      );
-                                    }),
-                                  );
-                                }),
-                              );
-                            },
-                          ),
-                        ),
-                      ),
                     ],
                   ),
                 ),
@@ -401,6 +343,59 @@ class _PUitgaanSliderKaartComponentWidgetState
                         ],
                       ),
                     ),
+                    Padding(
+                      padding:
+                          EdgeInsetsDirectional.fromSTEB(0.0, 0.0, 15.0, 5.0),
+                      child: Builder(
+                        builder: (context) {
+                          final categorie = widget!.categorie?.toList() ?? [];
+                          _model.debugGeneratorVariables[
+                                  'categorie${categorie.length > 100 ? ' (first 100)' : ''}'] =
+                              debugSerializeParam(
+                            categorie.take(100),
+                            ParamType.String,
+                            isList: true,
+                            link:
+                                'https://app.flutterflow.io/project/uitgaanskrant-1qhvtd?tab=uiBuilder&page=PUitgaanSliderKaartComponent',
+                            name: 'String',
+                            nullable: false,
+                          );
+                          debugLogWidgetClass(_model);
+
+                          return Wrap(
+                            spacing: 0.0,
+                            runSpacing: 0.0,
+                            alignment: WrapAlignment.start,
+                            crossAxisAlignment: WrapCrossAlignment.start,
+                            direction: Axis.horizontal,
+                            runAlignment: WrapAlignment.start,
+                            verticalDirection: VerticalDirection.down,
+                            clipBehavior: Clip.none,
+                            children: List.generate(categorie.length,
+                                (categorieIndex) {
+                              final categorieItem = categorie[categorieIndex];
+                              return Align(
+                                alignment: AlignmentDirectional(1.0, 1.0),
+                                child: Builder(builder: (_) {
+                                  return DebugFlutterFlowModelContext(
+                                    rootModel: _model.rootModel,
+                                    parentModelCallback: (m) {
+                                      _model.tagCategorieComponentModels[
+                                          'Keyb8d_${categorieIndex}_of_${categorie.length}'] = m;
+                                    },
+                                    child: TagCategorieComponentWidget(
+                                      key: Key(
+                                          'Keyb8d_${categorieIndex}_of_${categorie.length}'),
+                                      categorieTag: categorieItem,
+                                    ),
+                                  );
+                                }),
+                              );
+                            }),
+                          );
+                        },
+                      ),
+                    ),
                   ],
                 ),
               ),

+ 58 - 59
lib/uitgaanspaginas/uitgaantabel_kaart/uitgaantabel_kaart_widget.dart

@@ -224,65 +224,6 @@ class _UitgaantabelKaartWidgetState extends State<UitgaantabelKaartWidget>
                           },
                         ),
                       ),
-                      Align(
-                        alignment: AlignmentDirectional(-0.92, 0.76),
-                        child: Padding(
-                          padding: EdgeInsetsDirectional.fromSTEB(
-                              8.0, 4.0, 8.0, 4.0),
-                          child: Container(
-                            decoration: BoxDecoration(),
-                            child: Builder(
-                              builder: (context) {
-                                final categorieitem =
-                                    widget!.categorie?.toList() ?? [];
-                                _model.debugGeneratorVariables[
-                                        'categorieitem${categorieitem.length > 100 ? ' (first 100)' : ''}'] =
-                                    debugSerializeParam(
-                                  categorieitem.take(100),
-                                  ParamType.JSON,
-                                  isList: true,
-                                  link:
-                                      'https://app.flutterflow.io/project/uitgaanskrant-1qhvtd?tab=uiBuilder&page=UitgaantabelKaart',
-                                  name: 'dynamic',
-                                  nullable: false,
-                                );
-                                debugLogWidgetClass(_model);
-
-                                return Wrap(
-                                  spacing: 0.0,
-                                  runSpacing: 0.0,
-                                  alignment: WrapAlignment.start,
-                                  crossAxisAlignment: WrapCrossAlignment.start,
-                                  direction: Axis.horizontal,
-                                  runAlignment: WrapAlignment.start,
-                                  verticalDirection: VerticalDirection.down,
-                                  clipBehavior: Clip.none,
-                                  children: List.generate(categorieitem.length,
-                                      (categorieitemIndex) {
-                                    final categorieitemItem =
-                                        categorieitem[categorieitemIndex];
-                                    return Builder(builder: (_) {
-                                      return DebugFlutterFlowModelContext(
-                                        rootModel: _model.rootModel,
-                                        parentModelCallback: (m) {
-                                          _model.tagCategorieComponentModels[
-                                              'Keynhs_${categorieitemIndex}_of_${categorieitem.length}'] = m;
-                                        },
-                                        child: TagCategorieComponentWidget(
-                                          key: Key(
-                                              'Keynhs_${categorieitemIndex}_of_${categorieitem.length}'),
-                                          categorieTag:
-                                              categorieitemItem.toString(),
-                                        ),
-                                      );
-                                    });
-                                  }),
-                                );
-                              },
-                            ),
-                          ),
-                        ),
-                      ),
                     ],
                   ),
                 ),
@@ -574,6 +515,64 @@ class _UitgaantabelKaartWidgetState extends State<UitgaantabelKaartWidget>
                                 },
                               ),
                             ),
+                            Padding(
+                              padding: EdgeInsetsDirectional.fromSTEB(
+                                  8.0, 4.0, 8.0, 4.0),
+                              child: Container(
+                                decoration: BoxDecoration(),
+                                child: Builder(
+                                  builder: (context) {
+                                    final categorieitem =
+                                        widget!.categorie?.toList() ?? [];
+                                    _model.debugGeneratorVariables[
+                                            'categorieitem${categorieitem.length > 100 ? ' (first 100)' : ''}'] =
+                                        debugSerializeParam(
+                                      categorieitem.take(100),
+                                      ParamType.JSON,
+                                      isList: true,
+                                      link:
+                                          'https://app.flutterflow.io/project/uitgaanskrant-1qhvtd?tab=uiBuilder&page=UitgaantabelKaart',
+                                      name: 'dynamic',
+                                      nullable: false,
+                                    );
+                                    debugLogWidgetClass(_model);
+
+                                    return Wrap(
+                                      spacing: 0.0,
+                                      runSpacing: 0.0,
+                                      alignment: WrapAlignment.start,
+                                      crossAxisAlignment:
+                                          WrapCrossAlignment.start,
+                                      direction: Axis.horizontal,
+                                      runAlignment: WrapAlignment.start,
+                                      verticalDirection: VerticalDirection.down,
+                                      clipBehavior: Clip.none,
+                                      children:
+                                          List.generate(categorieitem.length,
+                                              (categorieitemIndex) {
+                                        final categorieitemItem =
+                                            categorieitem[categorieitemIndex];
+                                        return Builder(builder: (_) {
+                                          return DebugFlutterFlowModelContext(
+                                            rootModel: _model.rootModel,
+                                            parentModelCallback: (m) {
+                                              _model.tagCategorieComponentModels[
+                                                  'Keynhs_${categorieitemIndex}_of_${categorieitem.length}'] = m;
+                                            },
+                                            child: TagCategorieComponentWidget(
+                                              key: Key(
+                                                  'Keynhs_${categorieitemIndex}_of_${categorieitem.length}'),
+                                              categorieTag:
+                                                  categorieitemItem.toString(),
+                                            ),
+                                          );
+                                        });
+                                      }),
+                                    );
+                                  },
+                                ),
+                              ),
+                            ),
                           ],
                         ),
                       ),