Skip to content

Commit ca0bc71

Browse files
committed
[add] Stable version & Project framework migrated from Idea-React
0 parents  commit ca0bc71

File tree

18 files changed

+6186
-0
lines changed

18 files changed

+6186
-0
lines changed

.github/workflows/main.yml

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
name: CI & CD
2+
on:
3+
push:
4+
tags:
5+
- v*
6+
jobs:
7+
Build-and-Publish:
8+
runs-on: ubuntu-latest
9+
steps:
10+
- uses: actions/checkout@v3
11+
12+
- uses: pnpm/action-setup@v2
13+
with:
14+
version: 8
15+
- uses: actions/setup-node@v3
16+
with:
17+
node-version: 18
18+
registry-url: https://registry.npmjs.org
19+
cache: pnpm
20+
- name: Install Dependencies
21+
run: pnpm i --frozen-lockfile
22+
23+
- name: Build & Publish
24+
run: npm publish
25+
env:
26+
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
27+
28+
- name: Update document
29+
uses: peaceiris/actions-gh-pages@v3
30+
with:
31+
publish_dir: ./docs
32+
personal_token: ${{ secrets.GITHUB_TOKEN }}
33+
force_orphan: true

.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
node_modules/
2+
.parcel-cache/
3+
dist/
4+
docs/
5+
.vscode/settings.json

.husky/pre-commit

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
#!/bin/sh
2+
3+
. "$(dirname "$0")/_/husky.sh"
4+
5+
npm test

.husky/pre-push

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
#!/bin/sh
2+
3+
. "$(dirname "$0")/_/husky.sh"
4+
5+
npm run build

.npmignore

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.parcel-cache/
2+
docs/
3+
preview/
4+
.vscode/
5+
.husky/
6+
.github/

