Fixes to SearchBar (#2243)

* Fixes to SearchBar

* Update value as we type

Author: FeodorFitsner

package/lib/src/controls/create_control.dart

@@ -16,15 +16,11 @@ import '../utils/theme.dart';
 import '../utils/transforms.dart';
 import 'alert_dialog.dart';
 import 'animated_switcher.dart';
-import 'bottom_app_bar.dart';
 import 'audio.dart';
 import 'badge.dart';
-import 'cupertino_navigation_bar.dart';
-import 'cupertino_slider.dart';
-import 'expansion_panel.dart';
-import 'selection_area.dart';
 import 'banner.dart';
 import 'barchart.dart';
+import 'bottom_app_bar.dart';
 import 'bottom_sheet.dart';
 import 'canvas.dart';
 import 'card.dart';
@@ -34,6 +30,11 @@ import 'circle_avatar.dart';
 import 'clipboard.dart';
 import 'column.dart';
 import 'container.dart';
+import 'cupertino_checkbox.dart';
+import 'cupertino_navigation_bar.dart';
+import 'cupertino_radio.dart';
+import 'cupertino_slider.dart';
+import 'cupertino_switch.dart';
 import 'datatable.dart';
 import 'date_picker.dart';
 import 'dismissible.dart';
@@ -43,6 +44,7 @@ import 'draggable.dart';
 import 'dropdown.dart';
 import 'elevated_button.dart';
 import 'error.dart';
+import 'expansion_panel.dart';
 import 'expansion_tile.dart';
 import 'file_picker.dart';
 import 'flet_app_control.dart';
@@ -66,12 +68,12 @@ import 'popup_menu_button.dart';
 import 'progress_bar.dart';
 import 'progress_ring.dart';
 import 'radio.dart';
-import 'cupertino_radio.dart';
 import 'radio_group.dart';
 import 'range_slider.dart';
 import 'responsive_row.dart';
 import 'row.dart';
 import 'safe_area.dart';
+import 'selection_area.dart';
 import 'semantics.dart';
 import 'shader_mask.dart';
 import 'shake_detector.dart';
@@ -89,8 +91,6 @@ import 'transparent_pointer.dart';
 import 'vertical_divider.dart';
 import 'webview.dart';
 import 'window_drag_area.dart';
-import 'cupertino_checkbox.dart';
-import 'cupertino_switch.dart';
 
 Widget createControl(Control? parent, String id, bool parentDisabled,
     {Widget? nextChild}) {

package/lib/src/controls/search_anchor.dart

@@ -35,7 +35,6 @@ class SearchAnchorControl extends StatefulWidget {
 
 class _SearchAnchorControlState extends State<SearchAnchorControl> {
   late final SearchController _controller;
-  String _value = "";
 
   @override
   void initState() {
@@ -53,8 +52,13 @@ class _SearchAnchorControlState extends State<SearchAnchorControl> {
 
   void _searchTextChanged() {
     debugPrint("_searchTextChanged: ${_controller.text}");
+    _updateValue(_controller.text);
+  }
+
+  void _updateValue(String value) {
+    debugPrint("SearchBar.changeValue: $value");
     List<Map<String, String>> props = [
-      {"i": widget.control.id, "value": _controller.text}
+      {"i": widget.control.id, "value": value}
     ];
     widget.dispatch(
         UpdateControlPropsAction(UpdateControlPropsPayload(props: props)));
@@ -75,8 +79,10 @@ class _SearchAnchorControlState extends State<SearchAnchorControl> {
           debugPrint("SearchAnchor StoreConnector build: ${widget.control.id}");
 
           var value = widget.control.attrString("value");
-          if (value != null) {
-            _controller.text = value;
+          if (value != null && value != _controller.text) {
+            WidgetsBinding.instance.addPostFrameCallback((_) {
+              _controller.text = value;
+            });
           }
 
           bool onChange = widget.control.attrBool("onChange", false)!;
@@ -109,39 +115,35 @@ class _SearchAnchorControlState extends State<SearchAnchorControl> {
           if (method != null) {
             debugPrint("SearchAnchor JSON method: $method");
 
+            void resetMethod() {
+              List<Map<String, String>> props = [
+                {"i": widget.control.id, "method": ""}
+              ];
+              widget.dispatch(UpdateControlPropsAction(
+                  UpdateControlPropsPayload(props: props)));
+              FletAppServices.of(context)
+                  .server
+                  .updateControlProps(props: props);
+            }
+
             var mj = json.decode(method);
             var name = mj["n"] as String;
             var params = Map<String, dynamic>.from(mj["p"] as Map);
 
             if (name == "closeView") {
               WidgetsBinding.instance.addPostFrameCallback((_) {
-                List<Map<String, String>> props = [
-                  {"i": widget.control.id, "method": ""}
-                ];
-                widget.dispatch(UpdateControlPropsAction(
-                    UpdateControlPropsPayload(props: props)));
-                FletAppServices.of(context)
-                    .server
-                    .updateControlProps(props: props);
+                resetMethod();
                 if (_controller.isOpen) {
                   var text = params["text"].toString();
-                  setState(() {
-                    _controller.closeView(text);
-                  });
+                  _updateValue(text);
+                  _controller.closeView(text);
                 }
               });
             } else if (name == "openView") {
               WidgetsBinding.instance.addPostFrameCallback((_) {
-                List<Map<String, String>> props = [
-                  {"i": widget.control.id, "method": ""}
-                ];
-                widget.dispatch(UpdateControlPropsAction(
-                    UpdateControlPropsPayload(props: props)));
-                FletAppServices.of(context)
-                    .server
-                    .updateControlProps(props: props);
+                resetMethod();
                 if (!_controller.isOpen) {
-                    _controller.openView();
+                  _controller.openView();
                 }
               });
             }
@@ -197,6 +199,8 @@ class _SearchAnchorControlState extends State<SearchAnchorControl> {
                   },
                   onSubmitted: onSubmit
                       ? (String value) {
+                          debugPrint("SearchBar.onSubmit: $value");
+                          _updateValue(value);
                           FletAppServices.of(context).server.sendPageEvent(
                               eventTarget: widget.control.id,
                               eventName: "submit",
@@ -205,6 +209,8 @@ class _SearchAnchorControlState extends State<SearchAnchorControl> {
                       : null,
                   onChanged: onChange
                       ? (String value) {
+                          debugPrint("SearchBar.onChange: $value");
+                          _updateValue(value);
                           FletAppServices.of(context).server.sendPageEvent(
                               eventTarget: widget.control.id,
                               eventName: "change",

sdk/python/packages/flet-core/src/flet_core/__init__.py

@@ -19,6 +19,7 @@
 from flet_core.animation import Animation, AnimationCurve
 from flet_core.app_bar import AppBar
 from flet_core.audio import Audio
+from flet_core.badge import Badge
 from flet_core.banner import Banner
 from flet_core.blur import Blur, BlurTileMode
 from flet_core.border import Border, BorderSide
@@ -35,7 +36,6 @@
     StadiumBorder,
 )
 from flet_core.card import Card
-from flet_core.chip import Chip
 from flet_core.charts.bar_chart import BarChart, BarChartEvent
 from flet_core.charts.bar_chart_group import BarChartGroup
 from flet_core.charts.bar_chart_rod import BarChartRod
@@ -56,19 +56,25 @@
 from flet_core.charts.pie_chart import PieChart, PieChartEvent
 from flet_core.charts.pie_chart_section import PieChartSection
 from flet_core.checkbox import Checkbox
+from flet_core.chip import Chip
 from flet_core.circle_avatar import CircleAvatar
 from flet_core.column import Column
 from flet_core.container import Container, ContainerTapEvent
 from flet_core.control import Control, OptionalNumber
 from flet_core.control_event import ControlEvent
+from flet_core.cupertino_checkbox import CupertinoCheckbox
+from flet_core.cupertino_navigation_bar import CupertinoNavigationBar
+from flet_core.cupertino_radio import CupertinoRadio
+from flet_core.cupertino_slider import CupertinoSlider
+from flet_core.cupertino_switch import CupertinoSwitch
 from flet_core.datatable import (
     DataCell,
     DataColumn,
     DataColumnSortEvent,
     DataRow,
     DataTable,
 )
-from flet_core.date_picker import DatePicker, DatePickerMode, DatePickerEntryMode
+from flet_core.date_picker import DatePicker, DatePickerEntryMode, DatePickerMode
 from flet_core.dismissible import Dismissible
 from flet_core.divider import Divider
 from flet_core.drag_target import DragTarget, DragTargetAcceptEvent
@@ -128,7 +134,7 @@
     NavigationBarLabelBehavior,
     NavigationDestination,
 )
-from flet_core.cupertino_navigation_bar import CupertinoNavigationBar
+from flet_core.navigation_drawer import NavigationDrawer, NavigationDrawerDestination
 from flet_core.navigation_rail import (
     NavigationRail,
     NavigationRailDestination,
@@ -158,13 +164,15 @@
 from flet_core.querystring import QueryString
 from flet_core.radio import Radio
 from flet_core.radio_group import RadioGroup
+from flet_core.range_slider import RangeSlider
 from flet_core.ref import Ref
 from flet_core.responsive_row import ResponsiveRow
 from flet_core.row import Row
 from flet_core.safe_area import SafeArea
 from flet_core.scrollable_control import OnScrollEvent
-from flet_core.search_anchor import SearchBar
+from flet_core.search_bar import SearchBar
 from flet_core.segmented_button import Segment, SegmentedButton
+from flet_core.selection_area import SelectionArea
 from flet_core.semantics import Semantics
 from flet_core.shader_mask import ShaderMask
 from flet_core.shadow import BoxShadow, ShadowBlurStyle
@@ -180,14 +188,13 @@
 from flet_core.text_span import TextSpan
 from flet_core.text_style import TextDecoration, TextDecorationStyle, TextStyle
 from flet_core.textfield import (
-    KeyboardType,
     InputFilter,
+    KeyboardType,
     NumbersOnlyInputFilter,
     TextCapitalization,
     TextField,
     TextOnlyInputFilter,
 )
-from flet_core.time_picker import TimePicker, TimePickerEntryMode
 from flet_core.theme import (
     ColorScheme,
     PageTransitionsTheme,
@@ -198,6 +205,7 @@
     Theme,
     ThemeVisualDensity,
 )
+from flet_core.time_picker import TimePicker, TimePickerEntryMode
 from flet_core.tooltip import Tooltip
 from flet_core.transform import Offset, Rotate, Scale
 from flet_core.transparent_pointer import TransparentPointer
@@ -223,13 +231,5 @@
 from flet_core.user_control import UserControl
 from flet_core.vertical_divider import VerticalDivider
 from flet_core.view import View
-from flet_core.window_drag_area import WindowDragArea
 from flet_core.webview import WebView
-from flet_core.range_slider import RangeSlider
-from flet_core.badge import Badge
-from flet_core.navigation_drawer import NavigationDrawer, NavigationDrawerDestination
-from flet_core.selection_area import SelectionArea
-from flet_core.cupertino_radio import CupertinoRadio
-from flet_core.cupertino_checkbox import CupertinoCheckbox
-from flet_core.cupertino_slider import CupertinoSlider
-from flet_core.cupertino_switch import CupertinoSwitch
+from flet_core.window_drag_area import WindowDragArea

sdk/python/packages/flet-core/src/flet_core/cupertino_navigation_bar.py

@@ -1,8 +1,9 @@
 from typing import Any, List, Optional, Union
 
-from flet_core import NavigationDestination, Border
+from flet_core.border import Border
 from flet_core.constrained_control import ConstrainedControl
 from flet_core.control import OptionalNumber
+from flet_core.navigation_bar import NavigationDestination
 from flet_core.ref import Ref
 from flet_core.types import (
     AnimationValue,

sdk/python/packages/flet-core/src/flet_core/search_anchor.py renamed to sdk/python/packages/flet-core/src/flet_core/search_bar.py

@@ -1,26 +1,21 @@
 import time
-from typing import Any, Optional, Union, List, Dict
+from typing import Any, Dict, List, Optional, Union
 
 from flet_core import BorderSide, OutlinedBorder
-from flet_core.textfield import TextCapitalization
 from flet_core.constrained_control import ConstrainedControl
 from flet_core.control import Control, OptionalNumber
 from flet_core.ref import Ref
 from flet_core.text_style import TextStyle
+from flet_core.textfield import TextCapitalization
 from flet_core.types import (
     AnimationValue,
+    MaterialState,
     OffsetValue,
     ResponsiveNumber,
     RotateValue,
     ScaleValue,
-    MaterialState,
 )
 
-try:
-    from typing import Literal
-except ImportError:
-    from typing_extensions import Literal
-
 
 class SearchBar(ConstrainedControl):
     """
@@ -180,14 +175,15 @@ async def open_view_async(self):
             "p": {},
         }
         self._set_attr_json("method", m)
-        await self.update()
+        await self.update_async()
 
     def close_view(self, text: str = ""):
         m = {
             "n": "closeView",
             "i": str(time.time()),
             "p": {"text": text},
         }
+        self.value = text
         self._set_attr_json("method", m)
         self.update()
 
@@ -197,8 +193,9 @@ async def close_view_async(self, text: str = ""):
             "i": str(time.time()),
             "p": {"text": text},
         }
+        self.value = text
         self._set_attr_json("method", m)
-        await self.update()
+        await self.update_async()
 
     # bar_leading
     @property
@@ -383,10 +380,7 @@ def on_change(self):
     @on_change.setter
     def on_change(self, handler):
         self._add_event_handler("change", handler)
-        if handler is not None:
-            self._set_attr("onchange", True)
-        else:
-            self._set_attr("onchange", None)
+        self._set_attr("onchange", True if handler is not None else None)
 
     # on_tap
     @property
@@ -396,10 +390,7 @@ def on_tap(self):
     @on_tap.setter
     def on_tap(self, handler):
         self._add_event_handler("tap", handler)
-        if handler is not None:
-            self._set_attr("ontap", True)
-        else:
-            self._set_attr("ontap", None)
+        self._set_attr("ontap", True if handler is not None else None)
 
     # on_submit
     @property
@@ -409,7 +400,4 @@ def on_submit(self):
     @on_submit.setter
     def on_submit(self, handler):
         self._add_event_handler("submit", handler)
-        if handler is not None:
-            self._set_attr("onsubmit", True)
-        else:
-            self._set_attr("onsubmit", None)
+        self._set_attr("onsubmit", True if handler is not None else None)