From f0bf7aa8f9d72163803b2c91e6473021280ed69a Mon Sep 17 00:00:00 2001 From: Andrew Stein Date: Sun, 2 Feb 2025 13:23:06 -0500 Subject: [PATCH 1/3] Fix API docs Signed-off-by: Andrew Stein --- rust/perspective-js/Cargo.toml | 1 + rust/perspective-python/Cargo.toml | 1 + 2 files changed, 2 insertions(+) diff --git a/rust/perspective-js/Cargo.toml b/rust/perspective-js/Cargo.toml index 87a2b29a08..f4aa86a07d 100644 --- a/rust/perspective-js/Cargo.toml +++ b/rust/perspective-js/Cargo.toml @@ -23,6 +23,7 @@ keywords = ["experimental"] include = ["src/**/*", "Cargo.toml", "./package.json", "docs/**/*", "build.rs"] [package.metadata.docs.rs] +features = ["external-docs"] rustc-args = ["--cfg", "web_sys_unstable_apis"] rustdoc-args = ["--html-in-header", "docs/index.html"] diff --git a/rust/perspective-python/Cargo.toml b/rust/perspective-python/Cargo.toml index d8b671069c..67e34f98a5 100644 --- a/rust/perspective-python/Cargo.toml +++ b/rust/perspective-python/Cargo.toml @@ -39,6 +39,7 @@ include = [ ] [package.metadata.docs.rs] +features = ["external-docs"] rustdoc-args = ["--html-in-header", "docs/index.html"] [features] From d9932be093ef842d324fc69320d27eb5d829cae4 Mon Sep 17 00:00:00 2001 From: Andrew Stein Date: Sun, 2 Feb 2025 14:13:55 -0500 Subject: [PATCH 2/3] Document custom themes, remove default label visibility Signed-off-by: Andrew Stein --- docs/md/SUMMARY.md | 1 + docs/md/how_to/javascript/custom_themes.md | 28 +++++++++++++++++++ .../src/less/config-selector.less | 2 +- rust/perspective-viewer/src/themes/pro.less | 1 - 4 files changed, 30 insertions(+), 2 deletions(-) create mode 100644 docs/md/how_to/javascript/custom_themes.md diff --git a/docs/md/SUMMARY.md b/docs/md/SUMMARY.md index 3a161513cc..9e39ef12e6 100644 --- a/docs/md/SUMMARY.md +++ b/docs/md/SUMMARY.md @@ -42,6 +42,7 @@ - [Hosting a `WebSocketServer` in Node.js](./how_to/javascript/nodejs_server.md) - [`perspective-viewer` Custom Element library](./how_to/javascript/viewer.md) - [Theming](./how_to/javascript/theming.md) + - [Custom Themes](./how_to/javascript/custom_themes.md) - [Loading data from a `Table`](./how_to/javascript/loading_data.md) - [Loading data from a virtual `Table`](./how_to/javascript/loading_virtual_data.md) - [Saving and restoring UI state](./how_to/javascript/save_restore.md) diff --git a/docs/md/how_to/javascript/custom_themes.md b/docs/md/how_to/javascript/custom_themes.md new file mode 100644 index 0000000000..baaccb2927 --- /dev/null +++ b/docs/md/how_to/javascript/custom_themes.md @@ -0,0 +1,28 @@ +# Custom themes + +The best way to write a new theme is to +[fork and modify an existing theme](https://github.com/finos/perspective/tree/master/rust/perspective-viewer/src/themes), +which are _just_ collections of regular CSS variables (no preprocessor is +required, though Perspective's own themes use one). `` is +not "themed" by default and will lack icons and label text in addition to colors +and fonts, so starting from an empty theme forces you to define _every_ +theme-able variable to get a functional UI. + +### Icons and Translation + +UI icons are defined by CSS variables provided by +[`@finos/perspective-viewer/dist/css/icons.css`](https://github.com/finos/perspective/blob/master/rust/perspective-viewer/src/themes/icons.less). +These variables must be defined for the UI icons to work - there are no default +icons without a theme. + +UI text is also defined in CSS variables provided by +[`@finos/perspective-viewer/dist/css/intl.css`](https://github.com/finos/perspective/blob/master/rust/perspective-viewer/src/themes/intl.less), +and has identical import requirements. Some _example definitions_ +(automatically-translated sans-editing) can be found +[`@finos/perspective-viewer/dist/css/intl/` folder](https://github.com/finos/perspective/tree/master/rust/perspective-viewer/src/themes/intl). + +Importing the pre-built `themes.css` stylesheet as well as a custom theme will +define Icons and Translation globally as a side-effect. You can still customize +icons in this mode with rules (of the appropriate specificity), _but_ if you do +not still remember to define these variables yourself, your theme will not work +without the base `themes.css` pacage available. diff --git a/rust/perspective-viewer/src/less/config-selector.less b/rust/perspective-viewer/src/less/config-selector.less index 3d9185caf9..df4e96a6b2 100644 --- a/rust/perspective-viewer/src/less/config-selector.less +++ b/rust/perspective-viewer/src/less/config-selector.less @@ -267,7 +267,7 @@ top: 0px; margin: var(--column-drop-label--margin, -16px 0px 0px 0px); font-size: var(--label--font-size, 0.75em); - display: var(--column-drop-label--display, none); + display: inline-block; } #transpose_button { diff --git a/rust/perspective-viewer/src/themes/pro.less b/rust/perspective-viewer/src/themes/pro.less index cef4612747..283c2e0b8d 100644 --- a/rust/perspective-viewer/src/themes/pro.less +++ b/rust/perspective-viewer/src/themes/pro.less @@ -63,7 +63,6 @@ perspective-string-column-style[theme="Pro Light"] { --config-button--padding: 15px 8px 6px 8px; --column-drop-label--font-size: 8px; --column-drop-container--padding: 0px; - --column-drop-label--display: inline-block; --column-selector--width: 20px; --column-selector--font-size: 16px; From 415285a8c3282c9c62153bbd6e6c2d1a7a68ded8 Mon Sep 17 00:00:00 2001 From: Andrew Stein Date: Sun, 2 Feb 2025 15:25:37 -0500 Subject: [PATCH 3/3] Fix TypeScript plugin exports Signed-off-by: Andrew Stein --- examples/blocks/src/editable/index.html | 22 ++++++++++-------- examples/react-example/package.json | 4 +++- examples/react-example/src/index.tsx | 11 ++++++--- examples/react-example/tsconfig.json | 2 +- packages/perspective-viewer-d3fc/package.json | 4 ++-- .../perspective-viewer-datagrid/package.json | 6 +++-- pnpm-lock.yaml | 23 +++++++++++++++---- 7 files changed, 49 insertions(+), 23 deletions(-) diff --git a/examples/blocks/src/editable/index.html b/examples/blocks/src/editable/index.html index 91af59f54d..3cc2e8373b 100644 --- a/examples/blocks/src/editable/index.html +++ b/examples/blocks/src/editable/index.html @@ -2,24 +2,26 @@ - - - - + + + + +