From fbf2791d535772213858def1d8ee583a4b4a1f41 Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 31 Jan 2025 05:41:04 +0100 Subject: [PATCH] feat: remove `RTLTextPlugin` default for MapLibre (#2480) --- docs/api-reference/maplibre/map.md | 10 ++++------ docs/upgrade-guide.md | 11 +++++++++++ modules/react-maplibre/src/utils/set-globals.ts | 16 +++++++--------- 3 files changed, 22 insertions(+), 15 deletions(-) diff --git a/docs/api-reference/maplibre/map.md b/docs/api-reference/maplibre/map.md index 66e8be73b..9508bf70b 100644 --- a/docs/api-reference/maplibre/map.md +++ b/docs/api-reference/maplibre/map.md @@ -493,14 +493,12 @@ If `reuseMaps` is set to `true`, when a map component is unmounted, the underlyi Note that since some map options cannot be modified after initialization, when reusing maps, only the reactive props and `initialViewState` of the new component are respected. -#### `RTLTextPlugin`: string | false {#rtltextplugin} +#### `RTLTextPlugin`: string | object {#rtltextplugin} -Default: `'https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js'` - -Sets the map's [RTL text plugin](https://www.mapbox.com/mapbox-gl-js/plugins/#mapbox-gl-rtl-text). Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left. - -Setting this prop is the equivalent of calling [setRTLTextPlugin](https://maplibre.org/maplibre-gl-js/docs/API/functions/setRTLTextPlugin/) with `lazy: true`. Set to `false` to disable loading the RTL text plugin. +- `pluginUrl`: `string` URL to the plugin JS file. +- `lazy`: `boolean` When true, the plugin is only loaded when the map first encounters Hebrew or Arabic text. Default `true`. +Sets the map's RTL text plugin via [setRTLTextPlugin](https://maplibre.org/maplibre-gl-js/docs/API/functions/setRTLTextPlugin/). Can be used with [mapbox-gl-rtl-text](https://github.com/mapbox/mapbox-gl-rtl-text). Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left. #### `workerCount`: number {#workercount} diff --git a/docs/upgrade-guide.md b/docs/upgrade-guide.md index 934ed0600..5ff6521eb 100644 --- a/docs/upgrade-guide.md +++ b/docs/upgrade-guide.md @@ -18,6 +18,17 @@ | `*Layer` | `*LayerSpecification` | | `*SourceRaw` | `*SourceSpecification` | +### MapLibre + +#### Removed default for `RTLTextPlugin` + +The default `RTLTextPlugin` loaded from mapbox.com has been removed to align with the default behavior of MapLibre. +To keep the previous behavior, specify the `pluginUrl` which was previously used or supply the plugin from any other source: + +```tsx + +``` + ## Upgrading to v7.1 diff --git a/modules/react-maplibre/src/utils/set-globals.ts b/modules/react-maplibre/src/utils/set-globals.ts index 1e3080358..ea6050c7f 100644 --- a/modules/react-maplibre/src/utils/set-globals.ts +++ b/modules/react-maplibre/src/utils/set-globals.ts @@ -4,7 +4,7 @@ export type GlobalSettings = { */ maxParallelImageRequests?: number; /** The map's RTL text plugin. Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left. */ - RTLTextPlugin?: string | false; + RTLTextPlugin?: string | {pluginUrl: string; lazy?: boolean}; /** The number of web workers instantiated on a page with maplibre-gl maps. * @default 2 */ @@ -16,26 +16,24 @@ export type GlobalSettings = { }; export default function setGlobals(mapLib: any, props: GlobalSettings) { - const { - RTLTextPlugin = 'https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js', - maxParallelImageRequests, - workerCount, - workerUrl - } = props; + const {RTLTextPlugin, maxParallelImageRequests, workerCount, workerUrl} = props; if ( RTLTextPlugin && mapLib.getRTLTextPluginStatus && mapLib.getRTLTextPluginStatus() === 'unavailable' ) { + const {pluginUrl, lazy = true} = + typeof RTLTextPlugin === 'string' ? {pluginUrl: RTLTextPlugin} : RTLTextPlugin; + mapLib.setRTLTextPlugin( - RTLTextPlugin, + pluginUrl, (error?: Error) => { if (error) { // eslint-disable-next-line console.error(error); } }, - true + lazy ); } if (maxParallelImageRequests !== undefined) {