@@ -40,7 +40,7 @@ type KeyFilter = Box<dyn Fn(&str) -> bool>;
4040/// <div>
4141/// <p>{ "Try typing anywhere on the page (without focusing on an input field)." }</p>
4242/// <input type="text" placeholder="Focus here and typing won't trigger the callback" />
43- /// <textarea placeholder="Same for textarea"></textarea >
43+ /// <textarea placeholder="Same for textarea" / >
4444/// <div contenteditable="true" style="border: 1px solid #ccc; padding: 8px; margin-top: 8px;">
4545/// { "This is a contenteditable div. Typing here won't trigger the callback either." }
4646/// </div>
5656 use_start_typing_with_options ( callback, UseStartTypingOptions :: default ( ) )
5757}
5858
59- /// A hook that triggers a callback when the user starts typing on the page
60- /// without an editable element focused, with custom event type.
61- ///
62- /// This is similar to [`use_start_typing`] but allows specifying a custom event type.
63- /// The callback only fires when:
64- /// - No editable element (`<input>`, `<textarea>`, or `contenteditable`) is focused
65- /// - The pressed key matches the provided event type pattern
66- /// - No modifier keys (Ctrl, Alt, Meta) are held
67- ///
68- /// # Example
69- ///
70- /// ```rust
71- /// # use yew::prelude::*;
72- /// # use log::debug;
73- /// #
74- /// use yew_hooks::prelude::*;
75- ///
76- /// #[function_component(UseStartTypingWithOptions)]
77- /// fn start_typing_with_options() -> Html {
78- /// use_start_typing_with_options(
79- /// move |event: KeyboardEvent| {
80- /// debug!("Started typing with key: {}", event.key());
81- /// },
82- /// UseStartTypingOptions {
83- /// event_type: "keypress".into(),
84- /// ..Default::default()
85- /// },
86- /// );
87- ///
88- /// html! {
89- /// <div>
90- /// <p>{ "Try typing anywhere on the page (without focusing on an input field)." }</p>
91- /// </div>
92- /// }
93- /// }
94- /// ```
9559pub struct UseStartTypingOptions {
9660 /// The keyboard event type to listen for. Default: "keydown"
9761 pub event_type : Cow < ' static , str > ,
@@ -154,6 +118,42 @@ impl std::fmt::Debug for UseStartTypingOptions {
154118 }
155119}
156120
121+ /// A hook that triggers a callback when the user starts typing on the page
122+ /// without an editable element focused, with custom event type.
123+ ///
124+ /// This is similar to [`use_start_typing`] but allows specifying a custom event type.
125+ /// The callback only fires when:
126+ /// - No editable element (`<input>`, `<textarea>`, or `contenteditable`) is focused
127+ /// - The pressed key matches the provided event type pattern
128+ /// - No modifier keys (Ctrl, Alt, Meta) are held
129+ ///
130+ /// # Example
131+ ///
132+ /// ```rust
133+ /// # use yew::prelude::*;
134+ /// # use log::debug;
135+ /// #
136+ /// use yew_hooks::prelude::*;
137+ ///
138+ /// #[function_component(UseStartTypingWithOptions)]
139+ /// fn start_typing_with_options() -> Html {
140+ /// use_start_typing_with_options(
141+ /// move |event: KeyboardEvent| {
142+ /// debug!("Started typing with key: {}", event.key());
143+ /// },
144+ /// UseStartTypingOptions {
145+ /// event_type: "keypress".into(),
146+ /// ..Default::default()
147+ /// },
148+ /// );
149+ ///
150+ /// html! {
151+ /// <div>
152+ /// <p>{ "Try typing anywhere on the page (without focusing on an input field)." }</p>
153+ /// </div>
154+ /// }
155+ /// }
156+ /// ```
157157#[ hook]
158158pub fn use_start_typing_with_options < F > ( callback : F , options : UseStartTypingOptions )
159159where
0 commit comments