dan/gpui-component
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

story: Fix invalid focus code cause PopupStory Input cannot input anything. (#325)

Browse source 
Closes #324

When we create a Wry WebView, it will take the focus into the WebView.
So we must care to use it, make sure no WebView create if there no need
to display.

> The `ui::WebView` has implemented when we click out of the WebView to
move focus back to the main window.
>
> But by my test, first render it not work will because the Render is
not trigger so the click out event not listened.

Currently change just removed WebViewStory from the demo.
This commit is contained in:
Jason Lee 2024-10-09 15:08:18 +08:00 committed by GitHub
parent 0220cf8cc6
commit fd09229541
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 21 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
crates/app/src/story_workspace.rs
View file

@ -6,7 +6,7 @@ use std::{sync::Arc, time::Duration};
use story::{
ButtonStory, CalendarStory, DropdownStory, IconStory, ImageStory, InputStory, ListStory,
ModalStory, PopupStory, ProgressStory, ResizableStory, ScrollableStory, StoryContainer,
SwitchStory, TableStory, TextStory, TooltipStory, WebViewStory,
SwitchStory, TableStory, TextStory, TooltipStory,
};
use ui::{
button::{Button, ButtonStyled as _},
@ -23,7 +23,7 @@ use crate::app_state::AppState;
const MAIN_DOCK_AREA: DockAreaTab = DockAreaTab {
id: "main-dock",
version: 3,
version: 4,
};
#[derive(Clone, PartialEq, Eq, Deserialize)]
@ -225,7 +225,6 @@ impl StoryWorkspace {
Arc::new(StoryContainer::panel::<IconStory>(cx)),
Arc::new(StoryContainer::panel::<TooltipStory>(cx)),
Arc::new(StoryContainer::panel::<ProgressStory>(cx)),
Arc::new(StoryContainer::panel::<WebViewStory>(cx)),
Arc::new(StoryContainer::panel::<CalendarStory>(cx)),
Arc::new(StoryContainer::panel::<ResizableStory>(cx)),
Arc::new(StoryContainer::panel::<ScrollableStory>(cx)),

11
crates/story/src/popup_story.rs
View file

@ -1,8 +1,8 @@
use gpui::{
actions, div, impl_actions, px, AnchorCorner, AppContext, DismissEvent, Element, EventEmitter,
FocusHandle, FocusableView, InteractiveElement, IntoElement, KeyBinding, MouseButton,
MouseDownEvent, ParentElement as _, Render, SharedString, Styled as _, View, ViewContext,
VisualContext, WindowContext,
ParentElement as _, Render, SharedString, Styled as _, View, ViewContext, VisualContext,
WindowContext,
};
use serde::Deserialize;
use ui::{
@ -169,9 +169,6 @@ impl Render for PopupStory {
.mb_5()
.size_full()
.min_h(px(400.))
.on_any_mouse_down(cx.listener(|this, _: &MouseDownEvent, cx| {
cx.focus(&this.focus_handle);
}))
.context_menu({
move |this, cx| {
this.separator()
@ -326,14 +323,14 @@ impl Render for PopupStory {
cx.new_view(|cx| {
PopoverContent::new(cx, |cx| {
v_flex()
.gap_4()
.gap_2()
.child(
"Hello, this is a Popover on the Bottom Right.",
)
.child(Divider::horizontal())
.child(
h_flex()
.gap_4()
.gap_2()
.child(
Button::new("info1")
.label("Ok")

62
crates/story/src/webview_story.rs
View file

@ -1,15 +1,13 @@
use gpui::{
div, px, ClickEvent, FocusHandle, FocusableView, IntoElement, ParentElement as _, Render,
div, ClickEvent, FocusHandle, FocusableView, IntoElement, ParentElement as _, Render,
Styled as _, View, ViewContext, VisualContext as _, WindowContext,
};
use ui::{
button::Button,
h_flex,
input::{InputEvent, TextInput},
theme::ActiveTheme,
v_flex,
webview::WebView,
ContextModal, Placement,
};
pub struct WebViewStory {
@ -97,51 +95,19 @@ impl Render for WebViewStory {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let webview = self.webview.clone();
let address_input = self.address_input.clone();
div().child(
Button::new("show-webview")
.label("Open WebView")
.on_click(cx.listener(move |_, _: &ClickEvent, cx| {
let webview = webview.clone();
let address_input = address_input.clone();
cx.open_drawer(move |this, cx| {
webview.update(cx, |view, _| {
view.show();
});
let webview1 = webview.clone();
this.size(px(640.))
.title("WebView")
.placement(Placement::Bottom)
.child(
v_flex()
.p_2()
.gap_3()
.size_full()
.child(
h_flex()
.gap_2()
.items_center()
.child(address_input.clone()),
)
.child(
div()
.flex_1()
.border_1()
.h(gpui::px(400.))
.border_color(cx.theme().border)
.child(webview.clone()),
),
)
.on_close({
move |_, cx| {
webview1.update(cx, |view, _| {
view.hide();
});
}
})
});
})),
)
v_flex()
.p_2()
.gap_3()
.size_full()
.child(h_flex().gap_2().items_center().child(address_input.clone()))
.child(
div()
.flex_1()
.border_1()
.h(gpui::px(400.))
.border_color(cx.theme().border)
.child(webview.clone()),
)
}
}

5
crates/ui/src/webview.rs
View file

@ -170,13 +170,10 @@ impl Element for WebViewElement {
let bounds = hitbox.clone().map(|h| h.bounds).unwrap_or(bounds);
cx.with_content_mask(Some(ContentMask { bounds }), |cx| {
let webview = self.view.clone();
cx.on_mouse_event(move |event: &MouseDownEvent, _, cx| {
cx.on_mouse_event(move |event: &MouseDownEvent, _, _| {
if !bounds.contains(&event.position) {
// Click white space to blur the input focus
let _ = webview.blur();
} else {
cx.blur();
let _ = webview.focus();
}
});
});