@sutech_jp/datatraveler-react-client 0.0.4

package/dist/DataTravelerImport.d.ts

@@ -0,0 +1,16 @@
+import { ReactElement } from 'react';
+export declare type DataImportResult<D> = {
+    insert: D[];
+    update: D[];
+    dataImportLogId: string;
+};
+declare type Props<D> = {
+    url: string;
+    googleToken?: string;
+    onImport: (result: DataImportResult<D>) => void;
+    onCancel?: () => void;
+    currentData?: D[];
+    maps?: Record<string, Record<string, number>>;
+};
+export declare const DataTravelerImport: <D>({ url, googleToken, currentData, maps, onImport, onCancel, }: Props<D>) => ReactElement;
+export {};

package/dist/DataTravelerImport.js

@@ -0,0 +1,69 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataTravelerImport = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var DataTravelerImport = function (_a) {
+    var url = _a.url, googleToken = _a.googleToken, _b = _a.currentData, currentData = _b === void 0 ? [] : _b, _c = _a.maps, maps = _c === void 0 ? {} : _c, onImport = _a.onImport, onCancel = _a.onCancel;
+    var iframe = (0, react_1.useRef)(null);
+    var _d = __read((0, react_1.useState)(), 2), width = _d[0], setWidth = _d[1];
+    var _e = __read((0, react_1.useState)(), 2), height = _e[0], setHeight = _e[1];
+    var handleMessage = (0, react_1.useCallback)(function (e) {
+        var _a;
+        var message = e.data;
+        var from = message === null || message === void 0 ? void 0 : message.from;
+        var action = message === null || message === void 0 ? void 0 : message.action;
+        var payload = message === null || message === void 0 ? void 0 : message.payload;
+        if (from !== 'dataTraveler') {
+            return;
+        }
+        if (action === 'onAuthorized') {
+            var iframeWindow = (_a = iframe.current) === null || _a === void 0 ? void 0 : _a.contentWindow;
+            if (!iframeWindow)
+                return;
+            iframeWindow.postMessage({
+                from: 'dataTravelerClient',
+                action: 'onShow',
+                currentData: currentData,
+                maps: maps,
+                useCancel: !!onCancel,
+                googleToken: googleToken,
+            }, '*');
+        }
+        else if (action === 'onImport') {
+            onImport(payload);
+        }
+        else if (action === 'onCancel') {
+            onCancel && onCancel();
+        }
+        else if (action === 'onPageChange') {
+            setWidth(message === null || message === void 0 ? void 0 : message.width);
+            setHeight(message === null || message === void 0 ? void 0 : message.height);
+        }
+    }, [googleToken, currentData, maps, onImport, onCancel]);
+    (0, react_1.useEffect)(function () {
+        window.addEventListener('message', handleMessage);
+        return function () { return window.removeEventListener('message', handleMessage); };
+    }, [handleMessage]);
+    return ((0, jsx_runtime_1.jsx)("iframe", { ref: iframe, id: "datatraveler", name: "datatraveler", frameBorder: '0', src: url, style: {
+            width: width || '800px',
+            height: height || '300px',
+        } }));
+};
+exports.DataTravelerImport = DataTravelerImport;

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './DataTravelerImport';

package/dist/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DataTravelerImport"), exports);

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@sutech_jp/datatraveler-react-client",
+  "version": "0.0.4",
+  "description": "react client for data traveler produced by SuTech",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "author": "sutech",
+  "license": "ISC",
+  "scripts": {
+    "test": "jest",
+    "watch": "tsc -w",
+    "build": "rimraf dist&&tsc",
+    "prepublishOnly": "npm run build&&npm version patch",
+    "lint:fix": "eslint --fix \"./{src,test}/**/*.{tsx,ts,js}\" --ignore-path .gitignore",
+    "format": "prettier --write \"./{src,test}/**/*.{tsx,ts,js}\" --ignore-path .gitignore",
+    "precommit": "npm run format && npm run lint:fix"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "npm run precommit"
+    }
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "@testing-library/dom": "^8.11.1",
+    "@testing-library/jest-dom": "^5.15.1",
+    "@testing-library/react": "^12.1.2",
+    "@testing-library/user-event": "^13.5.0",
+    "@types/jest": "^27.4.0",
+    "@types/node": "^16.9.4",
+    "@typescript-eslint/eslint-plugin": "^4.31.2",
+    "@typescript-eslint/parser": "^4.31.2",
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.24.2",
+    "eslint-plugin-jest-dom": "^3.9.2",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.26.1",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-testing-library": "^5.0.1",
+    "husky": "^4.3.8",
+    "jest": "^27.5.1",
+    "prettier": "^2.2.1",
+    "rimraf": "^3.0.2",
+    "ts-jest": "^27.0.7",
+    "typescript": "^4.4.3"
+  },
+  "peerDependencies": {
+    "@types/react": "^17.0.0 || ^18.0.0",
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@types/react": {
+      "optional": true
+    }
+  }
+}