@perspective-dev/viewer 5.3.1 → 5.5.0

package/src/rust/utils/local_fonts.rs

@@ -0,0 +1,395 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ 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). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+//! Page-global Local Font Access state shared by every `Font`
+//! control on the page: the `local-fonts` permission, the enumerated
+//! family list once granted, and a measured web-safe fallback list
+//! otherwise.
+
+use std::cell::{Cell, RefCell};
+use std::rc::Rc;
+
+use perspective_js::utils::global;
+use wasm_bindgen::prelude::*;
+use wasm_bindgen_futures::JsFuture;
+use yew::Callback;
+
+use super::{PubSub, Subscription};
+
+/// CSS generic families always offered first, in this order.
+pub const GENERIC_FONT_FAMILIES: [&str; 5] =
+    ["inherit", "monospace", "sans-serif", "serif", "system-ui"];
+
+const FALLBACK_FONT_FAMILIES: [&str; 28] = [
+    "Arial",
+    "Arial Black",
+    "Calibri",
+    "Cambria",
+    "Comic Sans MS",
+    "Consolas",
+    "Courier New",
+    "DejaVu Sans",
+    "DejaVu Serif",
+    "Georgia",
+    "Helvetica",
+    "Helvetica Neue",
+    "Impact",
+    "Liberation Sans",
+    "Liberation Serif",
+    "Lucida Console",
+    "Menlo",
+    "Monaco",
+    "Noto Sans",
+    "Noto Serif",
+    "Roboto",
+    "SF Mono",
+    "Segoe UI",
+    "Tahoma",
+    "Times New Roman",
+    "Trebuchet MS",
+    "Ubuntu",
+    "Verdana",
+];
+
+const FONT_TEST_SAMPLE: &str = "mmmmmmmmmmlli ABCDΔ 0123";
+const FONT_TEST_BASELINES: [&str; 3] = ["monospace", "sans-serif", "serif"];
+
+/// The `local-fonts` permission as last observed.
+#[derive(Clone, Copy, Debug, Eq, PartialEq)]
+pub enum LocalFontsAccess {
+    /// No `window.queryLocalFonts` (non-Chromium, or insecure context).
+    Unsupported,
+    Prompt,
+    Granted,
+    Denied,
+}
+
+#[derive(Default)]
+struct LocalFontsState {
+    access: Cell<Option<LocalFontsAccess>>,
+    probing: Cell<bool>,
+    families: RefCell<Option<Rc<Vec<String>>>>,
+    fallback: RefCell<Option<Rc<Vec<String>>>>,
+    on_status_change: RefCell<Option<Closure<dyn Fn()>>>,
+    changed: PubSub<()>,
+}
+
+thread_local! {
+    static STATE: LocalFontsState = LocalFontsState::default();
+}
+
+/// The permission state, or `None` before [`probe_local_fonts_access`]
+/// has resolved.
+pub fn local_fonts_access() -> Option<LocalFontsAccess> {
+    STATE.with(|s| s.access.get())
+}
+
+/// Subscribe to any change in access state or family list.
+pub fn on_local_fonts_changed(cb: Callback<()>) -> Subscription {
+    STATE.with(|s| s.changed.add_notify_listener(&cb))
+}
+
+/// The options a `Font` control offers for `current`: the generic
+/// keywords, then the enumerated families when granted (and non-empty) or
+/// the measured fallback otherwise, then `current` itself if absent.
+pub fn font_family_options(current: &str) -> Vec<String> {
+    let installed = STATE.with(|s| {
+        let enumerated = match s.access.get() {
+            Some(LocalFontsAccess::Granted) => s.families.borrow().clone(),
+            _ => None,
+        };
+
+        match enumerated {
+            Some(families) if !families.is_empty() => families,
+            _ => fallback_families(s),
+        }
+    });
+
+    compose_font_family_options(current, &installed)
+}
+
+fn compose_font_family_options(current: &str, installed: &[String]) -> Vec<String> {
+    let mut out: Vec<String> = GENERIC_FONT_FAMILIES
+        .iter()
+        .map(|x| (*x).to_owned())
+        .collect();
+
+    out.extend(installed.iter().cloned());
+    if !out.iter().any(|x| x == current) {
+        out.push(current.to_owned());
+    }
+
+    out
+}
+
+/// Resolve the permission state once, without ever showing a prompt.
+pub fn probe_local_fonts_access() {
+    let already = STATE.with(|s| s.access.get().is_some() || s.probing.replace(true));
+    if already {
+        return;
+    }
+
+    if query_local_fonts_fn().is_none() {
+        set_access(LocalFontsAccess::Unsupported);
+        return;
+    }
+
+    wasm_bindgen_futures::spawn_local(async move {
+        match query_permission_status().await {
+            Some(status) => {
+                install_status_listener(&status);
+                let access = access_of_status(&status);
+                set_access(access);
+                if access == LocalFontsAccess::Granted {
+                    load_families().await;
+                }
+            },
+            None => match call_query_local_fonts() {
+                Some(promise) => match families_from(promise).await {
+                    Some(families) => set_granted(families),
+                    None => set_access(LocalFontsAccess::Prompt),
+                },
+                None => set_access(LocalFontsAccess::Unsupported),
+            },
+        }
+    });
+}
+
+/// Ask the browser for local fonts, synchronously from a user-gesture handler
+/// so `queryLocalFonts()` may prompt.
+pub fn request_local_fonts_access() {
+    let Some(promise) = call_query_local_fonts() else {
+        set_access(LocalFontsAccess::Unsupported);
+        return;
+    };
+
+    wasm_bindgen_futures::spawn_local(async move {
+        match families_from(promise).await {
+            Some(families) => set_granted(families),
+            None => {
+                let access = match query_permission_status().await {
+                    Some(status) => access_of_status(&status),
+                    None => LocalFontsAccess::Prompt,
+                };
+
+                set_access(access);
+            },
+        }
+    });
+}
+
+fn set_access(access: LocalFontsAccess) {
+    STATE.with(|s| {
+        s.probing.set(false);
+        let prev = s.access.replace(Some(access));
+        if access != LocalFontsAccess::Granted {
+            s.families.borrow_mut().take();
+        }
+
+        if prev != Some(access) {
+            s.changed.emit(());
+        }
+    });
+}
+
+fn set_granted(families: Vec<String>) {
+    STATE.with(|s| {
+        s.probing.set(false);
+        s.access.set(Some(LocalFontsAccess::Granted));
+        *s.families.borrow_mut() = Some(Rc::new(families));
+        s.changed.emit(());
+    });
+}
+
+async fn load_families() {
+    if let Some(promise) = call_query_local_fonts()
+        && let Some(families) = families_from(promise).await
+    {
+        set_granted(families);
+    }
+}
+
+fn query_local_fonts_fn() -> Option<js_sys::Function> {
+    js_sys::Reflect::get(&global::window(), &JsValue::from_str("queryLocalFonts"))
+        .ok()?
+        .dyn_into::<js_sys::Function>()
+        .ok()
+}
+
+fn call_query_local_fonts() -> Option<js_sys::Promise> {
+    query_local_fonts_fn()?
+        .call0(&global::window())
+        .ok()?
+        .dyn_into::<js_sys::Promise>()
+        .ok()
+}
+
+/// The enumerated families, or `None` when the call yielded none, which
+/// Chromium resolves in place of rejecting a dismissed or blocked prompt.
+async fn families_from(promise: js_sys::Promise) -> Option<Vec<String>> {
+    let fonts = JsFuture::from(promise).await.ok()?;
+    let family_key = JsValue::from_str("family");
+    let mut families: Vec<String> = js_sys::Array::from(&fonts)
+        .iter()
+        .filter_map(|font| js_sys::Reflect::get(&font, &family_key).ok()?.as_string())
+        .collect();
+
+    families.sort_unstable();
+    families.dedup();
+    (!families.is_empty()).then_some(families)
+}
+
+async fn query_permission_status() -> Option<JsValue> {
+    let navigator: JsValue = global::window().navigator().into();
+    let permissions = js_sys::Reflect::get(&navigator, &JsValue::from_str("permissions")).ok()?;
+    let query = js_sys::Reflect::get(&permissions, &JsValue::from_str("query"))
+        .ok()?
+        .dyn_into::<js_sys::Function>()
+        .ok()?;
+
+    let descriptor = js_sys::Object::new();
+    js_sys::Reflect::set(
+        &descriptor,
+        &JsValue::from_str("name"),
+        &JsValue::from_str("local-fonts"),
+    )
+    .ok()?;
+
+    let promise = query
+        .call1(&permissions, &descriptor)
+        .ok()?
+        .dyn_into::<js_sys::Promise>()
+        .ok()?;
+
+    let status = JsFuture::from(promise).await.ok()?;
+    (!status.is_undefined() && !status.is_null()).then_some(status)
+}
+
+fn access_of_status(status: &JsValue) -> LocalFontsAccess {
+    let state = js_sys::Reflect::get(status, &JsValue::from_str("state"))
+        .ok()
+        .and_then(|x| x.as_string());
+
+    match state.as_deref() {
+        Some("granted") => LocalFontsAccess::Granted,
+        Some("denied") => LocalFontsAccess::Denied,
+        _ => LocalFontsAccess::Prompt,
+    }
+}
+
+fn install_status_listener(status: &JsValue) {
+    let target = status.clone();
+    let closure = Closure::<dyn Fn()>::new(move || {
+        let access = access_of_status(&target);
+        set_access(access);
+        if access == LocalFontsAccess::Granted {
+            wasm_bindgen_futures::spawn_local(load_families());
+        }
+    });
+
+    let _ = js_sys::Reflect::set(
+        status,
+        &JsValue::from_str("onchange"),
+        closure.as_ref().unchecked_ref(),
+    );
+
+    STATE.with(|s| *s.on_status_change.borrow_mut() = Some(closure));
+}
+
+fn fallback_families(state: &LocalFontsState) -> Rc<Vec<String>> {
+    state
+        .fallback
+        .borrow_mut()
+        .get_or_insert_with(|| Rc::new(detect_fallback_families()))
+        .clone()
+}
+
+/// The subset of [`FALLBACK_FONT_FAMILIES`] the browser can render,
+/// detected by comparing rendered widths against the generic baselines.
+fn detect_fallback_families() -> Vec<String> {
+    let Some(ctx) = canvas_context() else {
+        return vec![];
+    };
+
+    let baselines: Vec<f64> = FONT_TEST_BASELINES
+        .iter()
+        .map(|x| measure_width(&ctx, x))
+        .collect();
+
+    FALLBACK_FONT_FAMILIES
+        .iter()
+        .filter(|family| {
+            FONT_TEST_BASELINES
+                .iter()
+                .zip(&baselines)
+                .any(|(baseline, width)| {
+                    measure_width(&ctx, &format!("\"{family}\", {baseline}")) != *width
+                })
+        })
+        .map(|x| (*x).to_owned())
+        .collect()
+}
+
+fn canvas_context() -> Option<web_sys::CanvasRenderingContext2d> {
+    global::document()
+        .create_element("canvas")
+        .ok()?
+        .dyn_into::<web_sys::HtmlCanvasElement>()
+        .ok()?
+        .get_context("2d")
+        .ok()??
+        .dyn_into::<web_sys::CanvasRenderingContext2d>()
+        .ok()
+}
+
+fn measure_width(ctx: &web_sys::CanvasRenderingContext2d, family: &str) -> f64 {
+    ctx.set_font(&format!("72px {family}"));
+    ctx.measure_text(FONT_TEST_SAMPLE)
+        .map(|x| x.width())
+        .unwrap_or_default()
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    fn owned(xs: &[&str]) -> Vec<String> {
+        xs.iter().map(|x| (*x).to_owned()).collect()
+    }
+
+    #[test]
+    fn generic_families_lead_and_current_appends_when_missing() {
+        let options = compose_font_family_options("Zapf Chancery", &owned(&["Arial", "Menlo"]));
+        assert_eq!(
+            options,
+            owned(&[
+                "inherit",
+                "monospace",
+                "sans-serif",
+                "serif",
+                "system-ui",
+                "Arial",
+                "Menlo",
+                "Zapf Chancery"
+            ])
+        );
+    }
+
+    #[test]
+    fn current_is_not_duplicated() {
+        let options = compose_font_family_options("Arial", &owned(&["Arial"]));
+        assert_eq!(options.iter().filter(|x| *x == "Arial").count(), 1);
+
+        let options = compose_font_family_options("inherit", &[]);
+        assert_eq!(options, owned(&GENERIC_FONT_FAMILIES));
+    }
+}

