@jupytergis/base 0.14.0 → 0.15.0

package/lib/types.d.ts

@@ -6,7 +6,7 @@ import { Map } from 'ol';
 export { IDict };
 export type ValueOf<T> = T[keyof T];
 export type JupyterGISTracker = WidgetTracker<IJupyterGISWidget>;
-export type SymbologyTab = 'color' | 'radius';
+export type SymbologyTab = 'color' | 'radius' | 'filters';
 type RgbColorValue = [number, number, number] | [number, number, number, number];
 type HexColorValue = string;
 type InternalRgbArray = number[];
@@ -30,10 +30,16 @@ declare global {
 declare const classificationModes: readonly ["quantile", "equal interval", "jenks", "pretty", "logarithmic", "continuous"];
 export type ClassificationMode = (typeof classificationModes)[number];
 export declare const SYMBOLOGY_VALID_LAYER_TYPES: string[];
+export interface IWmsLayerInfo {
+    name: string;
+    title: string;
+}
 /** Form context passed to SchemaForm and custom fields. */
 export interface IJupyterGISFormContext<TFormData = IDict | undefined> {
     model: IJupyterGISModel;
     formData: TFormData;
+    wmsAvailableLayers?: IWmsLayerInfo[];
+    setWmsAvailableLayers?: (layers: IWmsLayerInfo[]) => void;
     formSchemaRegistry?: IJGISFormSchemaRegistry;
 }
 /** Optional form state (schema, extraErrors). */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupytergis/base",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "A JupyterLab extension for 3D modelling.",
   "keywords": [
     "jupyter",
@@ -37,6 +37,7 @@
     "clean:all": "jlpm run clean:lib",
     "watch": "tspc -w"
   },
+  "packageManager": "yarn@3.5.0",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
@@ -44,7 +45,7 @@
     "@jupyter/collaboration": "^4",
     "@jupyter/react-components": "^0.16.6",
     "@jupyter/ydoc": "^2.0.0 || ^3.0.0",
-    "@jupytergis/schema": "^0.14.0",
+    "@jupytergis/schema": "^0.15.0",
     "@jupyterlab/application": "^4.3.0",
     "@jupyterlab/apputils": "^4.3.0",
     "@jupyterlab/completer": "^4.3.0",
@@ -71,6 +72,7 @@
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "colormap": "^2.3.2",
+    "d3-scale-chromatic": "^3.0.0",
     "date-fns": "^4.1.0",
     "gdal3.js": "^2.8.1",
     "geojson-vt": "^4.0.2",
@@ -87,6 +89,7 @@
     "proj4-list": "1.0.4",
     "radix-ui": "^1.4.3",
     "react": "^18.0.1",
+    "react-colorful": "^5.6.1",
     "react-day-picker": "^9.7.0",
     "react-markdown": "^10.1.0",
     "shpjs": "^6.1.0",

package/style/shared/button.css

@@ -13,11 +13,8 @@
   border: 0.0375rem solid
     color-mix(in srgb, var(--jp-border-color1), transparent 20%);
   transition: background-color 0.2s ease;
-  height: 2.25rem;
-  padding-left: 1rem;
-  padding-right: 1rem;
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+  height: 1.5rem;
+  padding: 1rem 0.5rem;
   max-width: 20rem;
   gap: 0.25rem;
 }

package/style/shared/input.css

@@ -1,12 +1,12 @@
 [data-slot='input'] {
   box-sizing: border-box;
-  height: 1.125rem;
+  height: 2.25rem;
   width: auto;
   min-width: 0;
   border-radius: var(--jp-border-radius, 0.375rem);
   border: 1px solid var(--jp-border-color1);
   background-color: transparent;
-  padding: 0.25rem 0.75rem;
+  padding: 0.25rem 0.5rem;
   font-size: 1rem;
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
   transition:

package/style/shared/tabs.css

@@ -17,7 +17,7 @@
   gap: 1rem;
   width: 100%;
   font-size: 9px;
-  overflow-x: scroll;
+  overflow-x: auto;
 }
 
 .jgis-tabs-list:active {
@@ -60,7 +60,7 @@
 .jgis-tabs-content {
   outline: none;
   width: 100%;
-  overflow-y: scroll;
+  overflow-y: auto;
   /* max-height: 480px; */
   padding-top: 1rem;
 }

package/style/storyPanel.css

@@ -1,5 +1,6 @@
 .jgis-story-viewer-panel {
   padding: 1rem;
+  padding-right: 0;
   overflow: auto;
   position: relative;
 }
@@ -158,6 +159,8 @@
   top: unset;
   box-shadow: unset;
   max-height: unset;
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
 }
 
 .jgis-specta-story-panel-container {
@@ -187,10 +190,14 @@
 }
 
 .jgis-story-viewer-panel-specta-mod {
+  display: flex;
+  height: 100%;
   width: 45%;
+  align-items: center;
   font-size: var(--jp-ui-font-size3);
   padding-right: 1.7rem;
   color: var(--jgis-specta-text-color, var(--jp-ui-font-color1));
+  background-color: var(--jgis-specta-bg-color, var(--jp-layout-color0));
   overflow-y: auto;
   max-height: 100%;
 }

package/style/symbologyDialog.css

@@ -27,7 +27,8 @@ select option {
 }
 
 .jp-gis-symbology-row > .jp-select-wrapper,
-.jp-gis-symbology-row > .jp-mod-styled {
+.jp-gis-symbology-row > .jp-mod-styled,
+.jp-gis-symbology-row > .jp-gis-rgba-picker {
   flex: 1 0 50%;
   max-width: 50%;
 }
@@ -228,3 +229,46 @@ select option {
 .jp-gis-selected-entry {
   width: 100%;
 }
+
+.jp-gis-rgba-inputs {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  margin-top: 6px;
+}
+
+.jp-gis-rgba-field {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: 2px;
+}
+
+.jp-gis-rgba-field label {
+  font-size: var(--jp-ui-font-size0);
+  color: var(--jp-ui-font-color2);
+  line-height: 1;
+}
+
+.jp-gis-rgba-field input {
+  width: 4ch;
+  text-align: center;
+  padding: 1px 2px;
+  -moz-appearance: textfield;
+}
+
+.jp-gis-rgba-field input::-webkit-outer-spin-button,
+.jp-gis-rgba-field input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+}
+
+.jp-gis-transparent-label {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin-top: 6px;
+  font-size: var(--jp-ui-font-size1);
+  cursor: pointer;
+  user-select: none;
+}