Line data Source code
1 : import 'package:flutter/cupertino.dart';
2 : import 'package:flutter/material.dart';
3 :
4 : import 'package:widgetbook/src/configure_non_web.dart'
5 : if (dart.library.html) 'package:widgetbook/src/configure_web.dart';
6 : import 'package:widgetbook/src/models/app_info.dart';
7 : import 'package:widgetbook/src/models/organizers/organizer_helper/organizer_helper.dart';
8 : import 'package:widgetbook/src/models/organizers/organizers.dart';
9 : import 'package:widgetbook/src/providers/canvas_provider.dart';
10 : import 'package:widgetbook/src/providers/device_provider.dart';
11 : import 'package:widgetbook/src/providers/injected_theme_provider.dart';
12 : import 'package:widgetbook/src/providers/organizer_provider.dart';
13 : import 'package:widgetbook/src/providers/organizer_state.dart';
14 : import 'package:widgetbook/src/providers/theme_provider.dart';
15 : import 'package:widgetbook/src/providers/zoom_provider.dart';
16 : import 'package:widgetbook/src/repositories/selected_story_repository.dart';
17 : import 'package:widgetbook/src/repositories/story_repository.dart';
18 : import 'package:widgetbook/src/routing/route_information_parser.dart';
19 : import 'package:widgetbook/src/routing/story_router_delegate.dart';
20 : import 'package:widgetbook/src/services/filter_service.dart';
21 : import 'package:widgetbook/src/utils/utils.dart';
22 : import 'package:widgetbook_models/widgetbook_models.dart';
23 :
24 : class Widgetbook extends StatefulWidget {
25 0 : const Widgetbook({
26 : Key? key,
27 : required this.categories,
28 : this.devices = const [
29 : Apple.iPhone11,
30 : Apple.iPhone12,
31 : Apple.iPhone12Mini,
32 : Apple.iPhone12Pro,
33 : Samsung.s10,
34 : Samsung.s21ultra,
35 : ],
36 : required this.appInfo,
37 : this.lightTheme,
38 : this.darkTheme,
39 0 : }) : super(key: key);
40 :
41 : /// Categories which host Folders and WidgetElements.
42 : /// This can be used to organize the structure of the Widgetbook on a large
43 : /// scale.
44 : final List<Category> categories;
45 :
46 : /// The devices on which Stories are previewed.
47 : final List<Device> devices;
48 :
49 : /// Information about the app that is catalogued in the Widgetbook.
50 : final AppInfo appInfo;
51 :
52 : /// The `ThemeData` that is shown when the light theme is active.
53 : final ThemeData? lightTheme;
54 :
55 : /// The `ThemeData` that is shown when the dark theme is active.
56 : final ThemeData? darkTheme;
57 :
58 0 : @override
59 0 : _WidgetbookState createState() => _WidgetbookState();
60 : }
61 :
62 : class _WidgetbookState extends State<Widgetbook> {
63 : // TODO ugly hack
64 : late BuildContext contextWithProviders;
65 :
66 : SelectedStoryRepository selectedStoryRepository = SelectedStoryRepository();
67 : StoryRepository storyRepository = StoryRepository();
68 :
69 0 : @override
70 : void initState() {
71 0 : configureApp();
72 :
73 0 : super.initState();
74 : }
75 :
76 0 : @override
77 : void didUpdateWidget(covariant Widgetbook oldWidget) {
78 : // TODO remove this and put into the Builders
79 0 : OrganizerProvider.of(contextWithProviders)!.update(widget.categories);
80 0 : DeviceProvider.of(contextWithProviders)!.update(widget.devices);
81 0 : InjectedThemeProvider.of(contextWithProviders)!.themesChanged(
82 0 : lightTheme: widget.lightTheme,
83 0 : darkTheme: widget.darkTheme,
84 : );
85 :
86 0 : super.didUpdateWidget(oldWidget);
87 : }
88 :
89 0 : @override
90 : Widget build(BuildContext context) {
91 0 : return OrganizerBuilder(
92 0 : initialState: OrganizerState.unfiltered(
93 0 : categories: widget.categories,
94 : ),
95 0 : storyRepository: storyRepository,
96 0 : selectedStoryRepository: selectedStoryRepository,
97 : filterService: const FilterService(),
98 0 : child: CanvasBuilder(
99 0 : selectedStoryRepository: selectedStoryRepository,
100 0 : storyRepository: storyRepository,
101 0 : child: ZoomBuilder(
102 0 : child: ThemeBuilder(
103 0 : child: DeviceBuilder(
104 0 : availableDevices: widget.devices,
105 0 : currentDevice: widget.devices.first,
106 0 : child: InjectedThemeBuilder(
107 0 : lightTheme: widget.lightTheme,
108 0 : darkTheme: widget.darkTheme,
109 0 : child: Builder(builder: (context) {
110 0 : contextWithProviders = context;
111 0 : final canvasState = CanvasProvider.of(context)!.state;
112 0 : final storiesState = OrganizerProvider.of(context)!.state;
113 0 : final themeMode = ThemeProvider.of(context)!.state;
114 :
115 0 : return MaterialApp.router(
116 0 : routeInformationParser: StoryRouteInformationParser(
117 0 : onRoute: (path) {
118 0 : final stories = StoryHelper.getAllStoriesFromCategories(
119 0 : storiesState.allCategories,
120 : );
121 : final selectedStory =
122 0 : selectStoryFromPath(path, stories);
123 0 : CanvasProvider.of(context)!.selectStory(selectedStory);
124 : },
125 : ),
126 0 : routerDelegate: StoryRouterDelegate(
127 : canvasState: canvasState,
128 0 : appInfo: widget.appInfo,
129 : ),
130 0 : title: widget.appInfo.name,
131 : debugShowCheckedModeBanner: false,
132 : themeMode: themeMode,
133 0 : darkTheme: Styles.darkTheme,
134 0 : theme: Styles.lightTheme,
135 : );
136 : }),
137 : ),
138 : ),
139 : ),
140 : ),
141 : ),
142 : );
143 : }
144 :
145 0 : Story? selectStoryFromPath(
146 : String? path,
147 : List<Story> stories,
148 : ) {
149 0 : final storyPath = path?.replaceFirst('/stories/', '') ?? '';
150 : Story? story;
151 0 : for (final element in stories) {
152 0 : if (element.path == storyPath) {
153 : story = element;
154 : }
155 : }
156 : return story;
157 : }
158 : }
|