|
1 | 1 | import 'package:flutter/material.dart';
|
2 |
| -import 'package:remix/components/avatar/avatar.dart'; |
| 2 | + |
| 3 | +import 'package:remix/remix.dart'; |
3 | 4 | import 'package:widgetbook/widgetbook.dart';
|
4 | 5 | import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
|
5 | 6 |
|
6 |
| -import '../helpers/label_variant_builder.dart'; |
7 |
| - |
8 | 7 | final _key = GlobalKey();
|
9 | 8 |
|
10 | 9 | @widgetbook.UseCase(
|
11 | 10 | name: 'Avatar Component',
|
12 |
| - type: RxAvatar, |
| 11 | + type: XAvatar, |
13 | 12 | )
|
14 | 13 | Widget buildAvatarUseCase(BuildContext context) {
|
15 | 14 | final imageUrl = context.knobs.string(
|
16 | 15 | label: 'Image URL',
|
17 | 16 | initialValue: 'https://i.pravatar.cc/150?img=48',
|
18 | 17 | );
|
19 | 18 |
|
20 |
| - Widget buildAvatar(AvatarVariant variant) { |
21 |
| - return Column( |
22 |
| - children: [ |
23 |
| - Text(variant.name.split('.').last), |
24 |
| - const SizedBox(height: 10), |
25 |
| - RxAvatar( |
26 |
| - image: NetworkImage(imageUrl), |
27 |
| - fallback: context.knobs.string( |
28 |
| - label: 'Fallback', |
29 |
| - initialValue: 'AB', |
30 |
| - ), |
31 |
| - variant: variant, |
32 |
| - size: context.knobs.list( |
33 |
| - label: 'Size', |
34 |
| - options: AvatarSize.values, |
35 |
| - initialOption: AvatarSize.size4, |
36 |
| - labelBuilder: variantLabelBuilder, |
37 |
| - ), |
38 |
| - radius: context.knobs.list( |
39 |
| - label: 'Radius', |
40 |
| - options: AvatarRadius.values, |
41 |
| - initialOption: AvatarRadius.full, |
42 |
| - labelBuilder: variantLabelBuilder, |
43 |
| - ), |
44 |
| - ), |
45 |
| - ], |
46 |
| - ); |
47 |
| - } |
48 |
| - |
49 | 19 | return KeyedSubtree(
|
50 | 20 | key: _key,
|
51 |
| - child: Wrap( |
52 |
| - spacing: 12, |
53 |
| - runSpacing: 12, |
54 |
| - children: AvatarVariant.values.map(buildAvatar).toList(), |
| 21 | + child: Center( |
| 22 | + child: XAvatar( |
| 23 | + image: imageUrl.isNotEmpty ? NetworkImage(imageUrl) : null, |
| 24 | + fallbackBuilder: (spec) => spec('CA'), |
| 25 | + ), |
55 | 26 | ),
|
56 | 27 | );
|
57 | 28 | }
|
0 commit comments