@perspective-dev/viewer 5.4.0 → 5.5.1

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

@@ -24,6 +24,8 @@ mod custom_element;
 mod datetime;
 mod debounce;
 mod hooks;
+mod in_flight;
+mod local_fonts;
 mod modal_position;
 mod number_format;
 mod pending_effects;
@@ -43,6 +45,8 @@ pub use custom_element::*;
 pub use datetime::*;
 pub use debounce::*;
 pub use hooks::*;
+pub use in_flight::*;
+pub use local_fonts::*;
 pub use modal_position::*;
 pub use number_format::*;
 pub use pending_effects::*;

package/src/rust/utils/pending_effects.rs

@@ -10,10 +10,7 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
-use std::cell::Cell;
-use std::rc::Rc;
-
-use super::pubsub::PubSub;
+use super::in_flight::{InFlight, InFlightGuard};
 
 /// The element-scoped ledger of in-flight EFFECTS: every effectful public
 /// method (and the internal flows they schedule, e.g. the `before-resize`
@@ -22,41 +19,20 @@ use super::pubsub::PubSub;
 /// after the ledger drains, so "called before `flush`" implies "applied
 /// before `flush` resolves".
 #[derive(Clone, Default)]
-pub struct EffectLedger(Rc<EffectLedgerData>);
-
-#[derive(Default)]
-struct EffectLedgerData {
-    count: Cell<u32>,
-    on_drain: PubSub<()>,
-}
+pub struct EffectLedger(InFlight);
 
-pub struct EffectGuard(EffectLedger);
+pub type EffectGuard = InFlightGuard;
 
 impl EffectLedger {
     pub fn guard(&self) -> EffectGuard {
-        self.0.count.set(self.0.count.get() + 1);
-        EffectGuard(self.clone())
+        self.0.guard()
     }
 
     pub fn is_empty(&self) -> bool {
-        self.0.count.get() == 0
+        self.0.is_empty()
     }
 
     pub async fn settle(&self) {
-        while self.0.count.get() > 0 {
-            if self.0.on_drain.read_next().await.is_err() {
-                break;
-            }
-        }
-    }
-}
-
-impl Drop for EffectGuard {
-    fn drop(&mut self) {
-        let data = &self.0.0;
-        data.count.set(data.count.get() - 1);
-        if data.count.get() == 0 {
-            data.on_drain.emit(());
-        }
+        self.0.settle().await
     }
 }

package/src/rust/workspace.rs

@@ -327,6 +327,11 @@ 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.
@@ -357,6 +362,7 @@ 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(),
         })))