package/src/rust/utils/mod.rs

@@ -18,11 +18,13 @@
 
 mod browser;
 mod completion;
+mod css;
 mod css_vars;
 mod custom_element;
 mod datetime;
 mod debounce;
 mod hooks;
+mod local_fonts;
 mod modal_position;
 mod number_format;
 mod pending_effects;
@@ -36,11 +38,13 @@ mod tests;
 
 pub use browser::*;
 pub use completion::*;
+pub use css::*;
 pub use css_vars::*;
 pub use custom_element::*;
 pub use datetime::*;
 pub use debounce::*;
 pub use hooks::*;
+pub use local_fonts::*;
 pub use modal_position::*;
 pub use number_format::*;
 pub use pending_effects::*;

package/src/rust/workspace.rs

@@ -327,6 +327,16 @@ struct WorkspaceData {
     /// Fires on every [`PanelPhase`] transition.
     staged_changed: Rc<PubSub<()>>,
 
+    /// Fires when a layout tree is staged for a RETAINED panel set (a
+    /// `panels`-less `restoreWorkspace`), whose props-driven render would
+    /// otherwise never consume it.
+    layout_staged: Rc<PubSub<()>>,
+
+    /// Panels removed from `panels` whose layout cell has not yet been
+    /// reclaimed, so their engines and plugin pixels stay alive until the
+    /// commit.
+    closing: Vec<Panel>,
+
     /// Coalesced `layout_changed`/`active_changed` delivery (see
     /// [`LayoutEmitter`]).
     emitter: LayoutEmitter,
@@ -352,6 +362,8 @@ impl Workspace {
             pending_layout: None,
             effects: EffectLedger::default(),
             staged_changed: Rc::new(PubSub::default()),
+            layout_staged: Rc::new(PubSub::default()),
+            closing: Vec::new(),
             emitter: LayoutEmitter::default(),
         })))
     }
