@perspective-dev/viewer 4.2.0 → 4.3.0

package/src/rust/js/plugin.rs

@@ -10,6 +10,7 @@
 // ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
 // ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
 
+use perspective_client::config::GroupRollupMode;
 use perspective_js::utils::*;
 use serde::*;
 use wasm_bindgen::prelude::*;
@@ -61,6 +62,9 @@ extern "C" {
     #[wasm_bindgen(method, getter)]
     pub fn priority(this: &JsPerspectiveViewerPlugin) -> Option<i32>;
 
+    #[wasm_bindgen(method, getter)]
+    pub fn group_rollups(this: &JsPerspectiveViewerPlugin) -> Option<js_sys::Array>;
+
     /// Don't call this method directly. Instead, call the corresponding method on the PluginColumnStyles model.
     #[wasm_bindgen(method, catch)]
     pub fn can_render_column_styles(this: &JsPerspectiveViewerPlugin, view_type: &str, group: Option<&str>) -> ApiResult<bool>;
@@ -146,6 +150,7 @@ pub struct ViewConfigRequirements {
     pub max_cells: Option<usize>,
     pub name: String,
     pub render_warning: bool,
+    group_rollups: Option<Vec<GroupRollupMode>>,
 }
 
 impl ViewConfigRequirements {
@@ -155,6 +160,17 @@ impl ViewConfigRequirements {
             .map(|x| index < x.len() - 1)
             .unwrap_or(false)
     }
+
+    pub fn get_group_rollups(&self, rollup_features: &[GroupRollupMode]) -> Vec<GroupRollupMode> {
+        self.group_rollups
+            .clone()
+            .map(|x| {
+                x.into_iter()
+                    .filter(|y| rollup_features.is_empty() || rollup_features.contains(y))
+                    .collect()
+            })
+            .unwrap_or_default()
+    }
 }
 
 impl JsPerspectiveViewerPlugin {
@@ -169,6 +185,9 @@ impl JsPerspectiveViewerPlugin {
             max_cells: self.max_cells(),
             name: self.name(),
             render_warning: self.render_warning().unwrap_or(true),
+            group_rollups: self
+                .group_rollups()
+                .map(|x| x.into_serde_ext::<Vec<GroupRollupMode>>().unwrap()),
         })
     }
 }

package/src/rust/model/intersection_observer.rs

@@ -38,8 +38,9 @@ impl IntersectionObserverHandle {
     ) -> Self {
         clone!(session, renderer, presentation);
         let _callback = Closure::new(move |xs: js_sys::Array| {
+            // https://stackoverflow.com/questions/53862160/intersectionobserver-multiple-entries
             let intersect = xs
-                .get(0)
+                .pop()
                 .unchecked_into::<IntersectionObserverEntry>()
                 .is_intersecting();
 
@@ -49,6 +50,7 @@ impl IntersectionObserverHandle {
                 session,
                 renderer,
             };
+
             ApiFuture::spawn(state.set_pause(intersect));
         });
 

package/src/rust/renderer/registry.rs

@@ -102,7 +102,14 @@ pub impl LocalKey<Rc<RefCell<Vec<PluginRecord>>>> {
                     .unwrap_or_else(|| "Custom".to_owned()),
                 priority: plugin_inst.priority().unwrap_or_default(),
             };
+
             let mut plugins = plugin.borrow_mut();
+            if let Some(first) = plugins.first()
+                && first.tag_name.as_str() == "perspective-viewer-plugin"
+            {
+                plugins.clear();
+            }
+
             plugins.push(record);
             plugins.sort_by(|a, b| Ord::cmp(&b.priority, &a.priority));
         });
@@ -121,7 +128,7 @@ fn register_default() {
                 name: "Debug".to_owned(),
                 category: "Custom".to_owned(),
                 tag_name: "perspective-viewer-plugin".to_owned(),
-                priority: 0,
+                priority: -1,
             })
         }
     })

package/src/rust/session/column_defaults_update.rs

