Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -40,4 +40,5 @@ docker/devenv/server-data/*

# Visual regression test outputs (keep baselines, ignore reports and temp files)
playwright-report/
test-results/
test-results/
docker/devenv/wwwroot/*
9 changes: 1 addition & 8 deletions .storybook/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,16 +50,9 @@ module.exports = {
__DEV__: JSON.stringify(configType !== "PRODUCTION"),
__VERSION__: JSON.stringify(process.env.APPVEYOR_BUILD_VERSION || ""),
__COMMITHASH__: JSON.stringify(process.env.APPVEYOR_REPO_COMMIT || ""),
__BRANCH__: JSON.stringify(process.env.APPVEYOR_REPO_BRANCH || "master"),
"process.env.BLUEPRINT_NAMESPACE": JSON.stringify("bp3")
__BRANCH__: JSON.stringify(process.env.APPVEYOR_REPO_BRANCH || "master")
},
resolve: {
alias: [
{
find: /.*\/generated\/iconSvgPaths.*/,
replacement: path.resolve(__dirname, "..", "stdassets/bp-icons.js")
}
]
},
build: {
target: "es2020"
Expand Down
2 changes: 1 addition & 1 deletion DONOTUPGRADE.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,4 +32,4 @@ Reasons for not upgrading: It's not so much the package itself may break our lib

React 19 looks too new for our ecosystem

React 18 is the safest bet. We can upgrade to react 18 once we have fully decoupled ourselves from blueprint.js
React 18 is the safest bet. We can upgrade to react 18 once we have fully decoupled ourselves from legacy UI toolkit dependencies.
1 change: 0 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,6 @@ mapguide-react-layout could not be possible without the following tools and libr
* [proj4js](http://proj4js.org/)
* [TypeScript](https://www.typescriptlang.org/)
* [React](https://facebook.github.io/react/)
* [Blueprint](http://blueprintjs.com/)
* [sidebar-v2](https://github.com/Turbo87/sidebar-v2)

mapguide-react-layout uses icons from the Fugue icons set, by [Yusuke Kamiyamane](http://p.yusukekamiyamane.com)
Expand Down
2 changes: 0 additions & 2 deletions docs_dev/content/KNOWN_ISSUES.md
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,6 @@ Since the `0.14.3` release, the viewer has basic support for MapGuide Map Defini
* Measure
* Recorded measurements will temporarily disappear on templates with a collapsible Task Pane (eg. Slate) when the Task Pane panel is collapsed.

* Modal dialog backdrops do not work (due to recent Blueprint update)

## Commands

* General
Expand Down
1 change: 0 additions & 1 deletion docs_dev/content/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ mapguide-react-layout could not be possible without the following tools and libr
* [proj4js](http://proj4js.org/)
* [TypeScript](https://www.typescriptlang.org/)
* [React](https://facebook.github.io/react/)
* [Blueprint](http://blueprintjs.com/)
* [sidebar-v2](https://github.com/Turbo87/sidebar-v2)

mapguide-react-layout uses icons from the Fugue icons set, by [Yusuke Kamiyamane](http://p.yusukekamiyamane.com)
Expand Down
43 changes: 2 additions & 41 deletions docs_dev/content/UI_CUSTOMIZATION.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ The **provider** (the concrete implementation of `IElementContext`) is installed

## Default provider: `MinimalProvider`

Starting from version 0.15, the default provider is `MinimalProvider` — a lightweight implementation that uses **HTML intrinsic elements** and **plain CSS with CSS custom properties (variables)**. It has no dependency on Blueprint.js or any other large UI toolkit.
Starting from version 0.15, the default provider is `MinimalProvider` — a lightweight implementation that uses **HTML intrinsic elements** and **plain CSS with CSS custom properties (variables)**. It has no dependency on any large UI toolkit.

Key characteristics of `MinimalProvider`:

Expand Down Expand Up @@ -53,45 +53,6 @@ All other components — including `Icon` — are implemented with zero external
>
> If you are using `Application.mount()` to embed the viewer in a static HTML page from the pre-built `viewer.js` bundle, `MinimalProvider` is permanently baked in. Customisation in that scenario is done through [CSS variable overrides](#overriding-css-variables-design-tokens) only.

### Blueprint.js provider (optional)

`@blueprintjs/core` is an **optional peer dependency**. It is **not** included in the default `viewer.js` bundle, so your users only download it if you explicitly opt in.

> **Bundle impact**: Because Blueprint is excluded from the default bundle, every user of the viewer benefits from a smaller download — even if some deployments choose to enable the Blueprint provider.

**Step 1 — Install the optional dependencies:**

```bash
npm install @blueprintjs/core @blueprintjs/icons
# or
yarn add @blueprintjs/core @blueprintjs/icons
```

**Step 2 — Import Blueprint's CSS** (required for correct Blueprint rendering):

```css
@import '@blueprintjs/core/lib/css/blueprint.css';
@import '@blueprintjs/icons/lib/css/blueprint-icons.css';
```

**Step 3 — Import and activate the Blueprint provider.**

> **Note:** `BpProvider` is **not** exported from the main `mapguide-react-layout` bundle, because including it would unconditionally add Blueprint.js (~120 KB) to every user's download. It is intended for use in **custom bundle scenarios** where you control your own Vite/Rollup configuration. Import it directly from its source path:

```tsx
import { ElementProvider } from 'mapguide-react-layout';
import BpProvider from 'mapguide-react-layout/src/components/elements/providers/blueprint/provider';

// In your custom bundle entry or parent React app render:
function App() {
return (
<ElementProvider value={BpProvider}>
{/* All viewer components inside will use Blueprint.js */}
</ElementProvider>
);
}
```

---

## Overriding CSS variables (design tokens)
Expand Down Expand Up @@ -213,7 +174,7 @@ All component class names use the `mrl-` prefix. You can override specific compo

If you want to implement the viewer's UI atoms using a completely different component library (e.g. MUI, Ant Design, Radix UI), you can provide a full custom implementation. This is only applicable in the two scenarios described above (custom bundle or direct React integration).

> **Note:** The example below is **abbreviated** — it shows only 2 of the 32 required slots. For a complete reference implementation, see [`src/components/elements/providers/minimal/provider.tsx`](../src/components/elements/providers/minimal/provider.tsx) or the Blueprint provider at [`src/components/elements/providers/blueprint/provider.tsx`](../src/components/elements/providers/blueprint/provider.tsx).
> **Note:** The example below is **abbreviated** — it shows only 2 of the 32 required slots. For a complete reference implementation, see [`src/components/elements/providers/minimal/provider.tsx`](../src/components/elements/providers/minimal/provider.tsx).

```tsx
import type { IElementContext } from 'mapguide-react-layout';
Expand Down
2 changes: 1 addition & 1 deletion docs_dev/content/VISUAL_REGRESSION.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ This project uses [`@storybook/test-runner`](https://storybook.js.org/docs/writi

Baselines are PNG files stored in `visual-snapshots/` and are committed to git.

When you make an intentional visual change (e.g. replacing a Blueprint.js component):
When you make an intentional visual change (e.g. replacing a component or restyling a UI element):

```bash
yarn test:visual:update
Expand Down
35 changes: 11 additions & 24 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -62,19 +62,19 @@
},
"homepage": "https://github.com/jumpinjackie/mapguide-react-layout#readme",
"dependencies": {
"@reduxjs/toolkit": "^2.11.2",
"colorbrewer": "^1.6.1",
"dompurify": "^3.4.0",
"geojson-vt": "^4.0.2",
"jspdf": "^4.0.0",
"@reduxjs/toolkit": "^2.12.0",
"colorbrewer": "^1.7.0",
"dompurify": "^3.4.10",
"geojson-vt": "^4.0.3",
"jspdf": "^4.2.1",
"lodash.debounce": "^4.0.8",
"lodash.xor": "^4.5.0",
"lodash.xorby": "^4.7.0",
"ol": "^10.9.0",
"papaparse": "^5.5.3",
"proj4": "2.20.8",
"proj4": "2.20.9",
"react": "^17.0.2",
"react-colorful": "^5.6.1",
"react-colorful": "^5.7.0",
"react-dom": "^17.0.2",
"react-hot-toast": "2.6.0",
"react-redux": "^8.1.3",
Expand All @@ -84,7 +84,6 @@
"tslib": "^2.8.1"
},
"devDependencies": {
"@blueprintjs/core": "^3.54.0",
"@modelcontextprotocol/sdk": "1.29.0",
"@playwright/test": "1.59.1",
"@storybook/addon-actions": "^8.6.18",
Expand Down Expand Up @@ -114,7 +113,7 @@
"@vitest/coverage-v8": "3.2.4",
"@welldone-software/why-did-you-render": "^7.0.1",
"barrelsby": "2.8.1",
"bestzip": "2.2.3",
"bestzip": "3.0.1",
"concurrently": "9.2.1",
"copyfiles": "2.4.1",
"coveralls": "3.1.1",
Expand All @@ -137,24 +136,12 @@
"typedoc-plugin-merge-modules": "7.0.0",
"typescript": "5.9.3",
"typescript-json-schema": "^0.67.1",
"vite": "^8.0.14",
"vite": "^8.0.16",
"vitest": "3.2.6",
"wait-on": "9.0.5"
"wait-on": "9.0.10"
},
"engines": {
"node": ">=18"
},
"packageManager": "yarn@4.14.1",
"peerDependencies": {
"@blueprintjs/core": "^3.54.0",
"@blueprintjs/icons": "^3.33.0"
},
"peerDependenciesMeta": {
"@blueprintjs/core": {
"optional": true
},
"@blueprintjs/icons": {
"optional": true
}
}
"packageManager": "yarn@4.14.1"
}
Loading
Loading