@@ -414,6 +426,12 @@ impl Workspace {
         self.0.borrow().staged_changed.clone()
     }
 
+    /// A handle to the `layout_staged` PubSub (see
+    /// [`WorkspaceData::layout_staged`]).
+    pub fn layout_staged(&self) -> Rc<PubSub<()>> {
+        self.0.borrow().layout_staged.clone()
+    }
+
     /// Promote a staged panel toward layout insertion, returning whether it
     /// was still staged — restore completion and the staging deadline RACE
     /// to promote, and only the winner proceeds. Emits `staged_changed` —
@@ -823,6 +841,35 @@ impl Workspace {
         removed
     }
 
+    /// Park a panel just removed by [`Self::remove_panel`] until its layout
+    /// cell is reclaimed (see [`WorkspaceData::closing`]).
+    pub fn stash_closing(&self, panel: Panel) {
+        self.0.borrow_mut().closing.push(panel);
+    }
+
+    /// A parked closing panel by id (clone; shares engine state).
+    pub fn closing_panel(&self, id: &PanelId) -> Option<Panel> {
+        self.0
+            .borrow()
+            .closing
+            .iter()
+            .find(|p| &p.id == id)
+            .cloned()
+    }
+
+    /// Un-park a closing panel for disposal, once its cell is gone.
+    pub fn take_closing(&self, id: &PanelId) -> Option<Panel> {
+        let mut data = self.0.borrow_mut();
+        let idx = data.closing.iter().position(|p| &p.id == id)?;
+        Some(data.closing.remove(idx))
+    }
+
+    /// Un-park EVERY closing panel — element teardown must dispose them
+    /// too, or their `View`/plugin would leak.
+    pub fn take_all_closing(&self) -> Vec<Panel> {
+        std::mem::take(&mut self.0.borrow_mut().closing)
+    }
+
     /// Set the active panel. Returns `false` (no-op) if `id` is not a known
     /// panel.
     pub fn set_active(&self, id: PanelId) -> bool {

package/src/svg/boolean-type.svg

@@ -1,3 +1,4 @@
-<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0.5 5.8V8C0.5 8.82843 1.17157 9.5 2 9.5H4.8C5.62843 9.5 6.3 8.82843 6.3 8V7.2C6.3 6.92386 6.52386 6.7 6.8 6.7H8C8.82843 6.7 9.5 6.02843 9.5 5.2V3C9.5 2.17157 8.82843 1.5 8 1.5H5.2C4.37157 1.5 3.7 2.17157 3.7 3V3.8C3.7 4.07614 3.47614 4.3 3.2 4.3H2C1.17157 4.3 0.5 4.97157 0.5 5.8Z" stroke="#042121"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="1.5" y="3.5" width="10" height="6" rx="3"/>
+    <circle cx="8.4" cy="6.5" r="1.9" fill="#042121" stroke="none"/>
 </svg>

package/src/svg/checkbox-checked-icon.svg

@@ -1,7 +1,4 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <defs></defs>
-    <path
-        d="M 2 0 L 12 0 C 13.105 0 14 0.895 14 2 L 14 12 C 14 13.105 13.105 14 12 14 L 2 14 C 0.895 14 0 13.105 0 12 L 0 2 C 0 0.895 0.895 0 2 0 Z M 3.646 7.354 L 5.646 9.354 L 6 9.707 L 6.354 9.354 L 10.854 4.854 L 10.146 4.146 L 6 8.293 L 4.354 6.646 Z"
-        fill="#000000"></path>
-    <path d="M4 7L6 9L10.5 4.5" style="visibility: hidden;"></path>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="0.5" y="0.5" width="13" height="13" rx="2"/>
+    <path d="M3.5 7l2.5 2.5 4.5-4.5" stroke-width="1.2"/>
+</svg>

package/src/svg/checkbox-hover.svg

@@ -1,4 +1,4 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect x="0.5" y="0.5" width="13" height="13" rx="1.5" stroke="#3F4343"/>
-<rect x="4" y="4" width="6" height="6" rx="2" fill="#3F4343"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="0.5" y="0.5" width="13" height="13" rx="2"/>
+    <circle cx="7" cy="7" r="1.5" fill="#042121" stroke="none"/>
 </svg>

package/src/svg/checkbox-off.svg

@@ -1,4 +1,3 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect x="0.5" y="0.5" width="13" height="13" rx="1.5" stroke="#3F4343"/>
-<rect x="5" y="5" width="4" height="4" rx="2" fill="#3F4343"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="0.5" y="0.5" width="13" height="13" rx="2"/>
 </svg>

package/src/svg/checkbox-on.svg

@@ -1,4 +1,4 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect x="0.5" y="0.5" width="13" height="13" rx="1.5" stroke="#3F4343"/>
-<rect x="2" y="2" width="10" height="10" rx="2" fill="#3F4343"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="0.5" y="0.5" width="13" height="13" rx="2"/>
+    <path d="M3.5 7l2.5 2.5 4.5-4.5" stroke-width="1.2"/>
 </svg>

package/src/svg/checkbox-unchecked-icon.svg

@@ -1,3 +1,3 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <rect x="0.5" y="0.5" width="13" height="13" rx="1.5" stroke="#000000" />
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="0.5" y="0.5" width="13" height="13" rx="2"/>
+</svg>

package/src/svg/datagrid-select-column.svg

@@ -1,15 +1,8 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <defs></defs>
-    <rect x="3" y="4" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="6.973" width="15" height="1"
-        style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;"></rect>
-    <rect x="3" y="10" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="13" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="16" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;" y="4" width="3" height="13" x="6">
-    </rect>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M3 4.5h15"/>
+    <path d="M3 7.5h15"/>
+    <path d="M3 10.5h15"/>
+    <path d="M3 13.5h15"/>
+    <path d="M3 16.5h15"/>
+    <rect x="6" y="4" width="3" height="13" fill="#042121" stroke="none"/>
+</svg>

package/src/svg/datagrid-select-region.svg

@@ -1,15 +1,8 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <defs></defs>
-    <rect x="3" y="4" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="6.973" width="15" height="1"
-        style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;"></rect>
-    <rect x="3" y="10" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="13" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="16" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;" y="7" width="6" height="7" x="6">
-    </rect>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M3 4.5h15"/>
+    <path d="M3 7.5h15"/>
+    <path d="M3 10.5h15"/>
+    <path d="M3 13.5h15"/>
+    <path d="M3 16.5h15"/>
+    <rect x="6" y="7" width="6" height="7" fill="#042121" stroke="none"/>
+</svg>

package/src/svg/datagrid-select-row-tree.svg

@@ -1,13 +1,8 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <defs></defs>
-    <rect x="3" y="4" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="5" y="6.973" width="13" height="4"
-        style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;"></rect>
-    <rect x="7" y="10" width="11" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="5" y="13" width="13" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="16" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
+<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M3 4.5h15"/>
+    <path d="M5 7.5h13"/>
+    <path d="M7 10.5h11"/>
+    <path d="M5 13.5h13"/>
+    <path d="M3 16.5h15"/>
+    <rect x="5" y="7" width="13" height="4" fill="#042121" stroke="none"/>
 </svg>

package/src/svg/datagrid-select-row.svg

@@ -1,13 +1,8 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <defs></defs>
-    <rect x="3" y="4" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="6.973" width="15" height="4"
-        style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;"></rect>
-    <rect x="3" y="10" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="13" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-    <rect x="3" y="16" width="15" height="1" style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); stroke-width: 0px;">
-    </rect>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M3 4.5h15"/>
+    <path d="M3 7.5h15"/>
+    <path d="M3 10.5h15"/>
+    <path d="M3 13.5h15"/>
+    <path d="M3 16.5h15"/>
+    <rect x="3" y="7" width="15" height="4" fill="#042121" stroke="none"/>
+</svg>