Simplify theming for TextEditor widget

style/src/lib.rs

@@ -20,7 +20,6 @@ pub mod application;
 pub mod menu;
 pub mod pane_grid;
 pub mod pick_list;
-pub mod text_editor;
 pub mod theme;
 
 pub use theme::Theme;

style/src/text_editor.rs

@@ -1,43 +0,0 @@
-//! Change the appearance of a text editor.
-use crate::core::{Background, Border, Color};
-
-/// The appearance of a text input.
-#[derive(Debug, Clone, Copy)]
-pub struct Appearance {
-    /// The [`Background`] of the text editor.
-    pub background: Background,
-    /// The [`Border`] of the text editor.
-    pub border: Border,
-}
-
-/// A set of rules that dictate the style of a text input.
-pub trait StyleSheet {
-    /// The supported style of the [`StyleSheet`].
-    type Style: Default;
-
-    /// Produces the style of an active text input.
-    fn active(&self, style: &Self::Style) -> Appearance;
-
-    /// Produces the style of a focused text input.
-    fn focused(&self, style: &Self::Style) -> Appearance;
-
-    /// Produces the [`Color`] of the placeholder of a text input.
-    fn placeholder_color(&self, style: &Self::Style) -> Color;
-
-    /// Produces the [`Color`] of the value of a text input.
-    fn value_color(&self, style: &Self::Style) -> Color;
-
-    /// Produces the [`Color`] of the value of a disabled text input.
-    fn disabled_color(&self, style: &Self::Style) -> Color;
-
-    /// Produces the [`Color`] of the selection of a text input.
-    fn selection_color(&self, style: &Self::Style) -> Color;
-
-    /// Produces the style of an hovered text input.
-    fn hovered(&self, style: &Self::Style) -> Appearance {
-        self.focused(style)
-    }
-
-    /// Produces the style of a disabled text input.
-    fn disabled(&self, style: &Self::Style) -> Appearance;
-}

style/src/theme.rs

@@ -8,7 +8,6 @@ use crate::core::widget::text;
 use crate::menu;
 use crate::pane_grid;
 use crate::pick_list;
-use crate::text_editor;
 
 use crate::core::{Background, Border, Color};
 
@@ -440,123 +439,3 @@ impl pane_grid::StyleSheet for Theme {
 }
 
 impl text::StyleSheet for Theme {}
-
-/// The style of a text input.
-#[derive(Default)]
-pub enum TextEditor {
-    /// The default style.
-    #[default]
-    Default,
-    /// A custom style.
-    Custom(Box<dyn text_editor::StyleSheet<Style = Theme>>),
-}
-
-impl text_editor::StyleSheet for Theme {
-    type Style = TextEditor;
-
-    fn active(&self, style: &Self::Style) -> text_editor::Appearance {
-        if let TextEditor::Custom(custom) = style {
-            return custom.active(self);
-        }
-
-        let palette = self.extended_palette();
-
-        text_editor::Appearance {
-            background: palette.background.base.color.into(),
-            border: Border {
-                radius: 2.0.into(),
-                width: 1.0,
-                color: palette.background.strong.color,
-            },
-        }
-    }
-
-    fn hovered(&self, style: &Self::Style) -> text_editor::Appearance {
-        if let TextEditor::Custom(custom) = style {
-            return custom.hovered(self);
-        }
-
-        let palette = self.extended_palette();
-
-        text_editor::Appearance {
-            background: palette.background.base.color.into(),
-            border: Border {
-                radius: 2.0.into(),
-                width: 1.0,
-                color: palette.background.base.text,
-            },
-        }
-    }
-
-    fn focused(&self, style: &Self::Style) -> text_editor::Appearance {
-        if let TextEditor::Custom(custom) = style {
-            return custom.focused(self);
-        }
-
-        let palette = self.extended_palette();
-
-        text_editor::Appearance {
-            background: palette.background.base.color.into(),
-            border: Border {
-                radius: 2.0.into(),
-                width: 1.0,
-                color: palette.primary.strong.color,
-            },
-        }
-    }
-
-    fn placeholder_color(&self, style: &Self::Style) -> Color {
-        if let TextEditor::Custom(custom) = style {
-            return custom.placeholder_color(self);
-        }
-
-        let palette = self.extended_palette();
-
-        palette.background.strong.color
-    }
-
-    fn value_color(&self, style: &Self::Style) -> Color {
-        if let TextEditor::Custom(custom) = style {
-            return custom.value_color(self);
-        }
-
-        let palette = self.extended_palette();
-
-        palette.background.base.text
-    }
-
-    fn selection_color(&self, style: &Self::Style) -> Color {
-        if let TextEditor::Custom(custom) = style {
-            return custom.selection_color(self);
-        }
-
-        let palette = self.extended_palette();
-
-        palette.primary.weak.color
-    }
-
-    fn disabled(&self, style: &Self::Style) -> text_editor::Appearance {
-        if let TextEditor::Custom(custom) = style {
-            return custom.disabled(self);
-        }
-
-        let palette = self.extended_palette();
-
-        text_editor::Appearance {
-            background: palette.background.weak.color.into(),
-            border: Border {
-                radius: 2.0.into(),
-                width: 1.0,
-                color: palette.background.strong.color,
-            },
-        }
-    }
-
-    fn disabled_color(&self, style: &Self::Style) -> Color {
-        if let TextEditor::Custom(custom) = style {
-            return custom.disabled_color(self);
-        }
-
-        self.placeholder_color(style)
-    }
-}

