Skip to content

Commit 965d5ba

Browse files
witwashwitwash
authored
feat: [DX-2198] Migrate stories to widgetbook (#682)
1 parent 149f6a2 commit 965d5ba

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

66 files changed

+4690
-16
lines changed

‎optimus_widgetbook/ios/Flutter/Debug.xcconfig

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1+
#include? "Pods/Target Support Files/Pods-Runner/Pods-Runner.debug.xcconfig"
12
#include "Generated.xcconfig"

‎optimus_widgetbook/ios/Flutter/Release.xcconfig

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1+
#include? "Pods/Target Support Files/Pods-Runner/Pods-Runner.release.xcconfig"
12
#include "Generated.xcconfig"

‎optimus_widgetbook/ios/Podfile

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
# Uncomment this line to define a global platform for your project
2+
# platform :ios, '12.0'
3+
4+
# CocoaPods analytics sends network stats synchronously affecting flutter build latency.
5+
ENV['COCOAPODS_DISABLE_STATS'] = 'true'
6+
7+
project 'Runner', {
8+
'Debug' => :debug,
9+
'Profile' => :release,
10+
'Release' => :release,
11+
}
12+
13+
def flutter_root
14+
generated_xcode_build_settings_path = File.expand_path(File.join('..', 'Flutter', 'Generated.xcconfig'), __FILE__)
15+
unless File.exist?(generated_xcode_build_settings_path)
16+
raise "#{generated_xcode_build_settings_path} must exist. If you're running pod install manually, make sure flutter pub get is executed first"
17+
end
18+
19+
File.foreach(generated_xcode_build_settings_path) do |line|
20+
matches = line.match(/FLUTTER_ROOT\=(.*)/)
21+
return matches[1].strip if matches
22+
end
23+
raise "FLUTTER_ROOT not found in #{generated_xcode_build_settings_path}. Try deleting Generated.xcconfig, then run flutter pub get"
24+
end
25+
26+
require File.expand_path(File.join('packages', 'flutter_tools', 'bin', 'podhelper'), flutter_root)
27+
28+
flutter_ios_podfile_setup
29+
30+
target 'Runner' do
31+
use_frameworks!
32+
use_modular_headers!
33+
34+
flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
35+
target 'RunnerTests' do
36+
inherit! :search_paths
37+
end
38+
end
39+
40+
post_install do |installer|
41+
installer.pods_project.targets.each do |target|
42+
flutter_additional_ios_build_settings(target)
43+
end
44+
end

‎optimus_widgetbook/lib/components/buttons/button.dart

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import 'package:flutter/widgets.dart';
2+
import 'package:optimus/optimus.dart';
3+
import 'package:optimus_widgetbook/components/common/common.dart';
4+
import 'package:widgetbook/widgetbook.dart';
5+
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
6+
7+
@widgetbook.UseCase(
8+
name: 'Default Style',
9+
type: OptimusButton,
10+
path: '[Buttons]/Button',
11+
)
12+
Widget createDefaultStyle(BuildContext context) {
13+
final k = context.knobs;
14+
15+
final leadingIcon = k.listOrNull(
16+
label: 'Leading icon',
17+
initialOption: null,
18+
options: exampleIcons,
19+
);
20+
final trailingIcon = k.listOrNull(
21+
label: 'Trailing icon',
22+
initialOption: null,
23+
options: exampleIcons,
24+
);
25+
26+
final showBadge = k.boolean(label: 'Show Badge', initialValue: false);
27+
final counter =
28+
k.int.slider(label: 'Badge Count', initialValue: 0, max: 110, min: 0);
29+
30+
return SingleChildScrollView(
31+
child: Column(
32+
children: OptimusButtonVariant.values
33+
.map(
34+
(v) => Padding(
35+
padding: const EdgeInsets.all(8),
36+
child: OptimusButton(
37+
onPressed: k.boolean(label: 'Enabled', initialValue: true)
38+
? () {}
39+
: null,
40+
size: k.list(
41+
label: 'Size',
42+
initialOption: OptimusWidgetSize.large,
43+
options: OptimusWidgetSize.values,
44+
),
45+
isLoading: k.boolean(label: 'Loading', initialValue: false),
46+
variant: v,
47+
leadingIcon: leadingIcon,
48+
trailingIcon: trailingIcon,
49+
counter: showBadge ? counter : null,
50+
child: Text(k.string(label: 'Text', initialValue: 'Button')),
51+
),
52+
),
53+
)
54+
.toList(),
55+
),
56+
);
57+
}

‎optimus_widgetbook/lib/components/buttons/dropdown.dart

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import 'package:flutter/widgets.dart';
2+
import 'package:optimus/optimus.dart';
3+
import 'package:widgetbook/widgetbook.dart';
4+
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
5+
6+
@widgetbook.UseCase(
7+
name: 'Dropdown Button',
8+
type: OptimusDropDownButton,
9+
path: '[Buttons]/Dropdown Button',
10+
)
11+
Widget createDefaultStyle(BuildContext context) {
12+
final k = context.knobs;
13+
final isEnabled = k.boolean(label: 'Enabled', initialValue: true);
14+
15+
return SingleChildScrollView(
16+
child: Column(
17+
children: OptimusDropdownButtonVariant.values
18+
.map(
19+
(v) => Padding(
20+
padding: const EdgeInsets.symmetric(vertical: 8),
21+
child: OptimusDropDownButton<int>(
22+
size: k.list(
23+
label: 'Size',
24+
initialOption: OptimusWidgetSize.large,
25+
options: OptimusWidgetSize.values,
26+
),
27+
items: Iterable<int>.generate(10)
28+
.map(
29+
(i) => ListDropdownTile<int>(
30+
value: i,
31+
title: Text('Dropdown tile #$i'),
32+
subtitle: Text('Subtitle #$i'),
33+
),
34+
)
35+
.toList(),
36+
onItemSelected: isEnabled ? (_) => () {} : null,
37+
variant: v,
38+
child: Text(
39+
k.string(label: 'Label', initialValue: 'Dropdown button'),
40+
),
41+
),
42+
),
43+
)
44+
.toList(),
45+
),
46+
);
47+
}

‎optimus_widgetbook/lib/components/buttons/icon.dart

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import 'package:dfunc/dfunc.dart';
2+
import 'package:flutter/widgets.dart';
3+
import 'package:optimus/optimus.dart';
4+
import 'package:optimus_widgetbook/components/common/common.dart';
5+
import 'package:widgetbook/widgetbook.dart';
6+
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
7+
8+
@widgetbook.UseCase(
9+
name: 'Icon Button',
10+
type: OptimusIconButton,
11+
path: '[Buttons]/Icon Button',
12+
)
13+
Widget createDefaultStyle(BuildContext context) {
14+
final k = context.knobs;
15+
16+
final icon = k.list(
17+
label: 'Icon',
18+
initialOption: OptimusIcons.calendar,
19+
options: exampleIcons,
20+
);
21+
22+
return SingleChildScrollView(
23+
child: Column(
24+
children: OptimusButtonVariant.values
25+
.map(
26+
(v) => Padding(
27+
padding: const EdgeInsets.all(8),
28+
child: OptimusIconButton(
29+
onPressed: k.boolean(label: 'Enabled', initialValue: true)
30+
? ignore
31+
: null,
32+
icon: Icon(icon),
33+
size: k.list(
34+
label: 'Size',
35+
initialOption: OptimusWidgetSize.large,
36+
options: OptimusWidgetSize.values,
37+
),
38+
variant: v,
39+
),
40+
),
41+
)
42+
.toList(),
43+
),
44+
);
45+
}

‎optimus_widgetbook/lib/components/buttons/split.dart

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import 'package:flutter/widgets.dart';
2+
import 'package:optimus/optimus.dart';
3+
import 'package:widgetbook/widgetbook.dart';
4+
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
5+
6+
@widgetbook.UseCase(
7+
name: 'Split Button',
8+
type: OptimusSplitButton,
9+
path: '[Buttons]/Split Button',
10+
)
11+
Widget createDefaultStyle(BuildContext context) {
12+
final k = context.knobs;
13+
final isEnabled = k.boolean(label: 'Enabled', initialValue: true);
14+
15+
return SingleChildScrollView(
16+
child: Column(
17+
children: OptimusSplitButtonVariant.values
18+
.map(
19+
(v) => Padding(
20+
padding: const EdgeInsets.symmetric(vertical: 8),
21+
child: OptimusSplitButton<int>(
22+
size: k.list(
23+
label: 'Size',
24+
initialOption: OptimusWidgetSize.large,
25+
options: OptimusWidgetSize.values,
26+
),
27+
items: Iterable<int>.generate(10)
28+
.map(
29+
(i) => ListDropdownTile<int>(
30+
value: i,
31+
title: Text('Dropdown tile #$i'),
32+
subtitle: Text('Subtitle #$i'),
33+
),
34+
)
35+
.toList(),
36+
onPressed: isEnabled ? () {} : null,
37+
onItemSelected: isEnabled ? (_) => () {} : null,
38+
variant: v,
39+
child: Text(
40+
k.string(label: 'Label', initialValue: 'Split button'),
41+
),
42+
),
43+
),
44+
)
45+
.toList(),
46+
),
47+
);
48+
}

‎optimus_widgetbook/lib/components/buttons/toggle.dart

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
import 'package:flutter/widgets.dart';
2+
import 'package:optimus/optimus.dart';
3+
import 'package:widgetbook/widgetbook.dart';
4+
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
5+
6+
@widgetbook.UseCase(
7+
name: 'Toggle',
8+
type: OptimusToggleButton,
9+
path: '[Buttons]/Toggle',
10+
)
11+
Widget createDefaultStyle(BuildContext context) {
12+
final k = context.knobs;
13+
final isEnabled = k.boolean(label: 'Enabled', initialValue: true);
14+
final size = k.list(
15+
label: 'Size',
16+
labelBuilder: (option) => option.name,
17+
initialOption: OptimusToggleButtonSizeVariant.large,
18+
options: OptimusToggleButtonSizeVariant.values,
19+
);
20+
final hasLabel = k.boolean(label: 'Label', initialValue: true);
21+
22+
return Center(
23+
child: _ToggleExample(hasLabel: hasLabel, isEnabled: isEnabled, size: size),
24+
);
25+
}
26+
27+
class _ToggleExample extends StatefulWidget {
28+
const _ToggleExample({
29+
required this.hasLabel,
30+
required this.isEnabled,
31+
required this.size,
32+
});
33+
34+
final bool hasLabel;
35+
final bool isEnabled;
36+
final OptimusToggleButtonSizeVariant size;
37+
38+
@override
39+
State<_ToggleExample> createState() => _ToggleExampleState();
40+
}
41+
42+
class _ToggleExampleState extends State<_ToggleExample> {
43+
bool _isToggled = false;
44+
bool _isLoading = false;
45+
String _label = 'Claim';
46+
47+
@override
48+
Widget build(BuildContext context) => OptimusToggleButton(
49+
label: widget.hasLabel ? Text(_label) : null,
50+
isToggled: _isToggled,
51+
isLoading: _isLoading,
52+
onPressed: widget.isEnabled
53+
? () {
54+
setState(() {
55+
_isLoading = true;
56+
});
57+
Future.delayed(
58+
const Duration(seconds: 2),
59+
() => setState(() {
60+
_isToggled = !_isToggled;
61+
_label = _isToggled ? 'Claimed' : 'Claim';
62+
_isLoading = false;
63+
}),
64+
);
65+
}
66+
: null,
67+
size: widget.size,
68+
);
69+
}

‎optimus_widgetbook/lib/components/chat/bubble.dart

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import 'package:flutter/widgets.dart';
2+
import 'package:optimus/optimus.dart';
3+
import 'package:optimus_widgetbook/components/chat/common.dart';
4+
import 'package:widgetbook/widgetbook.dart';
5+
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
6+
7+
@widgetbook.UseCase(
8+
name: '',
9+
type: OptimusChatBubble,
10+
path: '[Forms]/Chat',
11+
)
12+
Widget createDefaultStyle(BuildContext context) {
13+
final k = context.knobs;
14+
final message = OptimusMessage(
15+
author: OptimusMessageAuthor(
16+
id: 'id',
17+
username: k.string(label: 'User name', initialValue: 'Doggo'),
18+
avatar: avatar2,
19+
),
20+
message: k.string(
21+
label: 'Message',
22+
initialValue:
23+
'Prow scuttle parrel provost Sail ho shrouds spirits boom mizzenmast yardarm.',
24+
),
25+
time: DateTime.now().subtract(const Duration(seconds: 30)),
26+
alignment: k.list(
27+
label: 'Alignment',
28+
initialOption: MessageAlignment.left,
29+
options: MessageAlignment.values,
30+
),
31+
state: MessageState.sent,
32+
color: k.list(
33+
label: 'Color',
34+
initialOption: MessageColor.dark,
35+
options: MessageColor.values,
36+
),
37+
);
38+
39+
return OptimusChatBubble(
40+
message: message,
41+
isUserNameVisible: k.boolean(label: 'Show user name', initialValue: true),
42+
isDateVisible: k.boolean(label: 'Show date', initialValue: true),
43+
formatTime: (DateTime input) =>
44+
'${input.hour}:${input.minute.toString().padLeft(2, '0')}',
45+
formatDate: (DateTime input) =>
46+
'${input.day}. ${input.month}. ${input.year}',
47+
sending: const Text('Sending...'),
48+
sent: const Text('Sent'),
49+
error: const Text('Error, try sending again'),
50+
);
51+
}

0 commit comments

Comments
 (0)