ReadMe.md

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
# Open React Map
2+
3+
Compatible Map component supports Geo services with **Freedom** or **Open API**, based on [TypeScript][1], [MobX][2] & [React][3].
4+
5+
[![MobX compatibility](https://img.shields.io/badge/Compatible-1?logo=mobx&label=MobX%204%2F5%2F6)][2]
6+
[![NPM Dependency](https://img.shields.io/librariesio/github/idea2app/OpenReactMap.svg)][4]
7+
[![CI & CD](https://github.com/idea2app/OpenReactMap/actions/workflows/main.yml/badge.svg)][5]
8+
9+
[![NPM](https://nodei.co/npm/open-react-map.png?downloads=true&downloadRank=true&stars=true)][6]
10+
11+
## Usage
12+
13+
Preview site: https://idea2app.github.io/OpenReactMap/preview/
14+
15+
### Installation
16+
17+
#### Command
18+
19+
```shell
20+
npm i open-react-map mobx mobx-react react@17 react-dom@17
21+
```
22+
23+
#### `index.html`
24+
25+
```html
26+
<html>
27+
<head>
28+
<link
29+
rel="stylesheet"
30+
href="https://unpkg.com/[email protected]/dist/leaflet.css"
31+
/>
32+
</head>
33+
</html>
34+
```
35+
36+
### Third-party Tile provider
37+
38+
[China map in China Open-source Map project][7]
39+
40+
#### Install Extra packages
41+
42+
```shell
43+
npm i leaflet react-leaflet leaflet.chinatmsproviders
44+
```
45+
46+
#### Write Wrapper component
47+
48+
```tsx
49+
// eslint-disable-next-line simple-import-sort/imports
50+
import { FC, useEffect } from 'react';
51+
import { tileLayer } from 'leaflet';
52+
import 'leaflet.chinatmsproviders';
53+
import { useMap } from 'react-leaflet';
54+
import { OpenReactMap, OpenReactMapProps } from 'open-react-map';
55+
56+
function ChinaTileLayer() {
57+
const map = useMap();
58+
59+
useEffect(() => {
60+
// @ts-ignore
61+
tileLayer.chinaProvider('GaoDe.Normal.Map').addTo(map);
62+
}, [map]);
63+
64+
return <></>;
65+
}
66+
67+
const ChinaMap: FC<OpenReactMapProps> = props => (
68+
<OpenReactMap {...props} renderTileLayer={() => <ChinaTileLayer />} />
69+
);
70+
export default ChinaMap;
71+
```
72+
73+
### Use in Next.js
74+
75+
```tsx
76+
import dynamic from 'next/dynamic';
77+
78+
const ChinaMap = dynamic(() => import('./ChinaMap'), { ssr: false });
79+
80+
export default function ExampleMap() {
81+
return (
82+
<ChinaMap
83+
markers={[
84+
{
85+
position: [34.32, 108.55],
86+
tooltip: 'Geo Center of China'
87+
}
88+
]}
89+
onMarkerClick={console.log}
90+
/>
91+
);
92+
}
93+
```
94+
95+
[1]: https://www.typescriptlang.org/
96+
[2]: https://mobx.js.org/
97+
[3]: https://react.dev/
98+
[4]: https://libraries.io/npm/open-react-map
99+
[5]: https://github.com/idea2app/OpenReactMap/actions/workflows/main.yml
100+
[6]: https://nodei.co/npm/open-react-map/
101+
[7]: https://github.com/kaiyuanshe/kaiyuanshe.github.io/blob/ba8e396aa190896aaa8a3dee0f9eac654dfce5b3/components/ChinaMap.tsx

package.json

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
{
2+
"name": "open-react-map",
3+
"version": "0.5.0",
4+
"license": "LGPL-3.0-or-later",
5+
"author": "[email protected]",
6+
"description": "Compatible Map component supports Geo services with Freedom or Open API, based on TypeScript, MobX & React.",
7+
"keywords": [
8+
"map",
9+
"geo",
10+
"lbs",
11+
"compatibility",
12+
"free",
13+
"open",
14+
"typescript",
15+
"mobx",
16+
"react"
17+
],
18+
"homepage": "https://idea2app.github.io/OpenReactMap/",
19+
"repository": {
20+
"type": "git",
21+
"url": "git+https://github.com/idea2app/OpenReactMap.git"
22+
},
23+
"bugs": {
24+
"url": "https://github.com/idea2app/OpenReactMap/issues"
25+
},
26+
"source": "source/index.ts",
27+
"types": "dist/index.d.ts",
28+
"module": "dist/index.esm.js",
29+
"main": "dist/index.js",
30+
"dependencies": {
31+
"@swc/helpers": "^0.5.1",
32+
"@types/leaflet": "^1.9.3",
33+
"koajax": "^0.8.6",
34+
"leaflet": "^1.9.4",
35+
"mobx-react-helper": "^0.2.3",
36+
"react-leaflet": "^3.2.5",
37+
"web-utility": "^4.1.0"
38+
},
39+
"peerDependencies": {
40+
"mobx": ">=4",
41+
"mobx-react": ">=6",
42+
"react": ">=16 <18",
43+
"react-dom": ">=16 <18"
44+
},
45+
"devDependencies": {
46+
"@parcel/packager-ts": "~2.9.3",
47+
"@parcel/transformer-typescript-types": "~2.9.3",
48+
"@types/react": "^17.0.65",
49+
"@types/react-dom": "^17.0.20",
50+
"husky": "^8.0.3",
51+
"idea-react": "^1.0.0-rc.21",
52+
"koapache": "^2.2.2",
53+
"lint-staged": "^14.0.1",
54+
"mobx": "^6.10.0",
55+
"mobx-react": "^9.0.0",
56+
"parcel": "^2.9.3",
57+
"prettier": "^3.0.2",
58+
"prismjs": "^1.29.0",
59+
"process": "^0.11.10",
60+
"react": "^17.0.2",
61+
"react-bootstrap": "^2.8.0",
62+
"react-dom": "^17.0.2",
63+
"typedoc": "^0.25.0",
64+
"typedoc-plugin-mdn-links": "^3.1.0",
65+
"typescript": "^5.2.2"
66+
},
67+
"prettier": {
68+
"singleQuote": true,
69+
"trailingComma": "none",
70+
"arrowParens": "avoid",
71+
"tabWidth": 4
72+
},
73+
"lint-staged": {
74+
"*.{md,json,yml,ts,tsx}": "prettier --write"
75+
},
76+
"browserslist": "> 0.5%, last 2 versions, not dead, IE 11",
77+
"targets": {
78+
"main": {
79+
"optimize": true
80+
}
81+
},
82+
"scripts": {
83+
"prepare": "husky install",
84+
"test": "lint-staged",
85+
"preview": "cd preview/ && rm -rf ../.parcel-cache dist/ && parcel --open",
86+
"pack-preview": "cd preview/ && rm -rf ../.parcel-cache dist/ && parcel build --public-url=. --dist-dir=../docs/preview/",
87+
"pack-docs": "rm -rf docs/ && typedoc source/",
88+
"pack-dist": "rm -rf .parcel-cache/ dist/ && parcel build",
89+
"start": "npm run pack-docs && npm run pack-preview && web-server docs/ -p 8080 -o",
90+
"build": "npm run pack-docs && npm run pack-preview && npm run pack-dist",
91+
"prepublishOnly": "npm test && npm run build"
92+
}
93+
}

0 commit comments

Comments
 (0)