@sutech_jp/raas-react-client 0.1.26 → 0.1.28

package/dist/types/index.d.ts

@@ -1,5 +1,6 @@
 import { ThemeOptions } from './theme';
 export { ThemeOptions, PaletteOptions, TypographyOptions, ColorOptions, Grayscale, TypographyVariants } from './theme';
+export type { ItemValue, ObjectValue, ArrayValue, BusinessData, ComponentOptions, CustomValidationResult, } from './webform';
 export declare type Layout = any;
 export declare type CustomData = any[];
 export declare type ReportOptions = any[];

package/dist/types/webform.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+export declare type ItemValue = string | number | boolean | Date | null;
+export declare type ObjectValue = {
+    [key: string]: ItemValue | ObjectValue | ArrayValue;
+};
+export declare type ArrayValue = ObjectValue[];
+export declare type BusinessData = ObjectValue;
+export declare type ComponentOptions = {
+    requiredMark?: ReactNode;
+    showReportOutputButton?: boolean;
+};
+export declare type CustomValidationResult = {
+    error: boolean;
+    message?: string;
+};

package/dist/types/webform.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/webform/ReportWebForm.d.ts

@@ -0,0 +1,20 @@
+import { VFC } from 'react';
+import { BusinessData, CustomValidationResult, ComponentOptions, ItemValue } from 'src/types/webform';
+import { Session } from '../types';
+import { ThemeOptions } from '../types/theme';
+declare type Props = {
+    session: Session | undefined;
+    width?: string | number;
+    height?: string | number;
+    customStyles?: ThemeOptions;
+    title?: string;
+    layoutId: number;
+    values?: BusinessData;
+    fileName?: string;
+    options?: ComponentOptions;
+    validateCustom?: (property: string, rowIndex: number | undefined, value: ItemValue, values: BusinessData) => CustomValidationResult;
+    onChange?: (property: string, rowIndex: number | undefined, value: ItemValue, values: BusinessData) => void;
+    onGenerate?: (logId: string) => void;
+};
+export declare const ReportWebForm: VFC<Props>;
+export {};

package/dist/webform/ReportWebForm.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReportWebForm = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var targetOrigin_1 = require("../util/targetOrigin");
+var ReportWebForm = function (_a) {
+    var session = _a.session, _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.height, height = _c === void 0 ? '100%' : _c, customStyles = _a.customStyles, title = _a.title, layoutId = _a.layoutId, values = _a.values, fileName = _a.fileName, options = _a.options, validateCustom = _a.validateCustom, onChange = _a.onChange, onGenerate = _a.onGenerate;
+    var iframe = (0, react_1.useRef)(null);
+    var handleMessage = (0, react_1.useCallback)(function (e) {
+        var _a;
+        if ((0, targetOrigin_1.getTargetOrigin)(session === null || session === void 0 ? void 0 : session.newUrl) !== '*' && e.origin !== (0, targetOrigin_1.getTargetOrigin)(session === null || session === void 0 ? void 0 : session.newUrl)) {
+            return;
+        }
+        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;
+        if (from !== 'webform') {
+            return;
+        }
+        if (action === 'onAuthorized') {
+            var iframeWindow = (_a = iframe.current) === null || _a === void 0 ? void 0 : _a.contentWindow;
+            if (!iframeWindow)
+                return;
+            iframeWindow.postMessage({
+                from: 'webformClient',
+                action: 'onShow',
+                props: {
+                    customStyles: customStyles,
+                    title: title,
+                    layoutId: layoutId,
+                    values: values,
+                    fileName: fileName,
+                    options: options,
+                },
+            }, (0, targetOrigin_1.getTargetOrigin)(session === null || session === void 0 ? void 0 : session.newUrl));
+        }
+        else if (action === 'validateCustom') {
+            var _b = message.payload, property = _b.property, rowIndex = _b.rowIndex, value = _b.value, values_1 = _b.values;
+            validateCustom === null || validateCustom === void 0 ? void 0 : validateCustom(property, rowIndex, value, values_1);
+        }
+        else if (action === 'onChange') {
+            var _c = message.payload, property = _c.property, rowIndex = _c.rowIndex, value = _c.value, values_2 = _c.values;
+            onChange === null || onChange === void 0 ? void 0 : onChange(property, rowIndex, value, values_2);
+        }
+        else if (action === 'onGenerate') {
+            var logId = message.payload;
+            onGenerate === null || onGenerate === void 0 ? void 0 : onGenerate(logId);
+        }
+    }, [customStyles, fileName, layoutId, onChange, onGenerate, options, session === null || session === void 0 ? void 0 : session.newUrl, title, validateCustom, values]);
+    (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: "webform", src: session === null || session === void 0 ? void 0 : session.newUrl, style: { width: width, height: height, border: 0 } });
+};
+exports.ReportWebForm = ReportWebForm;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sutech_jp/raas-react-client",
-  "version": "0.1.26",
+  "version": "0.1.28",
   "description": "react client for raas produced by SuTech",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",