@perspective-dev/viewer 5.3.0 → 5.4.0

package/src/rust/components/main_panel.rs

@@ -61,10 +61,14 @@ pub struct MainPanelProps {
     /// active panel.
     pub on_activate_panel: Callback<String>,
 
-    /// Fired with a panel id when its frame's close button removes it from the
-    /// layout, so the root can dispose the panel.
+    /// Fired with a panel id from a tab × (an app-initiated close): the root
+    /// removes it from the model at once and parks its engines.
     pub on_close_panel: Callback<String>,
 
+    /// Fired with a panel id once the `regular-layout` tree no longer holds
+    /// it, so the root can eject the parked panel.
+    pub on_panel_closed: Callback<String>,
+
     /// Fired with `(panel id, command)` when the panel context menu selects a
     /// command the root executes (New/Duplicate/Reset/ToggleMaster/Close).
     /// Maximize/Restore are handled HERE (this component owns the layout
@@ -203,6 +207,10 @@ pub struct MainPanel {
     /// every listener, and nothing ever noticed.
     listener_target: Option<web_sys::HtmlElement>,
 
+    /// Ids gone from the model whose `removePanel` has been issued to the
+    /// layout and not yet committed.
+    pending_removals: HashSet<String>,
+
     /// Per-panel `ResizeObserver`s, keyed by panel id, each observing that
     /// panel's slotted plugin element and resizing only that panel's
     /// `Renderer`. Bound in `BeforeResize` for the DRAGGED panel only (it is
@@ -347,6 +355,7 @@ impl Component for MainPanel {
             main_panel_ref: NodeRef::default(),
             layout_ref: NodeRef::default(),
             inserted: Vec::new(),
+            pending_removals: HashSet::new(),
             _layout_update_listener: listener,
             _layout_select_listener: select_listener,
             _layout_before_resize_listener: before_resize_listener,
@@ -376,6 +385,7 @@ impl Component for MainPanel {
     }
 
     fn changed(&mut self, ctx: &Context<Self>, old: &Self::Properties) -> bool {
+        self.close_unstaged_panels(ctx, old);
         ctx.props() != old
     }
 
@@ -403,3 +413,17 @@ impl Component for MainPanel {
 
     fn destroy(&mut self, _ctx: &Context<Self>) {}
 }
+
+impl MainPanel {
+    /// Report closed every panel gone from the model that the layout never
+    /// held, since it has no commit to wait for.
+    fn close_unstaged_panels(&self, ctx: &Context<Self>, old: &MainPanelProps) {
+        for id in &old.panel_ids {
+            if !ctx.props().panel_ids.contains(id)
+                && !self.inserted.iter().any(|n| n == id.as_str())
+            {
+                ctx.props().on_panel_closed.emit(id.as_str().to_owned());
+            }
+        }
+    }
+}

package/src/rust/components/mod.rs

@@ -16,34 +16,32 @@
 
 #[cfg(feature = "llm-agent")]
 pub mod chat_panel;
+pub mod code_editor;
 pub mod column_dropdown;
 pub mod column_selector;
 pub mod column_settings_sidebar;
-pub mod containers;
-pub mod context_menu;
 pub mod copy_dropdown;
 pub mod datetime_column_style;
+pub mod debug_panel;
+pub mod dragdrop_list;
 pub mod editable_header;
 pub mod empty_row;
 pub mod export_dropdown;
 pub mod expression_editor;
 pub mod filter_dropdown;
-pub mod font_loader;
-pub mod form;
 pub mod function_dropdown;
 pub mod global_filter_bar;
 pub mod main_panel;
-pub mod modal;
+pub mod new_panel_menu;
 pub mod number_series_style;
 pub mod panel_menu;
 pub mod panel_tab;
 pub mod plugin_selector;
 pub mod plugin_tab;
-pub mod portal;
 pub mod render_warning;
+pub mod rows_counter;
 pub mod settings_panel;
 pub mod status_bar;
-pub mod status_bar_counter;
 pub mod status_indicator;
 pub mod string_column_style;
 pub mod style;

package/src/rust/components/new_panel_menu.rs

@@ -0,0 +1,97 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+use std::rc::Rc;
+
+use yew::prelude::*;
+
+/// A pick in the "New" menu: a fresh panel on a hosted `Table`, or a copy of
+/// an existing panel (the same operation as the context menu's "Duplicate").
+#[derive(Clone, PartialEq)]
+pub enum NewPanelPick {
+    FromTable { client: String, table: String },
+    FromPanel(String),
+}
+
+/// `(client name, its hosted table names)` per loaded client — the resolved
+/// output of `queries::fetch_hosted_tables`.
+pub type HostedTables = Rc<Vec<(String, Vec<String>)>>;
+
+/// `(panel id, title)` per panel, in layout-insertion order.
+pub type PanelLabels = Rc<Vec<(String, Option<String>)>>;
+
+#[derive(Properties, PartialEq)]
+pub struct NewPanelMenuProps {
+    /// `None` while the hosted-table fetch is in flight.
+    pub tables: Option<HostedTables>,
+    pub panels: PanelLabels,
+    pub callback: Callback<NewPanelPick>,
+}
+
+/// The "New" menu body shared by the status bar dropdown and the context
+/// menu's "New" flyout.
+#[function_component]
+pub fn NewPanelMenu(props: &NewPanelMenuProps) -> Html {
+    let pick = |value: NewPanelPick| props.callback.reform(move |_: MouseEvent| value.clone());
+
+    let tables = match &props.tables {
+        None => html! { <span class="no-results">{ "Loading..." }</span> },
+        Some(clients) if clients.iter().all(|(_, tables)| tables.is_empty()) => {
+            html! { <span class="no-results">{ "No tables" }</span> }
+        },
+        Some(clients) => {
+            let multi = clients.len() > 1;
+            clients
+                .iter()
+                .map(|(client, tables)| {
+                    let rows = tables.iter().map(|table| {
+                        let onmousedown = pick(NewPanelPick::FromTable {
+                            client: client.clone(),
+                            table: table.clone(),
+                        });
+                        html! { <span class="dropdown-menu-item" {onmousedown}>{ table }</span> }
+                    });
+
+                    html! {
+                        <>
+                            if multi { <span class="dropdown-group-sublabel">{ client }</span> }
+                            { for rows }
+                        </>
+                    }
+                })
+                .collect::<Html>()
+        },
+    };
+
+    let panels = if props.panels.is_empty() {
+        html! { <span class="no-results">{ "No panels" }</span> }
+    } else {
+        props
+            .panels
+            .iter()
+            .map(|(id, title)| {
+                let onmousedown = pick(NewPanelPick::FromPanel(id.clone()));
+                let label = title.clone().unwrap_or_else(|| id.clone());
+                html! { <span class="dropdown-menu-item" {onmousedown}>{ label }</span> }
+            })
+            .collect::<Html>()
+    };
+
+    html! {
+        <div class="new-panel-menu">
+            <span class="dropdown-group-label" data-label="new-from-table" />
+            <div class="dropdown-group-container">{ tables }</div>
+            <span class="dropdown-group-label" data-label="new-from-panel" />
+            <div class="dropdown-group-container">{ panels }</div>
+        </div>
+    }
+}

package/src/rust/components/number_series_style.rs

@@ -13,9 +13,8 @@
 use web_sys::{HtmlInputElement, InputEvent};
 use yew::prelude::*;
 
-use super::modal::{ModalLink, SetModalLink};
-use crate::components::form::select_enum_field::SelectEnumField;
 use crate::config::*;
+use crate::ui::{IntlLabel, ModalLink, SelectEnumField, SetModalLink};
 use crate::utils::WeakScope;
 
 #[derive(Properties)]
@@ -113,7 +112,7 @@ impl Component for NumberSeriesStyle {
             });
             html! {
                 <div class="row">
-                    <label id="stack-label" />
+                    <IntlLabel name="stack" />
                     <input type="checkbox" id="stack-checkbox" {checked} {oninput} />
                 </div>
             }

package/src/rust/components/panel_menu.rs

@@ -26,20 +26,23 @@
 //! `on_close` fires exactly once, when the session ends (blur dismissal, a
 //! command selection, or the picker closing).
 
+use std::rc::Rc;
+
 use perspective_js::utils::*;
 use wasm_bindgen::JsCast;
 use web_sys::HtmlElement;
 use yew::prelude::*;
 
-use crate::components::context_menu::{ContextMenu, ContextMenuEntry, ContextMenuItem};
 use crate::components::copy_dropdown::CopyDropDownMenu;
 use crate::components::export_dropdown::ExportDropDownMenu;
-use crate::components::portal::PortalModal;
+use crate::components::new_panel_menu::{HostedTables, NewPanelMenu, NewPanelPick};
 use crate::components::style::StyleSurface;
 use crate::config::*;
 use crate::js::copy_to_clipboard;
 use crate::presentation::Presentation;
+use crate::queries::fetch_hosted_tables;
 use crate::tasks::export_method_to_blob;
+use crate::ui::{ContextMenu, ContextMenuEntry, ContextMenuItem, MODAL_SLOT, PortalModal};
 use crate::utils::*;
 use crate::workspace::{PanelId, Workspace};
 
@@ -48,7 +51,13 @@ use crate::workspace::{PanelId, Workspace};
 #[derive(Clone, Debug, PartialEq, Eq)]
 pub enum PanelCommand {
     New,
-    NewFrom { client: String, table: String },
+    NewFrom {
+        client: String,
+        table: String,
+    },
+
+    /// A fresh panel copied from the named panel.
+    NewFromPanel(String),
     Duplicate,
     Reset,
     Maximize,
@@ -133,8 +142,8 @@ pub enum PanelMenuMsg {
 }
 
 pub struct PanelMenu {
-    /// The session-long 0×0 cursor anchor element (appended to `<body>`) both
-    /// stages' `PortalModal`s position against; removed on destroy.
+    /// The session-long 0×0 cursor anchor element (a viewer light-DOM child)
+    /// both stages' `PortalModal`s position against; removed on destroy.
     anchor: HtmlElement,
 
     /// The open format picker, if the session is in its picker stage.
@@ -143,7 +152,7 @@ pub struct PanelMenu {
     /// The "New" sub-menu's data: `(client name, its hosted table names)` per
     /// loaded client, in registration order. `None` while the fetch spawned at
     /// menu open is still in flight.
-    tables: Option<Vec<(String, Vec<String>)>>,
+    tables: Option<HostedTables>,
 }
 
 impl Component for PanelMenu {
@@ -151,37 +160,20 @@ impl Component for PanelMenu {
     type Properties = PanelMenuProps;
 
     fn create(ctx: &Context<Self>) -> Self {
-        let clients = ctx.props().workspace.clients();
+        let workspace = ctx.props().workspace.clone();
         let link = ctx.link().clone();
         ApiFuture::spawn(async move {
-            let mut tables = Vec::with_capacity(clients.len());
-            for client in clients {
-                // A failing client contributes an empty list rather than
-                // poisoning the whole menu.
-                let mut names = match client.get_hosted_table_names().await {
-                    Ok(names) => names,
-                    Err(err) => {
-                        tracing::warn!(
-                            "Failed to list tables for `Client` \"{}\": {err}",
-                            client.get_name()
-                        );
-
-                        vec![]
-                    },
-                };
-
-                // Server-side name order isn't meaningful (or stable) — list
-                // deterministically.
-                names.sort_unstable();
-                tables.push((client.get_name().to_owned(), names));
-            }
-
+            let tables = fetch_hosted_tables(&workspace).await;
             link.send_message(PanelMenuMsg::TablesLoaded(tables));
             Ok(())
         });
 
         Self {
-            anchor: session_anchor(ctx.props().x, ctx.props().y),
+            anchor: session_anchor(
+                ctx.props().presentation.viewer_elem(),
+                ctx.props().x,
+                ctx.props().y,
+            ),
             picker: None,
             tables: None,
         }
@@ -213,7 +205,7 @@ impl Component for PanelMenu {
                 false
             },
             PanelMenuMsg::TablesLoaded(tables) => {
-                self.tables = Some(tables);
+                self.tables = Some(Rc::new(tables));
                 self.picker.is_none()
             },
         }
@@ -229,7 +221,7 @@ impl Component for PanelMenu {
     fn destroy(&mut self, _ctx: &Context<Self>) {
         // The session ended (or the parent unmounted mid-session, e.g. the
         // target panel closed); don't leak the cursor anchor.
-        let _ = global::body().remove_child(&self.anchor);
+        self.anchor.remove();
     }
 }
 
@@ -254,7 +246,7 @@ impl PanelMenu {
             None => vec![ContextMenuEntry::Submenu {
                 label: "New".to_owned(),
                 on_select: None,
-                entries: self.new_submenu_entries(ctx),
+                entries: vec![ContextMenuEntry::Custom(self.new_submenu_body(ctx))],
             }],
             Some(panel_id) => {
                 let can_close = ctx.props().workspace.len() > 1;
@@ -263,7 +255,7 @@ impl PanelMenu {
                     ContextMenuEntry::Submenu {
                         label: "New".to_owned(),
                         on_select: Some(cmd(PanelCommand::New)),
-                        entries: self.new_submenu_entries(ctx),
+                        entries: vec![ContextMenuEntry::Custom(self.new_submenu_body(ctx))],
                     },
                     item("Duplicate", cmd(PanelCommand::Duplicate), false),
                     item("Reset", cmd(PanelCommand::Reset), false),
@@ -301,7 +293,7 @@ impl PanelMenu {
             <PortalModal
                 key="perspective-context-menu"
                 tag_name="perspective-context-menu"
-                surface={StyleSurface::ContextMenu}
+                sheet={StyleSurface::ContextMenu.sheet()}
                 target={Some(self.anchor.clone())}
                 own_focus=true
                 on_close={&on_close}
@@ -315,54 +307,35 @@ impl PanelMenu {
         }
     }
 
-    /// The "New" hover sub-menu's entries: every hosted `Table` name from
-    /// every loaded `Client`, flat for a single client, grouped under a
-    /// header row per client otherwise (client names are globally unique, so
-    /// the grouping also disambiguates table-name collisions).
-    fn new_submenu_entries(&self, ctx: &Context<Self>) -> Vec<ContextMenuEntry> {
-        let placeholder = |label: &str| {
-            vec![ContextMenuEntry::Item(ContextMenuItem {
-                label: label.to_owned(),
-                on_select: Callback::noop(),
-                disabled: true,
-            })]
-        };
-
-        let Some(clients) = &self.tables else {
-            return placeholder("Loading...");
-        };
-
-        if clients.iter().all(|(_, tables)| tables.is_empty()) {
-            return placeholder("No tables");
-        }
-
-        let multi = clients.len() > 1;
-        let mut entries = Vec::new();
-        for (client_name, tables) in clients {
-            if multi {
-                entries.push(ContextMenuEntry::Header(client_name.clone()));
-            }
-
-            for table in tables {
-                let on_select = {
-                    clone!(client_name, table);
-                    ctx.link().callback(move |_| {
-                        PanelMenuMsg::Command(PanelCommand::NewFrom {
-                            client: client_name.clone(),
-                            table: table.clone(),
-                        })
-                    })
-                };
-
-                entries.push(ContextMenuEntry::Item(ContextMenuItem {
-                    label: table.clone(),
-                    on_select,
-                    disabled: false,
-                }));
-            }
-        }
+    /// The "New" hover sub-menu's body, the shared [`NewPanelMenu`].
+    fn new_submenu_body(&self, ctx: &Context<Self>) -> Html {
+        let panels = Rc::new(
+            ctx.props()
+                .workspace
+                .panel_ids()
+                .into_iter()
+                .filter_map(|id| {
+                    let panel = ctx.props().workspace.panel(&id)?;
+                    let title = panel.session.get_title().filter(|t| !t.is_empty());
+                    Some((id.as_str().to_owned(), title))
+                })
+                .collect::<Vec<_>>(),
+        );
+
+        let callback = ctx.link().batch_callback(|pick: NewPanelPick| {
+            let cmd = match pick {
+                NewPanelPick::FromTable { client, table } => {
+                    PanelMenuMsg::Command(PanelCommand::NewFrom { client, table })
+                },
+                NewPanelPick::FromPanel(id) => {
+                    PanelMenuMsg::Command(PanelCommand::NewFromPanel(id))
+                },
+            };
+
+            vec![cmd, PanelMenuMsg::MenuClosed]
+        });
 
-        entries
+        html! { <NewPanelMenu tables={self.tables.clone()} {panels} {callback} /> }
     }
 
     /// Export/Copy format-picker spawned in place of the context menu, anchored
@@ -462,7 +435,7 @@ impl PanelMenu {
             <PortalModal
                 key={tag_name}
                 {tag_name}
-                surface={StyleSurface::DropdownMenu}
+                sheet={StyleSurface::DropdownMenu.sheet()}
                 {target}
                 own_focus=true
                 {on_close}
@@ -474,20 +447,21 @@ impl PanelMenu {
     }
 }
 
-/// Create a session-long 0×0 anchor element at viewport `(x, y)`, appended to
-/// `<body>`, for both stages' `PortalModal`s to position against.
-fn session_anchor(x: f64, y: f64) -> HtmlElement {
+/// Create the session-long 0×0 cursor anchor at viewport `(x, y)` as a
+/// light-DOM child of `viewer` in the modal slot.
+fn session_anchor(viewer: &HtmlElement, x: f64, y: f64) -> HtmlElement {
     let anchor: HtmlElement = global::document()
         .create_element("div")
         .unwrap()
         .unchecked_into();
 
+    let _ = anchor.set_attribute("slot", MODAL_SLOT);
     let style = anchor.style();
     let _ = style.set_property("position", "fixed");
     let _ = style.set_property("left", &format!("{x}px"));
     let _ = style.set_property("top", &format!("{y}px"));
     let _ = style.set_property("width", "0px");
     let _ = style.set_property("height", "0px");
-    let _ = global::body().append_child(&anchor);
+    let _ = viewer.append_child(&anchor);
     anchor
 }