widget/src/helpers.rs

@@ -224,7 +224,7 @@ pub fn text_editor<Message, Theme, Renderer>(
 ) -> TextEditor<'_, core::text::highlighter::PlainText, Message, Theme, Renderer>
 where
     Message: Clone,
-    Theme: text_editor::StyleSheet,
+    Theme: text_editor::Style,
     Renderer: core::text::Renderer,
 {
     TextEditor::new(content)

widget/src/text_editor.rs

@@ -11,15 +11,16 @@ use crate::core::text::highlighter::{self, Highlighter};
 use crate::core::text::{self, LineHeight};
 use crate::core::widget::{self, Widget};
 use crate::core::{
-    Element, Length, Padding, Pixels, Rectangle, Shell, Size, Vector,
+    Background, Border, Color, Element, Length, Padding, Pixels, Rectangle,
+    Shell, Size, Vector,
 };
+use crate::style::Theme;
 
 use std::cell::RefCell;
 use std::fmt;
 use std::ops::DerefMut;
 use std::sync::Arc;
 
-pub use crate::style::text_editor::{Appearance, StyleSheet};
 pub use text::editor::{Action, Edit, Motion};
 
 /// A multi-line text input.
@@ -32,7 +33,6 @@ pub struct TextEditor<
     Renderer = crate::Renderer,
 > where
     Highlighter: text::Highlighter,
-    Theme: StyleSheet,
     Renderer: text::Renderer,
 {
     content: &'a Content<Renderer>,
@@ -42,7 +42,7 @@ pub struct TextEditor<
     width: Length,
     height: Length,
     padding: Padding,
-    style: Theme::Style,
+    style: fn(&Theme, Status) -> Appearance,
     on_edit: Option<Box<dyn Fn(Action) -> Message + 'a>>,
     highlighter_settings: Highlighter::Settings,
     highlighter_format: fn(
@@ -54,11 +54,13 @@ pub struct TextEditor<
 impl<'a, Message, Theme, Renderer>
     TextEditor<'a, highlighter::PlainText, Message, Theme, Renderer>
 where
-    Theme: StyleSheet,
     Renderer: text::Renderer,
 {
     /// Creates new [`TextEditor`] with the given [`Content`].
-    pub fn new(content: &'a Content<Renderer>) -> Self {
+    pub fn new(content: &'a Content<Renderer>) -> Self
+    where
+        Theme: Style,
+    {
         Self {
             content,
             font: None,
@@ -67,7 +69,7 @@ where
             width: Length::Fill,
             height: Length::Shrink,
             padding: Padding::new(5.0),
-            style: Default::default(),
+            style: Theme::style(),
             on_edit: None,
             highlighter_settings: (),
             highlighter_format: |_highlight, _theme| {
@@ -81,7 +83,6 @@ impl<'a, Highlighter, Message, Theme, Renderer>
     TextEditor<'a, Highlighter, Message, Theme, Renderer>
 where
     Highlighter: text::Highlighter,
-    Theme: StyleSheet,
     Renderer: text::Renderer,
 {
     /// Sets the height of the [`TextEditor`].
@@ -142,8 +143,8 @@ where
     }
 
     /// Sets the style of the [`TextEditor`].
-    pub fn style(mut self, style: impl Into<Theme::Style>) -> Self {
+    pub fn style(mut self, style: fn(&Theme, Status) -> Appearance) -> Self {
-        self.style = style.into();
+        self.style = style;
         self
     }
 }
@@ -306,7 +307,6 @@ impl<'a, Highlighter, Message, Theme, Renderer> Widget<Message, Theme, Renderer>
     for TextEditor<'a, Highlighter, Message, Theme, Renderer>
 where
     Highlighter: text::Highlighter,
-    Theme: StyleSheet,
     Renderer: text::Renderer,
 {
     fn tag(&self) -> widget::tree::Tag {
@@ -496,16 +496,18 @@ where
         let is_disabled = self.on_edit.is_none();
         let is_mouse_over = cursor.is_over(bounds);
 
-        let appearance = if is_disabled {
+        let status = if is_disabled {
-            theme.disabled(&self.style)
+            Status::Disabled
         } else if state.is_focused {
-            theme.focused(&self.style)
+            Status::Focused
         } else if is_mouse_over {
-            theme.hovered(&self.style)
+            Status::Hovered
         } else {
-            theme.active(&self.style)
+            Status::Active
         };
 
+        let appearance = (self.style)(theme, status);
+
         renderer.fill_quad(
             renderer::Quad {
                 bounds,
@@ -551,7 +553,7 @@ where
                                 },
                                 ..renderer::Quad::default()
                             },
-                            theme.value_color(&self.style),
+                            appearance.value,
                         );
                     }
                 }
@@ -564,7 +566,7 @@ where
                                 bounds: range,
                                 ..renderer::Quad::default()
                             },
-                            theme.selection_color(&self.style),
+                            appearance.selection,
                         );
                     }
                 }
@@ -600,7 +602,7 @@ impl<'a, Highlighter, Message, Theme, Renderer>
 where
     Highlighter: text::Highlighter,
     Message: 'a,
-    Theme: StyleSheet + 'a,
+    Theme: 'a,
     Renderer: text::Renderer,
 {
     fn from(
@@ -776,3 +778,86 @@ mod platform {
         }
     }
 }
+
+/// The possible status of a [`TextInput`].
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum Status {
+    /// The [`TextInput`] can be interacted with.
+    Active,
+    /// The [`TextInput`] is being hovered.
+    Hovered,
+    /// The [`TextInput`] is focused.
+    Focused,
+    /// The [`TextInput`] cannot be interacted with.
+    Disabled,
+}
+
+/// The appearance of a text input.
+#[derive(Debug, Clone, Copy)]
+pub struct Appearance {
+    /// The [`Background`] of the text input.
+    pub background: Background,
+    /// The [`Border`] of the text input.
+    pub border: Border,
+    /// The [`Color`] of the icon of the text input.
+    pub icon: Color,
+    /// The [`Color`] of the placeholder of the text input.
+    pub placeholder: Color,
+    /// The [`Color`] of the value of the text input.
+    pub value: Color,
+    /// The [`Color`] of the selection of the text input.
+    pub selection: Color,
+}
+
+/// The definiton of the default style of a [`TextInput`].
+pub trait Style {
+    /// Returns the default style of a [`TextInput`].
+    fn style() -> fn(&Self, Status) -> Appearance;
+}
+
+impl Style for Theme {
+    fn style() -> fn(&Self, Status) -> Appearance {
+        default
+    }
+}
+
+/// The default style of a [`TextInput`].
+pub fn default(theme: &Theme, status: Status) -> Appearance {
+    let palette = theme.extended_palette();
+
+    let active = Appearance {
+        background: Background::Color(palette.background.base.color),
+        border: Border {
+            radius: 2.0.into(),
+            width: 1.0,
+            color: palette.background.strong.color,
+        },
+        icon: palette.background.weak.text,
+        placeholder: palette.background.strong.color,
+        value: palette.background.base.text,
+        selection: palette.primary.weak.color,
+    };
+
+    match status {
+        Status::Active => active,
+        Status::Hovered => Appearance {
+            border: Border {
+                color: palette.background.base.text,
+                ..active.border
+            },
+            ..active
+        },
+        Status::Focused => Appearance {
+            border: Border {
+                color: palette.primary.strong.color,
+                ..active.border
+            },
+            ..active
+        },
+        Status::Disabled => Appearance {
+            background: Background::Color(palette.background.weak.color),
+            value: active.placeholder,
+            ..active
+        },
+    }
+}