@@ -31,6 +31,24 @@ pub impl ViewConfigUpdate {
         columns: &[Option<String>],
         requirements: &ViewConfigRequirements,
     ) {
+        let rollup_features = metadata
+            .get_features()
+            .map(|x| x.get_group_rollup_modes())
+            .unwrap_or_default();
+
+        let group_rollups = requirements.get_group_rollups(&rollup_features);
+        if !group_rollups.contains(
+            self.group_rollup_mode
+                .as_ref()
+                .unwrap_or(&GroupRollupMode::Rollup),
+        ) {
+            self.group_rollup_mode = group_rollups.first().cloned();
+            tracing::error!(
+                "Setting plugin-advised rollup mode {:?}",
+                self.group_rollup_mode
+            );
+        }
+
         if let (
             None,
             ViewConfigRequirements {

package/src/rust/session/replace_expression_update.rs

@@ -125,6 +125,7 @@ pub impl ViewConfig {
             filter: Some(filter),
             filter_op: None,
             group_by_depth: None,
+            group_rollup_mode: None,
         }
     }
 }

package/src/themes/botanical.less

@@ -0,0 +1,142 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ 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). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+@import "icons.less";
+@import "intl.less";
+
+@import url("ref://pro.less");
+
+// Register theme for auto-detection
+perspective-viewer,
+perspective-viewer[theme="Botanical"] {
+    --theme-name: "Botanical";
+}
+
+perspective-viewer[theme="Botanical"] {
+    @include perspective-viewer-botanical;
+}
+
+perspective-copy-menu[theme="Botanical"],
+perspective-export-menu[theme="Botanical"],
+perspective-dropdown[theme="Botanical"],
+perspective-date-column-style[theme="Botanical"],
+perspective-datetime-column-style[theme="Botanical"],
+perspective-number-column-style[theme="Botanical"],
+perspective-string-column-style[theme="Botanical"] {
+    @include perspective-modal-botanical;
+}
+
+@mixin perspective-viewer-botanical {
+    @include perspective-viewer-pro;
+    @include perspective-viewer-botanical--colors;
+    @include perspective-viewer-botanical--datagrid;
+    @include perspective-viewer-botanical--d3fc;
+    @include perspective-viewer-botanical--openlayers;
+}
+
+@mixin perspective-modal-botanical {
+    @include perspective-modal-pro;
+    @include perspective-viewer-botanical--colors;
+
+    background-color: #1a2e1a;
+    border: 1px solid #3d5c3d;
+}
+
+@mixin perspective-viewer-botanical--colors {
+    background-color: #1a2e1a;
+    color: #e0ead8;
+    --icon--color: #e0ead8;
+    --active--color: #5a9e4b;
+    --error--color: #e8836a;
+    --inactive--color: #526b4a;
+    --inactive--border-color: #3d5c3d;
+    --plugin--background: #1a2e1a;
+    --modal-target--background: rgba(224, 234, 216, 0.05);
+    --active--background: rgba(90, 158, 75, 0.5);
+    --expression--operator-color: #b8c9ad;
+    --expression--function-color: #7bc96f;
+    --expression--error-color: rgb(232, 131, 106);
+    --calendar--filter: invert(1);
+    --warning--color: #1a2e1a;
+    --warning--background: var(--icon--color);
+
+    --select-arrow--background-image: var(
+        --select-arrow-light--background-image
+    );
+
+    --select-arrow--hover--background-image: var(
+        --select-arrow-dark--background-image
+    );
+
+    // Syntax
+    --code-editor-symbol--color: #e0ead8;
+    --code-editor-literal--color: #a8d8a0;
+    --code-editor-operator--color: rgb(206, 176, 104);
+    --code-editor-comment--color: rgb(120, 160, 100);
+    --code-editor-column--color: #c9a0d8;
+}
+
+@mixin perspective-viewer-botanical--openlayers {
+    --map-tile-url: "http://{a-c}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png";
+    --map-attribution--filter: invert(1) hue-rotate(180deg);
+    --map-element-background: #1e3420;
+    --map-category-1: rgb(90, 158, 75);
+    --map-category-2: rgb(206, 176, 104);
+    --map-category-3: rgb(160, 110, 180);
+    --map-category-4: rgb(80, 170, 150);
+    --map-category-5: rgb(140, 170, 90);
+    --map-category-6: rgb(200, 120, 140);
+    --map-category-7: rgb(100, 150, 190);
+    --map-category-8: rgb(210, 140, 80);
+    --map-category-9: rgb(130, 120, 190);
+    --map-category-10: rgb(170, 200, 110);
+    --map-gradient: linear-gradient(#e8836a 0%, #1a2e1a 50%, #5a9e4b 100%);
+}
+
+@mixin perspective-viewer-botanical--datagrid {
+    --rt-pos-cell--color: #7bc96f;
+    --rt-neg-cell--color: #ebac21;
+}
+
+@mixin perspective-viewer-botanical--d3fc {
+    --d3fc-legend--text: #b8c9ad;
+    --d3fc-treedata--labels: #e0ead8;
+    --d3fc-treedata--hover-highlight: #e0ead8;
+    --d3fc-tooltip--color: #e0ead8;
+    --d3fc-axis-ticks--color: #b8c9ad;
+    --d3fc-axis--lines: #526b4a;
+    --d3fc-gridline--color: #2a4228;
+    --d3fc-tooltip--background: rgba(30, 52, 32, 1);
+    --d3fc-tooltip--border-color: #1a2e1a;
+    --d3fc-legend--background: var(--plugin--background);
+
+    --d3fc-series: rgb(90, 158, 75);
+    --d3fc-series-1: rgb(90, 158, 75);
+    --d3fc-series-2: rgb(206, 176, 104);
+    --d3fc-series-3: rgb(160, 110, 180);
+    --d3fc-series-4: rgb(80, 170, 150);
+    --d3fc-series-5: rgb(140, 170, 90);
+    --d3fc-series-6: rgb(200, 120, 140);
+    --d3fc-series-7: rgb(100, 150, 190);
+    --d3fc-series-8: rgb(210, 140, 80);
+    --d3fc-series-9: rgb(130, 120, 190);
+    --d3fc-series-10: rgb(170, 200, 110);
+
+    --d3fc-full--gradient: linear-gradient(
+        #e8836a 0%,
+        #1a2e1a 50%,
+        #5a9e4b 100%
+    );
+
+    --d3fc-positive--gradient: linear-gradient(#1a2e1a 0%, #5a9e4b 100%);
+    --d3fc-negative--gradient: linear-gradient(#e8836a 0%, #1a2e1a 100%);
+}

package/src/themes/themes.less

@@ -18,4 +18,5 @@
 @import "vaporwave.less";
 @import "gruvbox.less";
 @import "gruvbox-dark.less";
-@import "dracula.less";
+@import "dracula.less";
+@import "botanical.less";

package/src/ts/extensions.ts

@@ -14,7 +14,41 @@ import type { HTMLPerspectiveViewerPluginElement } from "./plugin";
 import type { PerspectiveViewerElement } from "../../dist/wasm/perspective-viewer.js";
 import type React from "react";
 import type { ViewerConfigUpdate } from "./ts-rs/ViewerConfigUpdate.js";
-import type { ViewWindow } from "@perspective-dev/client";
+import type {
+    ViewWindow,
+    ViewConfigUpdate,
+    Filter,
+} from "@perspective-dev/client";
+
+export class PerspectiveSelectDetail {
+    selected: boolean;
+    row: Record<string, unknown>;
+    column_names?: string[];
+    removeConfigs: ViewConfigUpdate[];
+    insertConfigs: ViewConfigUpdate[];
+
+    constructor(
+        selected: boolean,
+        row: Record<string, unknown>,
+        column_names: string[],
+        removeConfigs: ViewConfigUpdate[],
+        insertConfigs: ViewConfigUpdate[],
+    ) {
+        this.selected = selected;
+        this.row = row;
+        this.column_names = column_names;
+        this.removeConfigs = removeConfigs;
+        this.insertConfigs = insertConfigs;
+    }
+
+    get removeFilters(): Filter[] {
+        return this.removeConfigs.flatMap((x) => x.filter ?? []);
+    }
+
+    get insertFilters(): Filter[] {
+        return this.insertConfigs.flatMap((x) => x.filter ?? []);
+    }
+}
 import type {
     ExportDropDownMenuElement,
     CopyDropDownMenuElement,
@@ -48,11 +82,15 @@ export type PerspectiveSelectEventDetail = {
 
 type ReactPerspectiveViewerAttributes<T> = React.HTMLAttributes<T>;
 
-type JsxPerspectiveViewerElement = { class?: string } & React.DetailedHTMLProps<
+type JsxPerspectiveViewerElement = {
+    class?: string;
+} & React.DetailedHTMLProps<
     ReactPerspectiveViewerAttributes<HTMLPerspectiveViewerElement>,
     HTMLPerspectiveViewerElement
 >;
 
+// React <19
+
 declare global {
     namespace JSX {
         interface IntrinsicElements {
@@ -61,6 +99,39 @@ declare global {
     }
 }
 
+// React >=19
+
+// Why are these `ts-ignore`? React 19 makes choice of JSX runtime in `tsconfig`
+// the determination of which runtime this needs to be, but this is chosen
+// by the user ... so I'm not sure what the React authors want from me here
+// exactly. Divination?
+
+// @ts-ignore
+declare module "react/jsx-runtime" {
+    namespace JSX {
+        interface IntrinsicElements {
+            "perspective-viewer": JsxPerspectiveViewerElement;
+        }
+    }
+}
+
+// @ts-ignore
+declare module "react/jsx-dev-runtime" {
+    namespace JSX {
+        interface IntrinsicElements {
+            "perspective-viewer": JsxPerspectiveViewerElement;
+        }
+    }
+}
+
+declare module "react" {
+    namespace JSX {
+        interface IntrinsicElements {
+            "perspective-viewer": JsxPerspectiveViewerElement;
+        }
+    }
+}
+
 // Custom Elements extensions
 
 declare global {

package/src/ts/perspective-viewer.ts

@@ -35,6 +35,7 @@ export { IPerspectiveViewerPlugin } from "./plugin";
 export { HTMLPerspectiveViewerPluginElement } from "./plugin";
 
 export type * from "./extensions.ts";
+export { PerspectiveSelectDetail } from "./extensions.ts";
 export type * from "./ts-rs/ViewerConfigUpdate.d.ts";
 export type * from "./ts-rs/ColumnConfigValues.d.ts";
 export type * from "./ts-rs/Filter.d.ts";

package/src/ts/ts-rs/GroupRollupMode.ts

@@ -0,0 +1,3 @@
+// This file was generated by [ts-rs](https://github.com/Aleph-Alpha/ts-rs). Do not edit this file manually.
+
+export type GroupRollupMode = "rollup" | "flat" | "total";

package/src/ts/ts-rs/ViewerConfigUpdate.ts

@@ -4,6 +4,7 @@ import type { ColumnConfigValues } from "./ColumnConfigValues.js";
 import type { Expressions } from "./Expressions.js";
 import type { Filter } from "./Filter.js";
 import type { FilterReducer } from "./FilterReducer.js";
+import type { GroupRollupMode } from "./GroupRollupMode.js";
 import type { OptionalUpdate } from "./OptionalUpdate.js";
 import type { PluginConfig } from "./PluginConfig.js";
 import type { Sort } from "./Sort.js";
@@ -87,4 +88,4 @@ expressions?: Expressions,
  * applied to columns in the `View` constructor using a dictionary of
  * column name to aggregate function name.
  */
-aggregates?: { [key in string]?: Aggregate }, group_by_depth?: number, filter_op?: FilterReducer, };
+aggregates?: { [key in string]?: Aggregate }, group_by_depth?: number, filter_op?: FilterReducer, group_rollup_mode?: GroupRollupMode, };

package/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "jsx": "preserve",
         "strict": true,
         "module": "ESNext",
         "target": "ESNext",