fix: Making cupertino work for Flutter Web. #1

Author: LuchoTurtle

Diff for: lib/cupertino.dart

@@ -1,7 +1,17 @@
 import 'package:flutter/cupertino.dart';
+import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:intl/intl.dart';
 
+class WebScrollBehaviour extends MaterialScrollBehavior {
+  // Override behaviour methods and getters like dragDevices
+  @override
+  Set<PointerDeviceKind> get dragDevices => {
+        PointerDeviceKind.touch,
+        PointerDeviceKind.mouse,
+      };
+}
+
 /// Cupertino example page.
 /// Showcases the usage of `DatePicker` and `TimePicker` to change date and time.
 class CupertinoExamplePage extends StatefulWidget {
@@ -19,20 +29,23 @@ class _CupertinoExamplePageState extends State<CupertinoExamplePage> {
   void _showDialog(Widget child) {
     showCupertinoModalPopup<void>(
       context: context,
-      builder: (BuildContext context) => Container(
-        height: 216,
-        padding: const EdgeInsets.only(top: 6.0),
-        // The Bottom margin is provided to align the popup above the system
-        // navigation bar.
-        margin: EdgeInsets.only(
-          bottom: MediaQuery.of(context).viewInsets.bottom,
-        ),
-        // Provide a background color for the popup.
-        color: CupertinoColors.systemBackground.resolveFrom(context),
-        // Use a SafeArea widget to avoid system overlaps.
-        child: SafeArea(
-          top: false,
-          child: child,
+      builder: (BuildContext context) => ScrollConfiguration(
+        behavior: WebScrollBehaviour(),
+        child: Container(
+          height: 216,
+          padding: const EdgeInsets.only(top: 6.0),
+          // The Bottom margin is provided to align the popup above the system
+          // navigation bar.
+          margin: EdgeInsets.only(
+            bottom: MediaQuery.of(context).viewInsets.bottom,
+          ),
+          // Provide a background color for the popup.
+          color: CupertinoColors.systemBackground.resolveFrom(context),
+          // Use a SafeArea widget to avoid system overlaps.
+          child: SafeArea(
+            top: false,
+            child: child,
+          ),
         ),
       ),
     );
@@ -67,18 +80,18 @@ class _CupertinoExamplePageState extends State<CupertinoExamplePage> {
                   ElevatedButton(
                       style: ElevatedButton.styleFrom(backgroundColor: Colors.purple.shade300),
                       onPressed: () => _showDialog(
-                      CupertinoDatePicker(
-                        initialDateTime: dateTime,
-                        mode: CupertinoDatePickerMode.date,
-                        use24hFormat: true,
-                        // This shows day of week alongside day of month
-                        showDayOfWeek: true,
-                        // This is called when the user changes the date.
-                        onDateTimeChanged: (DateTime newDate) {
-                          setState(() => dateTime = newDate);
-                        },
-                      ),
-                    ),
+                            CupertinoDatePicker(
+                              initialDateTime: dateTime,
+                              mode: CupertinoDatePickerMode.date,
+                              use24hFormat: true,
+                              // This shows day of week alongside day of month
+                              showDayOfWeek: true,
+                              // This is called when the user changes the date.
+                              onDateTimeChanged: (DateTime newDate) {
+                                setState(() => dateTime = newDate);
+                              },
+                            ),
+                          ),
                       child: const Text(
                         "Date",
                         style: TextStyle(fontSize: 20),
@@ -90,15 +103,15 @@ class _CupertinoExamplePageState extends State<CupertinoExamplePage> {
                         style: TextStyle(fontSize: 20),
                       ),
                       onPressed: () => _showDialog(
-                      CupertinoDatePicker(
-                        initialDateTime: dateTime,
-                        mode: CupertinoDatePickerMode.time,
-                        use24hFormat: true,
-                        onDateTimeChanged: (DateTime newDate) {
-                          setState(() => dateTime = newDate);
-                        },
-                      ),
-                    ))
+                            CupertinoDatePicker(
+                              initialDateTime: dateTime,
+                              mode: CupertinoDatePickerMode.time,
+                              use24hFormat: true,
+                              onDateTimeChanged: (DateTime newDate) {
+                                setState(() => dateTime = newDate);
+                              },
+                            ),
+                          ))
                 ],
               ),
             ),
@@ -110,15 +123,15 @@ class _CupertinoExamplePageState extends State<CupertinoExamplePage> {
                   ElevatedButton(
                       style: ElevatedButton.styleFrom(backgroundColor: Colors.green.shade400),
                       onPressed: () => _showDialog(
-                      CupertinoDatePicker(
-                        initialDateTime: dateTime,
-                        mode: CupertinoDatePickerMode.dateAndTime,
-                        use24hFormat: true,
-                        onDateTimeChanged: (DateTime newDate) {
-                          setState(() => dateTime = newDate);
-                        },
-                      ),
-                    ),
+                            CupertinoDatePicker(
+                              initialDateTime: dateTime,
+                              mode: CupertinoDatePickerMode.dateAndTime,
+                              use24hFormat: true,
+                              onDateTimeChanged: (DateTime newDate) {
+                                setState(() => dateTime = newDate);
+                              },
+                            ),
+                          ),
                       child: const Text(
                         "DateTime",
                         style: TextStyle(fontSize: 20),