@sutech_jp/raas-react-client 0.0.15 → 0.0.17

package/dist/designer/ReportDesigner.d.ts

@@ -2,7 +2,9 @@ import { VFC } from 'react';
 declare type Props = {
     url: string;
     data?: Record<string, any>;
-    backUrl?: string;
+    width?: string | number;
+    height?: string | number;
+    onBack: () => void;
 };
 export declare const ReportDesigner: VFC<Props>;
 export {};

package/dist/designer/ReportDesigner.js

@@ -4,7 +4,7 @@ exports.ReportDesigner = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var ReportDesigner = function (_a) {
-    var url = _a.url, data = _a.data, backUrl = _a.backUrl;
+    var url = _a.url, data = _a.data, _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.height, height = _c === void 0 ? '100%' : _c, onBack = _a.onBack;
     var iframe = (0, react_1.useRef)(null);
     var handleMessage = (0, react_1.useCallback)(function (e) {
         var _a;
@@ -21,15 +21,17 @@ var ReportDesigner = function (_a) {
             iframeWindow.postMessage({
                 from: 'designerClient',
                 action: 'onRender',
-                backUrl: backUrl,
                 data: data,
             }, '*');
         }
-    }, [backUrl, data]);
+        else if (action === 'onBack') {
+            onBack();
+        }
+    }, [data, onBack]);
     (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: "designer", src: url, style: { minWidth: '100%', height: '100vh', border: 0 } });
+    return (0, jsx_runtime_1.jsx)("iframe", { ref: iframe, id: "designer", src: url, style: { width: width, height: height, border: 0 } });
 };
 exports.ReportDesigner = ReportDesigner;

package/dist/form/ReportPaperForm.d.ts

@@ -1,3 +1,3 @@
 import { ReactElement } from 'react';
 import { ReportPaperFormProps } from '../types';
-export declare const ReportPaperForm: <D>({ url, layoutId, data, onDataUpdate, customData, onCustomDataUpdate, onRender, reportOptions, layout, onLayoutUpdate, editability, layoutEditable, version, }: ReportPaperFormProps<D>) => ReactElement;
+export declare const ReportPaperForm: <D>({ url, layoutId, data, onDataUpdate, customData, onCustomDataUpdate, onRender, reportOptions, layout, onLayoutUpdate, editability, layoutEditable, version, width, height, }: ReportPaperFormProps<D>) => ReactElement;

package/dist/form/ReportPaperForm.js

