import 'package:please_pay_me/ui/ui.dart';
import 'package:please_pay_me_widgetbook/knobs/common_knobs.dart';
import 'package:please_pay_me_widgetbook/support/preview.dart';
import 'package:widgetbook/widgetbook.dart';

WidgetbookComponent skeletonsComponent() {
  return WidgetbookComponent(
    name: 'AppSkeleton',
    useCases: [
      WidgetbookUseCase(
        name: 'Block',
        builder: (context) {
          return IosPreview.centered(
            child: AppSkeleton(
              width: knobDouble(context, label: 'Width', initialValue: 200, min: 40, max: 320),
              height: knobDouble(context, label: 'Height', initialValue: 16, min: 8, max: 80),
              radius: knobDouble(context, label: 'Radius', initialValue: 6, min: 0, max: 24),
            ),
          );
        },
      ),
      WidgetbookUseCase(
        name: 'List loading',
        builder: (context) {
          final rows = knobInt(context, label: 'Rows', initialValue: 4, min: 1, max: 8);
          return IosPreview(
            stretch: true,
            child: AppListSection(
              header: 'Загрузка',
              separatorIndent: 60,
              children: List.generate(rows, (_) => const AppSkeletonRow()),
            ),
          );
        },
      ),
    ],
  );
}