@perspective-dev/viewer 5.3.1 → 5.4.0

package/src/rust/components/status_bar.rs

@@ -10,25 +10,27 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
+use std::rc::Rc;
+
 use perspective_client::config::Filter;
 use wasm_bindgen_futures::spawn_local;
 use web_sys::*;
 use yew::prelude::*;
 
 use super::status_indicator::StatusIndicator;
-use crate::components::containers::select::*;
 use crate::components::copy_dropdown::CopyDropDownMenu;
 use crate::components::export_dropdown::ExportDropDownMenu;
 use crate::components::global_filter_bar::GlobalFilterBar;
-use crate::components::portal::PortalModal;
-use crate::components::status_bar_counter::StatusBarRowsCounter;
+use crate::components::new_panel_menu::{HostedTables, NewPanelMenu, NewPanelPick, PanelLabels};
 use crate::components::style::StyleSurface;
 use crate::config::*;
 use crate::js::*;
 use crate::presentation::{Presentation, PresentationProps};
+use crate::queries::fetch_hosted_tables;
 use crate::renderer::*;
 use crate::session::*;
 use crate::tasks::*;
+use crate::ui::{PortalModal, Select, SelectItem};
 use crate::utils::*;
 use crate::workspace::Workspace;
 use crate::*;
@@ -41,9 +43,12 @@ pub struct StatusBarProps {
     /// Fired when the reset button is clicked.
     pub on_reset: Callback<bool>,
 
-    /// Snapshots threaded from root.  Component reads `has_table`, `stats`,
-    /// `error`, `title` from session_props; `selected_theme`,
-    /// `available_themes`, `is_workspace` from presentation_props.
+    /// The left-anchored "New" action, fired with the [`NewPanelMenu`] pick.
+    pub on_new_panel: Callback<NewPanelPick>,
+
+    /// Snapshots threaded from root.  Component reads `has_table`,
+    /// `has_table_cells`, `error` from session_props; `selected_theme`,
+    /// `available_themes` from presentation_props.
     pub session_props: SessionProps,
     pub presentation_props: PresentationProps,
 
@@ -89,6 +94,18 @@ impl PartialEq for StatusBarProps {
 
 pub enum StatusBarMsg {
     Reset(MouseEvent),
+
+    /// The "New" button: fetch the hosted-table listing, then open the
+    /// dropdown.
+    NewPanel,
+
+    /// The listing resolved: open the dropdown anchored at the button, if
+    /// the generation is still the newest.
+    OpenNewPanel(u32, HostedTables),
+    CloseNewPanel,
+
+    /// A pick in the "New" dropdown.
+    NewPanelPick(NewPanelPick),
     Export,
     Copy,
     CloseExport,
@@ -103,9 +120,17 @@ pub enum StatusBarMsg {
 pub struct StatusBar {
     copy_ref: NodeRef,
     export_ref: NodeRef,
+    new_ref: NodeRef,
     statusbar_ref: NodeRef,
     copy_target: Option<HtmlElement>,
     export_target: Option<HtmlElement>,
+
+    /// The "New" dropdown's anchor and listings while it is open.
+    new_menu: Option<(HtmlElement, HostedTables, PanelLabels)>,
+
+    /// Bumped per "New" click; a resolving fetch opens only if it is still
+    /// the newest one.
+    new_generation: u32,
 }
 
 impl Component for StatusBar {
@@ -116,9 +141,12 @@ impl Component for StatusBar {
         Self {
             copy_ref: NodeRef::default(),
             export_ref: NodeRef::default(),
+            new_ref: NodeRef::default(),
             statusbar_ref: NodeRef::default(),
             copy_target: None,
             export_target: None,
+            new_menu: None,
+            new_generation: 0,
         }
     }
 
@@ -129,6 +157,54 @@ impl Component for StatusBar {
                 ctx.props().on_reset.emit(all);
                 false
             },
+            StatusBarMsg::NewPanel => {
+                self.new_generation = self.new_generation.wrapping_add(1);
+                let generation = self.new_generation;
+                let workspace = ctx.props().workspace.clone();
+                let link = ctx.link().clone();
+                ApiFuture::spawn(async move {
+                    let tables = fetch_hosted_tables(&workspace).await;
+                    link.send_message(StatusBarMsg::OpenNewPanel(generation, Rc::new(tables)));
+                    Ok(())
+                });
+
+                false
+            },
+            StatusBarMsg::OpenNewPanel(generation, tables) => {
+                if generation != self.new_generation {
+                    return false;
+                }
+
+                match self.new_ref.cast::<HtmlElement>() {
+                    Some(target) => {
+                        let workspace = &ctx.props().workspace;
+                        let panels = Rc::new(
+                            workspace
+                                .panel_ids()
+                                .into_iter()
+                                .filter_map(|id| {
+                                    let panel = workspace.panel(&id)?;
+                                    let title = panel.session.get_title().filter(|t| !t.is_empty());
+                                    Some((id.as_str().to_owned(), title))
+                                })
+                                .collect::<Vec<_>>(),
+                        );
+
+                        self.new_menu = Some((target, tables, panels));
+                        true
+                    },
+                    None => false,
+                }
+            },
+            StatusBarMsg::CloseNewPanel => {
+                self.new_menu = None;
+                true
+            },
+            StatusBarMsg::NewPanelPick(pick) => {
+                ctx.props().on_new_panel.emit(pick);
+                self.new_menu = None;
+                true
+            },
             StatusBarMsg::ResetTheme => {
                 update_theme(
                     &ctx.props().renderer,
@@ -187,7 +263,6 @@ impl Component for StatusBar {
         let has_table = ctx.props().session_props.has_table.clone();
         let is_errored = ctx.props().session_props.is_errored();
         let is_settings_open = ctx.props().is_settings_open;
-        let title = &ctx.props().session_props.title;
 
         let mut is_updating_class_name = classes!();
         if !is_settings_open {
@@ -204,6 +279,9 @@ impl Component for StatusBar {
         let onexport = ctx.link().callback(|_: MouseEvent| StatusBarMsg::Export);
         let oncopy = ctx.link().callback(|_: MouseEvent| StatusBarMsg::Copy);
         let onreset = ctx.link().callback(StatusBarMsg::Reset);
+        let onnew = ctx.link().callback(|_: MouseEvent| StatusBarMsg::NewPanel);
+        let on_new_select = ctx.link().callback(StatusBarMsg::NewPanelPick);
+        let on_close_new = ctx.link().callback(|_| StatusBarMsg::CloseNewPanel);
 
         // Project only the *active* panel's plugin toolbar into the shared status
         // bar. Each panel's toolbar slots into `statusbar-extra-{its-panel-id}`
@@ -216,12 +294,7 @@ impl Component for StatusBar {
             .map(|id| format!("statusbar-extra-{id}"))
             .unwrap_or_else(|| "statusbar-extra".to_owned());
         let is_menu = matches!(has_table, Some(TableLoadState::Loaded)) && is_settings_open;
-        // The editable title moved to the per-panel `<PanelTab>` headers; the
-        // status bar no longer hosts an `<input>`, so its `is_active` factor is
-        // gone. `is_title` now only gates the row counter.
-        let is_title =
-            is_menu || ctx.props().presentation_props.is_workspace || title.is_some() || is_errored;
-
+        let is_panel_bar = !ctx.props().workspace.clients().is_empty();
         let is_settings =
             !matches!(has_table, Some(TableLoadState::Loaded)) || is_errored || is_settings_open;
 
@@ -293,11 +366,16 @@ impl Component for StatusBar {
                             update_count={ctx.props().update_count}
                             session_props={ctx.props().session_props.clone()}
                         />
-                        if is_title {
-                            <StatusBarRowsCounter stats={ctx.props().session_props.stats.clone()} />
+                        if is_panel_bar {
+                            <div id="panel-bar" class="section">
+                                <span ref={&self.new_ref} class="hover-target" onmousedown={onnew}>
+                                    <span id="new_panel" class="button">
+                                        <span class="icon" />
+                                        <span class="icon-label" />
+                                    </span>
+                                </span>
+                            </div>
                         }
-                        // Global-filter chips sit between the row stats and the
-                        // menu icons (rendered only when there are filters).
                         if !ctx.props().global_filters.is_empty() {
                             <GlobalFilterBar
                                 filters={ctx.props().global_filters.clone()}
@@ -349,9 +427,25 @@ impl Component for StatusBar {
                             </div>
                         }
                     </div>
+                    <PortalModal
+                        tag_name="perspective-new-panel-menu"
+                        sheet={StyleSurface::DropdownMenu.sheet()}
+                        target={self.new_menu.as_ref().map(|(target, ..)| target.clone())}
+                        own_focus=true
+                        on_close={on_close_new}
+                        theme={ctx.props().presentation_props.selected_theme.clone().unwrap_or_default()}
+                    >
+                        if let Some((_, tables, panels)) = &self.new_menu {
+                            <NewPanelMenu
+                                tables={Some(tables.clone())}
+                                panels={panels.clone()}
+                                callback={on_new_select}
+                            />
+                        }
+                    </PortalModal>
                     <PortalModal
                         tag_name="perspective-copy-menu"
-                        surface={StyleSurface::DropdownMenu}
+                        sheet={StyleSurface::DropdownMenu.sheet()}
                         target={self.copy_target.clone()}
                         own_focus=true
                         on_close={on_close_copy}
@@ -361,7 +455,7 @@ impl Component for StatusBar {
                     </PortalModal>
                     <PortalModal
                         tag_name="perspective-export-menu"
-                        surface={StyleSurface::DropdownMenu}
+                        sheet={StyleSurface::DropdownMenu.sheet()}
                         target={self.export_target.clone()}
                         own_focus=true
                         on_close={on_close_export}

package/src/rust/components/status_indicator.rs

@@ -22,18 +22,15 @@ use crate::utils::*;
 
 /// Value-prop version: no PubSub subscriptions, no reducer.
 /// The parent (`StatusBar`) re-renders this component whenever
-/// `session_props.error/has_table/stats` or `update_count` change (via
-/// root's `UpdateInFlight` / `UpdateSession` messages).
+/// `session_props.error/has_table/has_table_cells` or `update_count` change
+/// (via root's `UpdateInFlight` / `UpdateSession` messages).
 #[derive(PartialEq, Properties)]
 pub struct StatusIndicatorProps {
     pub renderer: Renderer,
     pub session: Session,
-    /// Number of in-flight CONFIG-DRIVEN runs (>0 → "updating" spinner) —
-    /// a level-triggered snapshot of `Session::in_flight_config_runs`
-    /// (RAII-settled; see `UPDATE_COUNT_REGRESSION_PLAN.md`).
+
+    /// TODO(texodus): remove this
     pub update_count: u32,
-    /// Snapshot of session value props — read for `error`, `has_table`,
-    /// `stats` to derive the icon state.
     pub session_props: SessionProps,
 }
 
@@ -42,13 +39,7 @@ pub struct StatusIndicatorProps {
 /// reconnect callback when in an error state.
 #[function_component]
 pub fn StatusIndicator(props: &StatusIndicatorProps) -> Html {
-    let has_table_cells = props
-        .session_props
-        .stats
-        .as_ref()
-        .and_then(|s| s.num_table_cells)
-        .is_some();
-
+    let has_table_cells = props.session_props.has_table_cells;
     let state = if let Some(err) = &props.session_props.error {
         StatusIconState::Errored(
             err.message(),

package/src/rust/components/string_column_style.rs

@@ -12,9 +12,8 @@
 
 use yew::prelude::*;
 
-use super::modal::{ModalLink, SetModalLink};
-use crate::components::form::select_enum_field::SelectEnumField;
 use crate::config::*;
+use crate::ui::{ModalLink, SelectEnumField, SetModalLink};
 use crate::utils::WeakScope;
 
 /// Format-only widget for [`String`] columns. Renders the `format` enum

package/src/rust/components/{style/mod.rs → style.rs}

@@ -25,15 +25,44 @@
 //!
 //! ```ignore
 //! html! {
-//!     <StyleProvider root={host} surface={StyleSurface::Viewer}>
+//!     <StyleProvider root={host} sheet={StyleSurface::Viewer.sheet()}>
 //!         <h1>{ "I am styled!" }</h1>
 //!     </StyleProvider>
 //! }
 //! ```
 
-mod style_provider;
+/// The CSS bundle a shadow tree adopts; each variant maps to one build-time
+/// `src/css/_*.css` entrypoint.
+#[derive(Clone, Copy, Debug, PartialEq, Eq, Default)]
+pub enum StyleSurface {
+    /// The `<perspective-viewer>` ShadowRoot.
+    #[default]
+    Viewer,
+    /// Column-name completion dropdown (inverted color scheme).
+    ColumnDropdown,
+    /// Filter-value completion dropdown.
+    FilterDropdown,
+    /// Expression function-completion dropdown.
+    FunctionDropdown,
+    /// Copy / Export menu (non-inverted color scheme).
+    DropdownMenu,
+    /// Panel context menu (right-click a panel).
+    ContextMenu,
+}
 
-pub use style_provider::{StyleProvider, StyleSurface};
+impl StyleSurface {
+    /// The shared, lazily constructed `CSSStyleSheet` for this surface.
+    pub fn sheet(self) -> web_sys::CssStyleSheet {
+        match self {
+            StyleSurface::Viewer => VIEWER_SHEET.with(|x| x.clone()),
+            StyleSurface::ColumnDropdown => COLUMN_DROPDOWN_SHEET.with(|x| x.clone()),
+            StyleSurface::FilterDropdown => FILTER_DROPDOWN_SHEET.with(|x| x.clone()),
+            StyleSurface::FunctionDropdown => FUNCTION_DROPDOWN_SHEET.with(|x| x.clone()),
+            StyleSurface::DropdownMenu => DROPDOWN_MENU_SHEET.with(|x| x.clone()),
+            StyleSurface::ContextMenu => CONTEXT_MENU_SHEET.with(|x| x.clone()),
+        }
+    }
+}
 
 /// The viewer-surface bundle: every `src/css` file except the floating-popup
 /// sheets. Adopted into the `<perspective-viewer>` ShadowRoot.
@@ -76,15 +105,3 @@ fn make_sheet(css: &str) -> web_sys::CssStyleSheet {
     sheet.replace_sync(css).unwrap();
     sheet
 }
-
-/// The memoized, shared `CSSStyleSheet` for a given [`StyleSurface`].
-pub(crate) fn surface_sheet(surface: StyleSurface) -> web_sys::CssStyleSheet {
-    match surface {
-        StyleSurface::Viewer => VIEWER_SHEET.with(|x| x.clone()),
-        StyleSurface::ColumnDropdown => COLUMN_DROPDOWN_SHEET.with(|x| x.clone()),
-        StyleSurface::FilterDropdown => FILTER_DROPDOWN_SHEET.with(|x| x.clone()),
-        StyleSurface::FunctionDropdown => FUNCTION_DROPDOWN_SHEET.with(|x| x.clone()),
-        StyleSurface::DropdownMenu => DROPDOWN_MENU_SHEET.with(|x| x.clone()),
-        StyleSurface::ContextMenu => CONTEXT_MENU_SHEET.with(|x| x.clone()),
-    }
-}

package/src/rust/components/style_controls/number_string_format/digits_section.rs

@@ -17,15 +17,13 @@ use perspective_client::config::ColumnType;
 use yew::html;
 
 use super::CustomNumberFormat;
-use crate::components::containers::select::{Select, SelectItem};
-use crate::components::form::number_field::NumberField;
-use crate::components::form::number_range_field::NumberRangeField;
-use crate::components::form::optional_field::OptionalField;
-use crate::components::form::select_enum_field::SelectEnumField;
 use crate::components::style_controls::CustomNumberFormatMsg;
 use crate::config::{
     ROUNDING_INCREMENTS, RoundingIncrement, RoundingMode, RoundingPriority, TrailingZeroDisplay,
 };
+use crate::ui::{
+    NumberField, NumberRangeField, OptionalField, Select, SelectEnumField, SelectItem,
+};
 
 impl CustomNumberFormat {
     pub fn digits_section(&self, ctx: &yew::prelude::Context<Self>) -> yew::prelude::Html {

package/src/rust/components/style_controls/number_string_format/misc_section.rs

@@ -13,9 +13,9 @@
 use yew::html;
 
 use super::CustomNumberFormat;
-use crate::components::form::select_enum_field::SelectEnumField;
 use crate::components::style_controls::{CustomNumberFormatMsg, NotationName};
 use crate::config::*;
+use crate::ui::SelectEnumField;
 
 impl CustomNumberFormat {
     pub fn misc_section(&self, ctx: &yew::prelude::Context<Self>) -> yew::prelude::Html {

package/src/rust/components/style_controls/number_string_format/style_section.rs

@@ -13,9 +13,9 @@
 use yew::html;
 
 use super::CustomNumberFormat;
-use crate::components::form::select_enum_field::SelectEnumField;
 use crate::components::style_controls::{CustomNumberFormatMsg, NumberStyle};
 use crate::config::*;
+use crate::ui::SelectEnumField;
 
 impl CustomNumberFormat {
     pub fn style_section(&self, ctx: &yew::prelude::Context<Self>) -> yew::prelude::Html {

package/src/rust/components/viewer/msg.rs

@@ -26,7 +26,7 @@ use crate::presentation::{
     ColumnSettingsTab, ColumnSettingsTarget, DragDropProps, PresentationProps,
 };
 use crate::renderer::RendererProps;
-use crate::session::{SessionProps, TableLoadState, ViewStats};
+use crate::session::{SessionProps, TableLoadState};
 use crate::utils::Completion;
 
 /// The filter-bearing payload of a master panel's selection or click event
@@ -45,9 +45,31 @@ pub struct MasterSelection {
     pub cell_fallback: Option<Filter>,
 }
 
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum Divider {
+    Settings,
+    ColumnSettings,
+}
+
+impl Divider {
+    /// The shadow-DOM selector of the divider's resizable pane (pane 0 of
+    /// its `SplitPanel`; the flex-fill pane renders bare).
+    pub fn pane_selector(self) -> &'static str {
+        match self {
+            Self::Settings => "#app_panel > .split-panel-child",
+            Self::ColumnSettings => "#modal_panel > .split-panel-child",
+        }
+    }
+}
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum PaneTarget {
+    Width(i32),
+    Natural,
+}
+
 #[derive(Debug)]
 pub enum PerspectiveViewerMsg {
-    ColumnSettingsPanelSizeUpdate(Option<i32>),
     ColumnSettingsPanelAutoWidth(f64),
     ToggleColumnSettingsPin,
     ToggleColumnSettingsPinComplete(Sender<()>),
@@ -84,12 +106,18 @@ pub enum PerspectiveViewerMsg {
     /// nudge runs complete (invariant I6).
     SetActivePanel(String, Option<Completion>),
 
-    /// The named panel's frame was closed (removed from the layout); remove it
-    /// from the workspace and dispose its engines. The `Completion` resolves
-    /// `removePanel()` after the eject's teardown run completes (invariant
-    /// I6) — carrying any teardown error, which was previously dropped.
+    /// Close the named panel: remove it from the workspace now but keep its
+    /// engines parked until [`Self::PanelClosed`] reports the layout commit
+    /// that reclaims its cell. The `Completion` resolves `removePanel()`
+    /// after the eject's teardown run completes (invariant I6) — carrying
+    /// any teardown error.
     ClosePanel(String, Option<Completion>),
 
+    /// `MainPanel` saw the named panel leave the `regular-layout` tree, so
+    /// dispose its parked panel, or close outright one the workspace still
+    /// holds.
+    PanelClosed(String),
+
     /// `restoreWorkspace` finished replacing the panel set in the
     /// `Workspace` (new models inserted, old panels ejected, layout staged):
     /// activate the named panel, re-subscribe the per-panel wiring, and
@@ -130,26 +158,10 @@ pub enum PerspectiveViewerMsg {
     /// Some panel's title changed (any panel, via `_title_subscriptions`);
     /// re-render so the tab titles refresh.
     TitlesChanged,
-    SettingsPanelSizeUpdate(Option<i32>),
-
-    /// The settings-pane divider proposed a new pane width (per pointermove,
-    /// from the *deferred* `SplitPanel` — it has NOT been applied). Feeds the
-    /// latest-wins presize pump (`PRESIZE_EVERYWHERE_PLAN.md` P1): geometry
-    /// commits only after every visible panel has rendered at its target.
-    SettingsDividerMove(i32),
-
-    /// Run one pump iteration: presize all visible panels at the newest
-    /// proposed pane width, then commit it.
-    SettingsDividerPump,
-
-    /// Presize for this pane width completed — commit it (the deferred
-    /// `SplitPanel`'s controlled `size`), then pump again if a newer target
-    /// arrived meanwhile.
-    SettingsDividerCommit(i32),
-
-    /// Divider drag ended: reactively finalize every visible panel at its
-    /// exact settled cell (debounced no-op when the presizes were exact).
-    SettingsDividerFinish,
+    DividerMove(Divider, PaneTarget),
+    DividerPump(Divider),
+    DividerCommit(Divider, PaneTarget),
+    DividerFinish(Divider),
     SettingsPanelTabChanged(SelectedTab),
     SettingsPanelAutoWidth(f64),
     ToggleDebug,
@@ -203,10 +215,11 @@ pub enum PerspectiveViewerMsg {
     UpdateColumnSettingsCommit(Sender<()>),
     UpdateDragDrop(Box<DragDropProps>),
 
-    /// Update only stats-related fields of `session_props` without touching
-    /// `config`.  This prevents `stats_changed` events (e.g. from `reset()`)
-    /// from propagating a freshly-cleared config to the column selector.
-    UpdateSessionStats(Option<ViewStats>, Option<TableLoadState>),
+    /// Update only the stats-derived fields of `session_props`
+    /// (`has_table_cells`, `has_table`) without touching `config`.  This
+    /// prevents `stats_changed` events (e.g. from `reset()`) from propagating
+    /// a freshly-cleared config to the column selector.
+    UpdateSessionStats(bool, Option<TableLoadState>),
 
     /// Refresh the root's render snapshot of the `Workspace`-owned global
     /// filter set (dispatched by its `filters_changed` PubSub).

package/src/rust/components/viewer/panels.rs

@@ -33,7 +33,7 @@ use crate::renderer::Renderer;
 use crate::session::*;
 use crate::tasks::*;
 use crate::utils::{Completion, spawn_owned};
-use crate::workspace::PanelId;
+use crate::workspace::{Panel, PanelId};
 
 impl PerspectiveViewer {
     pub(super) fn on_layout_changed(&mut self, ctx: &Context<Self>) -> bool {
@@ -136,16 +136,11 @@ impl PerspectiveViewer {
         true
     }
 
-    pub(super) fn on_close_panel(
-        &mut self,
-        ctx: &Context<Self>,
-        id: String,
-        completion: Option<Completion>,
-    ) -> bool {
-        let id = PanelId::from(id);
-
-        let was_active = ctx.props().workspace.active_id().as_ref() == Some(&id);
-        let removed = ctx.props().workspace.remove_panel(&id);
+    /// Remove `id` from the workspace and return the detached [`Panel`] with
+    /// its engines still alive, or `None` for an unknown id.
+    fn detach_panel(&mut self, ctx: &Context<Self>, id: &PanelId) -> Option<Panel> {
+        let was_active = ctx.props().workspace.active_id().as_ref() == Some(id);
+        let removed = ctx.props().workspace.remove_panel(id)?;
         if was_active {
             if let Some(next) = ctx.props().workspace.panel_ids().first().cloned() {
                 ctx.props().workspace.set_active(next);
@@ -164,19 +159,55 @@ impl PerspectiveViewer {
             self.retarget_active(ctx, new_session, new_renderer);
         }
 
-        let eject = removed.map(eject_panel);
-        match (eject, completion) {
-            (Some(eject), Some(completion)) => completion.resolve_after(eject),
-            (Some(eject), None) => spawn_owned("close-panel", eject),
-            (None, Some(completion)) => completion.resolve_after(async { Ok(()) }),
-            (None, None) => {},
-        }
-
         apply_global_filters(&ctx.props().workspace);
         self._title_subscriptions = subscribe_panel_titles(ctx);
+        Some(removed)
+    }
+
+    pub(super) fn on_close_panel(
+        &mut self,
+        ctx: &Context<Self>,
+        id: String,
+        completion: Option<Completion>,
+    ) -> bool {
+        let id = PanelId::from(id);
+        let Some(removed) = self.detach_panel(ctx, &id) else {
+            if let Some(completion) = completion {
+                completion.resolve_after(async { Ok(()) });
+            }
+
+            return false;
+        };
+
+        ctx.props().workspace.stash_closing(removed);
+        if let Some(completion) = completion {
+            self.pending_closes.insert(id, completion);
+        }
+
         true
     }
 
+    pub(super) fn on_panel_closed(&mut self, ctx: &Context<Self>, id: String) -> bool {
+        let id = PanelId::from(id);
+        if let Some(panel) = ctx.props().workspace.take_closing(&id) {
+            let eject = eject_panel(panel);
+            match self.pending_closes.remove(&id) {
+                Some(completion) => completion.resolve_after(eject),
+                None => spawn_owned("close-panel", eject),
+            }
+
+            return false;
+        }
+
+        match self.detach_panel(ctx, &id) {
+            Some(panel) => {
+                spawn_owned("close-panel", eject_panel(panel));
+                true
+            },
+            None => false,
+        }
+    }
+
     pub(super) fn on_duplicate_panel(&mut self, ctx: &Context<Self>, id: String) -> bool {
         if let Some(panel) = ctx.props().workspace.panel(&PanelId::from(id)) {
             let elem = ctx.props().elem.clone();