@@ -420,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` —

package/src/svg/status_pending.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="#042121" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
+    <circle cx="10" cy="10" r="4.5" stroke-dasharray="2.36 2.36"/>
+</svg>

package/src/themes/icons.css

@@ -56,6 +56,7 @@ perspective-viewer-tab {
     --psp-icon--updating--mask-image: url("../svg/updating.gif");
     --psp-icon--downloading--mask-image: url("../svg/downloading.gif");
     --psp-icon--status-ok--mask-image: url(../svg/status_ok.svg);
+    --psp-icon--status-pending--mask-image: url(../svg/status_pending.svg);
     --psp-icon--export--mask-image: url("../svg/export-icon.svg");
     --psp-icon--free-scroll--mask-image: url("../svg/free-scroll-icon.svg");
     --psp-icon--lock--mask-image: url("../svg/lock.svg");

package/src/themes/intl/ar.css

@@ -69,16 +69,13 @@ perspective-viewer {
     --psp-label--scroll-lock-alt-toggle--content: "تمرير محاذى";
 
     --psp-label--color--content: "اللون";
-    --psp-label--format--content: "التنسيق";
     --psp-label--timezone--content: "المنطقة الزمنية";
     --psp-label--date-style--content: "نمط التاريخ";
     --psp-label--time-style--content: "نمط الوقت";
-    --psp-label--number-fg-mode--content: "المقدمة";
-    --psp-label--number-bg-mode--content: "الخلفية";
-    --psp-label--fg-colors--content: "المقدمة";
-    --psp-label--bg-colors--content: "الخلفية";
-    --psp-label--datetime-color-mode--content: "اللون";
-    --psp-label--string-color-mode--content: "اللون";
+    --psp-label--fg-mode--content: "المقدمة";
+    --psp-label--bg-mode--content: "الخلفية";
+    --psp-label--fg-color--content: "المقدمة";
+    --psp-label--bg-color--content: "الخلفية";
     --psp-label--series--content: "السلسلة";
     --psp-label--color-range--content: "نطاق الألوان";
     --psp-label--style--content: "النمط";
@@ -117,6 +114,7 @@ perspective-viewer {
     --psp-label--group-legend--content: "مفتاح الرسم";
     --psp-label--group-tooltip--content: "التلميحات";
     --psp-label--group-color--content: "اللون";
+    --psp-label--group-column--content: "العمود";
     --psp-label--group-format--content: "التنسيق";
     --psp-label--column-size-override--content: "عرض العمود";
 
@@ -150,6 +148,21 @@ perspective-viewer {
 
     --psp-label--edit-mode--content: "وضع التحرير";
     --psp-label--scroll-lock--content: "قفل التمرير";
+    --psp-label--column-menus--content: "قوائم الأعمدة";
+    --psp-label--group-font--content: "الخط";
+    --psp-label--group-rows--content: "الصفوف";
+    --psp-label--link--content: "رابط";
+    --psp-label--font-family--content: "عائلة الخط";
+    --psp-label--font-size--content: "حجم الخط";
+    --psp-label--request-local-fonts--content: "الخطوط المحلية";
+    --psp-label--local-fonts-blocked--content: "الخطوط المحلية محظورة";
+    --psp-label--request-local-fonts-title--content: "السماح بالوصول إلى الخطوط المثبتة على هذا الجهاز";
+    --psp-label--local-fonts-blocked-title--content: "الوصول إلى الخطوط المحلية محظور لهذا الموقع. اسمح به في إعدادات الموقع بالمتصفح لعرضها هنا.";
+    --psp-label--word-wrap--content: "التفاف النص";
+    --psp-label--align--content: "المحاذاة";
+    --psp-label--row-height--content: "ارتفاع الصف";
+    --psp-label--zebra-rows--content: "صفوف متناوبة";
+    --psp-label--zebra-color--content: "لون التناوب";
     --psp-label--chart-type--content: "نوع الشكل";
 
     --psp-label--auto-alt-y-axis--content: "محور Y تلقائي";

package/src/themes/intl/de.css

@@ -74,16 +74,13 @@ perspective-viewer {
 
     /* Column Settings */
     --psp-label--color--content: "Farbe";
-    --psp-label--format--content: "Format";
     --psp-label--timezone--content: "Zeitzone";
     --psp-label--date-style--content: "Datumsstil";
     --psp-label--time-style--content: "Zeitstil";
-    --psp-label--number-fg-mode--content: "Vordergrund";
-    --psp-label--number-bg-mode--content: "Hintergrund";
-    --psp-label--fg-colors--content: "Vordergrund";
-    --psp-label--bg-colors--content: "Hintergrund";
-    --psp-label--datetime-color-mode--content: "Farbe";
-    --psp-label--string-color-mode--content: "Farbe";
+    --psp-label--fg-mode--content: "Vordergrund";
+    --psp-label--bg-mode--content: "Hintergrund";
+    --psp-label--fg-color--content: "Vordergrund";
+    --psp-label--bg-color--content: "Hintergrund";
     --psp-label--series--content: "Serie";
     --psp-label--color-range--content: "Farbspektrum";
     --psp-label--style--content: "Stil";
@@ -148,6 +145,21 @@ perspective-viewer {
     /* Plugin settings */
     --psp-label--edit-mode--content: "Bearbeitungsmodus";
     --psp-label--scroll-lock--content: "Bildlaufsperre";
+    --psp-label--column-menus--content: "Spaltenmenüs";
+    --psp-label--group-font--content: "Schrift";
+    --psp-label--group-rows--content: "Zeilen";
+    --psp-label--link--content: "Link";
+    --psp-label--font-family--content: "Schriftfamilie";
+    --psp-label--font-size--content: "Schriftgröße";
+    --psp-label--request-local-fonts--content: "Lokale Schriften";
+    --psp-label--local-fonts-blocked--content: "Lokale Schriften blockiert";
+    --psp-label--request-local-fonts-title--content: "Zugriff auf die auf diesem Gerät installierten Schriften erlauben";
+    --psp-label--local-fonts-blocked-title--content: "Der Zugriff auf lokale Schriften ist für diese Website blockiert. Erlauben Sie ihn in den Website-Einstellungen des Browsers, um sie hier aufzulisten.";
+    --psp-label--word-wrap--content: "Zeilenumbruch";
+    --psp-label--align--content: "Ausrichtung";
+    --psp-label--row-height--content: "Zeilenhöhe";
+    --psp-label--zebra-rows--content: "Zebra-Zeilen";
+    --psp-label--zebra-color--content: "Zebra-Farbe";
     --psp-label--chart-type--content: "Glyphentyp";
 
     /* Plugin settings — viewer-charts */
@@ -189,6 +201,7 @@ perspective-viewer {
     --psp-label--group-legend--content: "Legende";
     --psp-label--group-tooltip--content: "Tooltips";
     --psp-label--group-color--content: "Farbe";
+    --psp-label--group-column--content: "Spalte";
     --psp-label--group-format--content: "Format";
     --psp-label--column-size-override--content: "Spaltenbreite";
 }

package/src/themes/intl/es.css

@@ -74,16 +74,13 @@ perspective-viewer {
 
     /* Column Settings */
     --psp-label--color--content: "Color";
-    --psp-label--format--content: "Formato";
     --psp-label--timezone--content: "Zona horaria";
     --psp-label--date-style--content: "Estilo de fecha";
     --psp-label--time-style--content: "Estilo de hora";
-    --psp-label--number-fg-mode--content: "Primer plano";
-    --psp-label--number-bg-mode--content: "Fondo";
-    --psp-label--fg-colors--content: "Primer plano";
-    --psp-label--bg-colors--content: "Fondo";
-    --psp-label--datetime-color-mode--content: "Color";
-    --psp-label--string-color-mode--content: "Color";
+    --psp-label--fg-mode--content: "Primer plano";
+    --psp-label--bg-mode--content: "Fondo";
+    --psp-label--fg-color--content: "Primer plano";
+    --psp-label--bg-color--content: "Fondo";
     --psp-label--series--content: "Serie";
     --psp-label--color-range--content: "Gama de colores";
     --psp-label--style--content: "Estilo";
@@ -148,6 +145,21 @@ perspective-viewer {
     /* Plugin settings */
     --psp-label--edit-mode--content: "Modo de edición";
     --psp-label--scroll-lock--content: "Bloqueo de desplazamiento";
+    --psp-label--column-menus--content: "Menús de columna";
+    --psp-label--group-font--content: "Fuente";
+    --psp-label--group-rows--content: "Filas";
+    --psp-label--link--content: "Enlace";
+    --psp-label--font-family--content: "Familia de fuente";
+    --psp-label--font-size--content: "Tamaño de fuente";
+    --psp-label--request-local-fonts--content: "Fuentes locales";
+    --psp-label--local-fonts-blocked--content: "Fuentes locales bloqueadas";
+    --psp-label--request-local-fonts-title--content: "Permitir el acceso a las fuentes instaladas en este dispositivo";
+    --psp-label--local-fonts-blocked-title--content: "El acceso a las fuentes locales está bloqueado para este sitio. Permítalo en la configuración del sitio del navegador para mostrarlas aquí.";
+    --psp-label--word-wrap--content: "Ajuste de línea";
+    --psp-label--align--content: "Alineación";
+    --psp-label--row-height--content: "Altura de fila";
+    --psp-label--zebra-rows--content: "Filas cebra";
+    --psp-label--zebra-color--content: "Color cebra";
     --psp-label--chart-type--content: "Tipo de glifo";
 
     /* Plugin settings — viewer-charts */
@@ -189,6 +201,7 @@ perspective-viewer {
     --psp-label--group-legend--content: "Leyenda";
     --psp-label--group-tooltip--content: "Descripciones emergentes";
     --psp-label--group-color--content: "Color";
+    --psp-label--group-column--content: "Columna";
     --psp-label--group-format--content: "Formato";
     --psp-label--column-size-override--content: "Ancho de columna";
 }