@@ -31,10 +31,10 @@ exports.ReportPaperForm = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var ReportPaperForm = function (_a) {
-    var url = _a.url, layoutId = _a.layoutId, data = _a.data, onDataUpdate = _a.onDataUpdate, customData = _a.customData, onCustomDataUpdate = _a.onCustomDataUpdate, onRender = _a.onRender, reportOptions = _a.reportOptions, layout = _a.layout, onLayoutUpdate = _a.onLayoutUpdate, _b = _a.editability, editability = _b === void 0 ? 'none' : _b, _c = _a.layoutEditable, layoutEditable = _c === void 0 ? false : _c, version = _a.version;
-    var _d = __read((0, react_1.useState)('unauthorized'), 2), formState = _d[0], setFormState = _d[1];
-    var _e = __read((0, react_1.useState)(), 2), contentHeight = _e[0], setContentHeight = _e[1];
-    var _f = __read((0, react_1.useState)(false), 2), layoutInitialized = _f[0], setLayoutInitialized = _f[1];
+    var url = _a.url, layoutId = _a.layoutId, data = _a.data, onDataUpdate = _a.onDataUpdate, customData = _a.customData, onCustomDataUpdate = _a.onCustomDataUpdate, onRender = _a.onRender, reportOptions = _a.reportOptions, layout = _a.layout, onLayoutUpdate = _a.onLayoutUpdate, _b = _a.editability, editability = _b === void 0 ? 'none' : _b, _c = _a.layoutEditable, layoutEditable = _c === void 0 ? false : _c, version = _a.version, _d = _a.width, width = _d === void 0 ? '100%' : _d, height = _a.height;
+    var _e = __read((0, react_1.useState)('unauthorized'), 2), formState = _e[0], setFormState = _e[1];
+    var _f = __read((0, react_1.useState)(), 2), contentHeight = _f[0], setContentHeight = _f[1];
+    var _g = __read((0, react_1.useState)(false), 2), layoutInitialized = _g[0], setLayoutInitialized = _g[1];
     var iframe = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(function () {
         var _a;
@@ -115,8 +115,8 @@ var ReportPaperForm = function (_a) {
         return function () { return window.removeEventListener('message', handleMessage); };
     }, [handleMessage]);
     return ((0, jsx_runtime_1.jsx)("iframe", { ref: iframe, id: "paper-form", name: "paperForm", src: url, style: {
-            minWidth: '100%',
-            height: "".concat(contentHeight ? contentHeight + 10 : 240, "px"),
+            width: width,
+            height: height !== null && height !== void 0 ? height : "".concat(contentHeight ? contentHeight + 10 : 240, "px"),
             border: 0,
         } }));
 };

package/dist/form/useReportPaperForm.d.ts

@@ -5,7 +5,7 @@ declare type Ret<D> = {
     hasRequiredBlank: boolean;
     onInitialize: (data: D) => void;
     onReset: () => void;
-    paperFormArgs: Required<PaperFormArgs<D>>;
+    paperFormArgs: PaperFormArgs<D>;
     generatePdfArgs: {
         data: D;
         customData: CustomData;
@@ -16,6 +16,8 @@ declare type Ret<D> = {
 declare type Options = {
     editability?: UserEditability;
     layoutEditable?: boolean;
+    width?: string | number;
+    height?: string | number;
 };
 export declare const useReportPaperForm: <D>(initialData: D, options?: Options) => Ret<D>;
 export {};

package/dist/form/useReportPaperForm.js

@@ -76,6 +76,8 @@ var useReportPaperForm = function (initialData, options) {
             onRender: onRender,
             editability: (options === null || options === void 0 ? void 0 : options.editability) || 'none',
             layoutEditable: (options === null || options === void 0 ? void 0 : options.layoutEditable) || false,
+            width: options === null || options === void 0 ? void 0 : options.width,
+            height: options === null || options === void 0 ? void 0 : options.height,
             version: version,
         },
         generatePdfArgs: {

package/dist/gallery/ReportLayoutGallery.d.ts

@@ -1,6 +1,8 @@
 import { FC } from 'react';
 declare type LayoutGalleryProps = {
     url: string;
+    width?: string | number;
+    height?: string | number;
     onSelectLayout: (layoutId: number) => void;
 };
 export declare const ReportLayoutGallery: FC<LayoutGalleryProps>;

package/dist/gallery/ReportLayoutGallery.js

@@ -4,7 +4,7 @@ exports.ReportLayoutGallery = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var ReportLayoutGallery = function (_a) {
-    var url = _a.url, onSelectLayout = _a.onSelectLayout;
+    var url = _a.url, _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.height, height = _c === void 0 ? '100%' : _c, onSelectLayout = _a.onSelectLayout;
     var handleMessage = (0, react_1.useCallback)(function (e) {
         var _a, _b, _c;
         if (((_a = e.data) === null || _a === void 0 ? void 0 : _a.from) === 'gallery' && ((_b = e.data) === null || _b === void 0 ? void 0 : _b.action) === 'selectLayout') {
@@ -15,6 +15,6 @@ var ReportLayoutGallery = function (_a) {
         window.addEventListener('message', handleMessage);
         return function () { return window.removeEventListener('message', handleMessage); };
     }, [handleMessage]);
-    return (0, jsx_runtime_1.jsx)("iframe", { id: "gallery", src: url, style: { width: '100%', height: 'calc(100vh/1.5)', border: 0 } });
+    return (0, jsx_runtime_1.jsx)("iframe", { id: "gallery", src: url, style: { width: width, height: height, border: 0 } });
 };
 exports.ReportLayoutGallery = ReportLayoutGallery;

package/dist/types/index.d.ts

@@ -22,6 +22,8 @@ export declare type PaperFormArgs<D> = {
     reportOptions?: ReportOptions;
     editability?: UserEditability;
     version: number;
+    width?: string | number;
+    height?: string | number;
 } & (LayoutEditable | LayoutNotEditable);
 export declare type ReportPaperFormProps<D> = {
     url: string;

package/package.json

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