Add lerna-lite & npm workspaces

.eslintrc.cjs

@@ -9,7 +9,7 @@ module.exports = {
   parserOptions: {
     project: './tsconfig.json',
   },
-  ignorePatterns: ['/dist/*'],
+  ignorePatterns: [ '**/dist/*' ],
 
   rules: {
     'no-console': 'off',

.github/workflows/deploy.yml

@@ -38,15 +38,16 @@ jobs:
         if: github.event_name == 'release'
         with:
           name: web
-          path: dist/web/
+          path: ./modules/web/dist/
 
       - uses: actions/upload-artifact@v3
         if: github.event_name == 'release'
         with:
           name: lib
           path: |
-            ./
+            ./modules/opendata-editor/
             !./node_modules/**/*
+            !./modules/opendata-editor/node_modules/**/*
 
   deploy:
     needs:
@@ -74,15 +75,15 @@ jobs:
       - uses: actions/download-artifact@v3
         with:
           name: web
-          path: dist/web/
+          path: ./modules/web/dist/
 
       - name: Setup Pages
         uses: actions/configure-pages@v3
 
       - name: Upload to GitHub Pages
         uses: actions/upload-pages-artifact@v1
         with:
-          path: dist/web/
+          path: ./modules/web/dist/
 
       - name: Deploy to GitHub Pages
         id: deployment
@@ -97,7 +98,7 @@ jobs:
       - uses: actions/download-artifact@v3
         with:
           name: lib
-          path: ./
+          path: ./modules/opendata-editor/
       - uses: actions/setup-node@v3
         with:
           node-version: 18

.gitignore

@@ -1,19 +1,19 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies
-/node_modules
+node_modules
 /.pnp
 .pnp.js
 
 # testing
 /coverage
-/web/public/test.csv
+/modules/web/public/test.csv
 
 # production
-/dist/
+dist/
 
 # misc
-/tmp/
+tmp/
 
 .DS_Store
 .env.local
@@ -24,3 +24,6 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+# Avoid creating package-lock.json under each module directories
+modules/**/package-lock.json

README.md

@@ -40,6 +40,7 @@ npm install @geolonia/opendata-editor
 
 ```typescript
 import { OpenDataEditor } from '@geolonia/opendata-editor';
+import '@geolonia/opendata-editor/style.css';
 
 export const Page = (): JSX.Element => {
   return (

lerna.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "node_modules/@lerna-lite/cli/schemas/lerna-schema.json",
+  "version": "1.1.1",
+  "useWorkspaces": true,
+  "packages": [ "modules/*" ]
+}

modules/opendata-editor/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "@geolonia/opendata-editor",
+  "version": "1.1.1",
+  "homepage": "https://geolonia.github.io/opendata-editor/",
+  "type": "module",
+  "files": [
+    "dist",
+    "src",
+    "LICENSE.txt"
+  ],
+  "main": "./dist/opendata-editor.cjs",
+  "module": "./dist/opendata-editor.js",
+  "exports": {
+    ".": {
+      "import": {
+        "default": "./dist/opendata-editor.js",
+        "types": "./dist/types/OpenDataEditor.d.ts"
+      },
+      "require": "./dist/opendata-editor.cjs"
+    },
+    "./style.css": {
+      "import": "./dist/style.css",
+      "require": "./dist/style.css"
+    }
+  },
+  "types": "./dist/types/OpenDataEditor.d.ts",
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "vite build",
+    "test": "vitest run"
+  },
+  "dependencies": {
+    "@fortawesome/free-solid-svg-icons": "^6.2.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
+    "buffer": "^6.0.3",
+    "encoding-japanese": "^2.0.0",
+    "papaparse": "^5.3.2",
+    "react": "^18.2.0",
+    "react-contexify": "^6.0.0",
+    "react-data-grid": "7.0.0-beta.40",
+    "react-dom": "^18.2.0",
+    "react-dropzone": "^14.2.2",
+    "react-router-dom": "^6.3.0",
+    "read-excel-file": "^5.6.1",
+    "styled-components": "^6.0.7",
+    "ulid": "^2.3.0",
+    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.0/xlsx-0.20.0.tgz"
+  },
+  "devDependencies": {
+    "@geolonia/embed": "^4.0.0",
+    "@types/encoding-japanese": "^2.0.1",
+    "@types/node": "^20.10.3",
+    "@types/papaparse": "^5.3.5",
+    "@types/react": "^18.0.18",
+    "@types/react-dom": "^18.0.6",
+    "@vitejs/plugin-react": "^4.0.4",
+    "maplibre-gl": "^3.3.1",
+    "typescript": "^5.1.6",
+    "vite": "^5.0.5",
+    "vite-plugin-dts": "^3.4.0",
+    "vitest": "^1.0.1"
+  }
+}

test/csv2geojson.test.ts → modules/opendata-editor/test/csv2geojson.test.ts

@@ -1,5 +1,5 @@
 import { expect, test } from 'vitest';
-import { csv2geojson } from '../lib/utils/csv2geojson';
+import { csv2geojson } from '../src/utils/csv2geojson';
 
 const data = `都道府県コード又は市区町村コード,NO,都道府県名,市区町村名,名称,名称_カナ,名称_通称,POIコード,住所,方書,緯度,経度,電話番号,内線番号,法人番号,団体名,利用可能曜日,開始時間,終了時間,利用可能時間特記事項,説明,バリアフリー情報,URL,備考
 304280,1,和歌山県,串本町,橋杭公衆トイレ,ハシグイコウシュウトイレ,,2101,和歌山県東牟婁郡串本町くじの川,,33.492024,135.790637,,,,,月火水木金土日,,,終日利用可能,,,,

vite.config.lib.ts → modules/opendata-editor/vite.config.ts

@@ -8,9 +8,9 @@ const deps = Object.keys(dependencies).concat(Object.keys(devDependencies));
 
 export default defineConfig({
   build: {
-    outDir: resolve(__dirname, 'dist/lib'),
+    outDir: resolve(__dirname, 'dist'),
     lib: {
-      entry: resolve(__dirname, 'lib/OpenDataEditor.tsx'),
+      entry: resolve(__dirname, 'src/OpenDataEditor.tsx'),
       name: 'OpenDataEditor',
       fileName: 'opendata-editor',
       formats: ['es', 'cjs'],
@@ -22,8 +22,8 @@ export default defineConfig({
   plugins: [
     react(),
     dts({
-      outDir: resolve(__dirname, 'dist/lib/types'),
-      entryRoot: resolve(__dirname, 'lib'),
+      outDir: resolve(__dirname, 'dist/types'),
+      entryRoot: resolve(__dirname, 'src'),
     }),
   ],
 });

index.html → modules/web/index.html

@@ -11,6 +11,6 @@
     <div id="root"></div>
 
     <script type="text/javascript" src="https://cdn.geolonia.com/v1/embed?geolonia-api-key=YOUR-API-KEY"></script>
-    <script src="./web/index.tsx" type="module"></script>
+    <script src="./src/index.tsx" type="module"></script>
   </body>
 </html>

modules/web/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@geolonia/opendata-editor-web",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "test": "playwright test",
+    "postinstall": "if npm list @playwright/test; then playwright install; fi"
+  },
+  "dependencies": {
+    "@geolonia/opendata-editor": "^1.1.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.38.1",
+    "@types/node": "^20.10.3",
+    "@types/react": "^18.0.18",
+    "@types/react-dom": "^18.0.6",
+    "@vitejs/plugin-react": "^4.0.4",
+    "looks-same": "^9.0.0",
+    "typescript": "^5.1.6",
+    "undici": "^6.0.0",
+    "vite": "^5.0.5"
+  }
+}

playwright.config.ts → modules/web/playwright.config.ts

@@ -20,7 +20,7 @@ export default {
   ],
 
   webServer: {
-    command: 'npx vite --config ./vite.config.web.ts --port 2923',
+    command: 'npx vite --port 2923',
     url: 'http://localhost:2923/opendata-editor/',
     timeout: 120 * 1000,
     reuseExistingServer: !process.env.CI,

web/index.tsx → modules/web/src/index.tsx

@@ -2,7 +2,8 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 
 import './index.css';
-import { OpenDataEditor } from '../lib/OpenDataEditor';
+import { OpenDataEditor } from '@geolonia/opendata-editor';
+import '@geolonia/opendata-editor/style.css';
 
 const root = ReactDOM.createRoot(
   document.getElementById('root') as HTMLElement,

test/e2e.pw.ts → modules/web/test/e2e.pw.ts

@@ -10,7 +10,7 @@ const __dirname = dirname(fileURLToPath(import.meta.url));
 const pageURL = '/?data=http://localhost:2923/opendata-editor/test.csv&debug=1';
 
 test.beforeAll(async () => {
-  await copyFile(join(__dirname, './fixtures/data.csv'), join(__dirname, '../web/public/test.csv'));
+  await copyFile(join(__dirname, './fixtures/data.csv'), join(__dirname, '../public/test.csv'));
 });
 
 test('if table is properly displayed when data is given by URL', async ({ page }) => {

vite.config.web.ts → modules/web/vite.config.ts

@@ -4,12 +4,11 @@ import react from '@vitejs/plugin-react';
 
 export default defineConfig({
   build: {
-    outDir: resolve(__dirname, 'dist/web'),
+    outDir: resolve(__dirname, 'dist'),
   },
   server: {
     port: 3000,
   },
   plugins: [react()],
-  publicDir: resolve(__dirname, 'web/public'),
   base: process.env.NODE_ENV === 'preview' ? '/' : '/opendata-editor/',
 });