Bumps the react group with 2 updates: [react-i18next](https://github.com/i18next/react-i18next) and [react-resizable-panels](https://github.com/bvaughn/react-resizable-panels). Updates `react-i18next` from 17.1.0 to 17.1.4 <details> <summary>Changelog</summary> <p><em>Sourced from <a href="https://github.com/i18next/react-i18next/blob/master/CHANGELOG.md">react-i18next's changelog</a>.</em></p> <blockquote> <h2>17.1.4</h2> <ul> <li>fix(types): without <code>allowObjectInHTMLChildren</code>, the <code>children</code> of HTML elements now use React's own type (<code>DOMAttributes<T>['children']</code>) instead of the <code>ReactI18NextChildren | Iterable<ReactI18NextChildren></code> union. Both accept the same children, so nothing compiles differently. For default installs the global <code>HTMLAttributes</code> augmentation now repeats whatever <code>@types/react</code> declares, so changes in React's types flow through instead of meeting a copy, and type errors on element children no longer list an extra <code>Iterable<...></code>. With <code>allowObjectInHTMLChildren: true</code> nothing changes. First step of <a href="https://redirect.github.com/i18next/react-i18next/issues/1928">#1928</a>.</li> </ul> <h2>17.1.3</h2> <ul> <li>fix(IcuTrans): numeric HTML entities above U+FFFF, like emoji, now decode to the right character. <code>"Hello &#x1F44B; <0>friend</0> &[#127881](https://github.com/i18next/react-i18next/issues/127881);"</code> rendered U+F44B and U+F389, private-use glyphs that usually show as a box, instead of 👋 and 🎉: the decoder used <code>String.fromCharCode</code>, which keeps only the low 16 bits of the code point. This shows up with translations that a TMS or CMS exports HTML-encoded. Entities above U+10FFFF, which are no valid code points, now stay as written instead of becoming U+0000. Entities below U+10000, including surrogate pairs written as two entities, decode as before. Thanks <a href="https://github.com/nk-batman21"><code>@nk-batman21</code></a> (<a href="https://redirect.github.com/i18next/react-i18next/pull/1940">#1940</a>).</li> </ul> <h2>17.1.2</h2> <ul> <li>fix(Trans): when the only child is a string, a tag whose index the children don't have now renders its own text. <code><Trans i18nKey="welcome">Welcome</Trans></code> with <code>"Welcome <1>friend</1>"</code> rendered <code>Welcome e</code>, and <code>defaults="Hi <1>there</1>"</code> with the child <code>Hi</code> rendered <code>Hi i</code>. The fallback for a single object of components (<code>{{ 1: <strong /> }}</code>) looked the tag up on the string and rendered one of its characters. It now applies only when that child is an object, so <code>{{ 1: <strong /> }}</code> renders as before, and the tag falls back to its inner text, as it already did with several children or with a number or an element as the only child. This also stops a single-entry array child holding <code>null</code> (<code>{[null]}</code>, e.g. from a <code>.map</code> that returned <code>null</code>) from throwing <code>Cannot read properties of null</code>. Thanks <a href="https://github.com/Cayan"><code>@Cayan</code></a> (<a href="https://redirect.github.com/i18next/react-i18next/pull/1939">#1939</a>).</li> </ul> <h2>17.1.1</h2> <ul> <li>fix(Trans): with <code>components</code> as an object with index keys, the component for key <code>0</code> is now rendered. <code>components={{ 0: <a href={path} /> }}</code> with <code>"You're eligible. <0>Get started here.</0>"</code> rendered the text without the link, a self-closing <code><0/></code> rendered nothing, and in <code><0>a <1>b</1></0></code> both elements were lost, while keys <code>1</code> and up and the array form worked. The object was passed on as the indexed children, so <code><0></code> resolved to the object itself. It is now looked up by key, like a named components map. This also fixes an array <code>components</code> next to <code>react.transDefaultProps.components</code>, which the merge turns into such an object (<code>{ Bold, 0, 1 }</code>) and so lost its first entry, and a self-closing named tag in a mixed object (<code>{ 0: <a />, Bold: <b /> }</code> with <code><Bold/></code>), which rendered as the text <code><Bold /></code>. Arrays, named maps and index objects starting at <code>1</code> render as before. Thanks <a href="https://github.com/nk-batman21"><code>@nk-batman21</code></a> (<a href="https://redirect.github.com/i18next/react-i18next/pull/1938">#1938</a>).</li> </ul> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href="https://github.com/i18next/react-i18next/commit/290e8abe91bc7660af3afb1e97cf6d2ca839eb98"><code>290e8ab</code></a> 17.1.4</li> <li><a href="https://github.com/i18next/react-i18next/commit/aeb94d1ec3aa97703e3dc8142ecb236b4931a332"><code>aeb94d1</code></a> changelog for 17.1.4</li> <li><a href="https://github.com/i18next/react-i18next/commit/3fecad75a39cd5fe82e5f076108e24e5fee33b89"><code>3fecad7</code></a> fix(types): use React's own children type unless allowObjectInHTMLChildren is...</li> <li><a href="https://github.com/i18next/react-i18next/commit/696c0f5d388b962c5275feb3bd01dcb6d89f02fd"><code>696c0f5</code></a> 17.1.3</li> <li><a href="https://github.com/i18next/react-i18next/commit/094943a942b6eca7e75b3ad99456dfc77a28973f"><code>094943a</code></a> build</li> <li><a href="https://github.com/i18next/react-i18next/commit/a73495c09767db22496d5d13b2d1c622d65a477a"><code>a73495c</code></a> changelog for 17.1.3</li> <li><a href="https://github.com/i18next/react-i18next/commit/9a36388b1d2f3fc8dcc7c7ffb22602755f507357"><code>9a36388</code></a> fix(IcuTrans): decode numeric entities above U+FFFF (<a href="https://redirect.github.com/i18next/react-i18next/issues/1940">#1940</a>)</li> <li><a href="https://github.com/i18next/react-i18next/commit/53a810c1f43198e86c7659248430d7eee0e23209"><code>53a810c</code></a> 17.1.2</li> <li><a href="https://github.com/i18next/react-i18next/commit/01aa762d4adad014cd4660ae827c1658b669a28a"><code>01aa762</code></a> build</li> <li><a href="https://github.com/i18next/react-i18next/commit/78679811890fae0b5865b75d8e55934be307e2f2"><code>7867981</code></a> changelog for 17.1.2</li> <li>Additional commits viewable in <a href="https://github.com/i18next/react-i18next/compare/v17.1.0...v17.1.4">compare view</a></li> </ul> </details> <br /> Updates `react-resizable-panels` from 4.14.7 to 4.14.8 <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/bvaughn/react-resizable-panels/releases">react-resizable-panels's releases</a>.</em></p> <blockquote> <h2>4.14.8</h2> <ul> <li>Fix "Stacking order can only be calculated for elements with a common ancestor" error thrown by the document <code>pointermove</code> handler when the event target is removed from the DOM during dispatch. Detached targets are now treated as viable hit targets. - <a href="https://redirect.github.com/bvaughn/react-resizable-panels/pull/771">#771</a></li> <li>Fix <code>Group</code> and <code>Grid</code> <code>setLayout()</code> and <code>Panel</code> <code>resize()</code>, <code>collapse()</code>, and <code>expand()</code> validating against pixel-based constraints for the previous group size when called before the group's <code>ResizeObserver</code> ran (e.g. from an application's own <code>ResizeObserver</code>). - <a href="https://redirect.github.com/bvaughn/react-resizable-panels/issues/770">#770</a></li> </ul> </blockquote> </details> <details> <summary>Changelog</summary> <p><em>Sourced from <a href="https://github.com/bvaughn/react-resizable-panels/blob/main/CHANGELOG.md">react-resizable-panels's changelog</a>.</em></p> <blockquote> <h2>4.14.8</h2> <ul> <li>Fix "Stacking order can only be calculated for elements with a common ancestor" error thrown by the document <code>pointermove</code> handler when the event target is removed from the DOM during dispatch. Detached targets are now treated as viable hit targets. - <a href="https://redirect.github.com/bvaughn/react-resizable-panels/pull/771">#771</a></li> <li>Fix <code>Group</code> and <code>Grid</code> <code>setLayout()</code> and <code>Panel</code> <code>resize()</code>, <code>collapse()</code>, and <code>expand()</code> validating against pixel-based constraints for the previous group size when called before the group's <code>ResizeObserver</code> ran (e.g. from an application's own <code>ResizeObserver</code>). - <a href="https://redirect.github.com/bvaughn/react-resizable-panels/issues/770">#770</a></li> </ul> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href="https://github.com/bvaughn/react-resizable-panels/commit/c19f0a93a96e4f214e9bd7b77eaec155f31f50d7"><code>c19f0a9</code></a> 4.14.7 -> 4.14.8</li> <li><a href="https://github.com/bvaughn/react-resizable-panels/commit/625ef2d83a839eb6fb1a1c7e2703f27598136472"><code>625ef2d</code></a> Validate imperative layout changes against the group's current size (<a href="https://redirect.github.com/bvaughn/react-resizable-panels/issues/772">#772</a>)</li> <li><a href="https://github.com/bvaughn/react-resizable-panels/commit/64c5be9e60a76b087fe56d9a0a20d415b9c69fe1"><code>64c5be9</code></a> Fix "Stacking order can only be calculated for elements with a common ancesto...</li> <li>See full diff in <a href="https://github.com/bvaughn/react-resizable-panels/compare/4.14.7...4.14.8">compare view</a></li> </ul> </details> <br /> Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting `@dependabot rebase`. [//]: # (dependabot-automerge-start) [//]: # (dependabot-automerge-end) --- <details> <summary>Dependabot commands and options</summary> <br /> You can trigger Dependabot actions by commenting on this PR: - `@dependabot rebase` will rebase this PR - `@dependabot recreate` will recreate this PR, overwriting any edits that have been made to it - `@dependabot show <dependency name> ignore conditions` will show all of the ignore conditions of the specified dependency - `@dependabot ignore <dependency name> major version` will close this group update PR and stop Dependabot creating any more for the specific dependency's major version (unless you unignore this specific dependency's major version or upgrade to it yourself) - `@dependabot ignore <dependency name> minor version` will close this group update PR and stop Dependabot creating any more for the specific dependency's minor version (unless you unignore this specific dependency's minor version or upgrade to it yourself) - `@dependabot ignore <dependency name>` will close this group update PR and stop Dependabot creating any more for the specific dependency (unless you unignore this specific dependency or upgrade to it yourself) - `@dependabot unignore <dependency name>` will remove all of the ignore conditions of the specified dependency - `@dependabot unignore <dependency name> <ignore condition>` will remove the ignore condition of the specified dependency and ignore conditions </details> Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Maputnik
A free and open visual editor for the MapLibre GL styles targeted at developers and map designers.
Usage
- 🔗 Design your maps online at https://www.maplibre.org/maputnik/ (all in local storage)
- 🔗 Use the Maputnik CLI for local style development
- In a Docker, run this command and browse to http://localhost:8888, Ctrl+C to stop the server.
docker run -it --rm -p 8888:8000 ghcr.io/maplibre/maputnik:main
To see the CLI options (for example file watching or style serving) run:
docker run -it --rm -p 8888:8000 ghcr.io/maplibre/maputnik:main --help
You might need to mount a volume (-v) to be able to use these options.
Documentation
The documentation can be found in the Wiki. You are welcome to collaborate!
- 🔗 Study the Maputnik Wiki
- 📹 Design a map from Scratch https://youtu.be/XoDh0gEnBQo
Develop
Maputnik is written in typescript and is using React and MapLibre GL JS.
We ensure building and developing Maputnik works with the current active LTS Node.js version and above.
Check out our Internationalization guide for UI text related changes.
Getting Involved
Join the #maplibre or #maputnik slack channel at OSMUS: get an invite at https://slack.openstreetmap.us/ Read the the below guide in order to get familiar with how we do things around here.
Install the deps, start the dev server and open the web browser on http://localhost:8888/.
# install dependencies
npm install
# start dev server
npm run start
If you want Maputnik to be accessible externally use the --host option:
# start externally accessible dev server
npm run start -- --host 0.0.0.0
The build process will watch for changes to the filesystem, rebuild and autoreload the editor.
npm run build
Lint the JavaScript code.
# run linter
npm run lint
npm run lint-css
npm run sort-styles
Tests
End-to-end tests
For E2E testing we use Playwright. The tests live in the e2e directory and drive the app through the MaputnikDriver page object.
The first time you run the tests, install the browser:
npx playwright install chromium
Playwright automatically starts the dev server (npm run start) for you, so you can just run:
npm run test
Some useful options:
# see the tests run in a headed browser
npm run test -- --headed
# run a single spec / filter by title
npm run test -- e2e/map.spec.ts
npm run test -- -g "zoom level"
# open the interactive UI mode
npx playwright test --ui
Running the E2E tests also produces a code-coverage report in coverage/ (collected via istanbul instrumentation of the dev server).
Unit & component tests
Unit tests and component tests run with Vitest; component tests (*.browser.test.tsx) use Vitest's browser mode with the Playwright provider.
npm run test-unit
Release process
- Review
CHANGELOG.md- Double-check that all changes included in the release are appropriately documented.
- To-be-released changes should be under the "main" header.
- Commit any final changes to the changelog.
- Run Create bump version PR by manual workflow dispatch and set the version number in the input. This will create a PR that changes the changelog and
package.jsonfile to review and merge. - Once merged, an automatic process will kick in and creates a GitHub release and uploads release assets.
Sponsors
Thanks to the supporters of the Kickstarter campaign. This project would not be possible without these commercial and individual sponsors. You can see this file's history for previous sponsors of the original Maputnik repo. Read more about the MapLibre Sponsorship Program at https://maplibre.org/sponsors/.
License
Maputnik is licensed under MIT and is Copyright (c) Lukas Martinelli and Maplibre contributors. As contributor please take extra care of not violating any Mapbox trademarks. Do not get inspired by other map studios and make your own decisions for a good style editor.
