Dynamically sized headers are not handled well

[g-turley]

The headers render correctly at first, but once they are expanded, the first item is hidden under the header. Collapsing the header leaves a gap between headers until you scroll.

Reproducible example:

import 'package:flutter/material.dart';
import 'package:sliver_sticky_collapsable_panel/sliver_sticky_collapsable_panel.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Dynamic Header Size Example',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Dynamic Header Size Example')),
      body: Expanded(
        child: CustomScrollView(
          slivers: [
            for (int i = 1; i <= 10; i++)
              DynamicHeaderSection(
                title: 'Expandable Section $i',
                items: List.generate(5, (index) => 'Sub-item $i-$index'),
              ),
          ],
        ),
      ),
    );
  }
}

class DynamicHeaderSection extends StatefulWidget {
  final String title;
  final List<String> items;

  const DynamicHeaderSection({
    super.key,
    required this.title,
    required this.items,
  });

  @override
  State<DynamicHeaderSection> createState() => _DynamicHeaderSectionState();
}

class _DynamicHeaderSectionState extends State<DynamicHeaderSection> {
  final StickyCollapsablePanelController _controller =
      StickyCollapsablePanelController();
  final ScrollController _scrollController = ScrollController();

  @override
  Widget build(BuildContext context) {
    return SliverStickyCollapsablePanel(
      controller: _controller,
      scrollController: _scrollController,
      defaultExpanded: false,
      headerBuilder: (context, status) {
        return Container(
          color: Colors.blue.shade100,
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    widget.title,
                    style: const TextStyle(
                        fontSize: 18, fontWeight: FontWeight.bold),
                  ),
                  Icon(status.isExpanded ? Icons.expand_less : Icons.expand_more),
                ],
              ),
              if (status.isExpanded) ...[ // <==== This is problematic for the library.
                const SizedBox(height: 8),
                const Text('This additional content appears when expanded.'),
                const SizedBox(height: 8),
                Row(
                  children: [
                    ElevatedButton(
                      onPressed: () {},
                      child: const Text('Action 1'),
                    ),
                    const SizedBox(width: 8),
                    ElevatedButton(
                      onPressed: () {},
                      child: const Text('Action 2'),
                    ),
                  ],
                ),
              ],
            ],
          ),
        );
      },
      sliverPanel: SliverList.builder(
        itemCount: widget.items.length,
        itemBuilder: (context, index) =>
            ListTile(title: Text(widget.items[index])),
      ),
    );
  }
}