@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
42 lines • 2.41 kB
JavaScript
import { removeFpsSpService } from '@mikezimm/fps-core-v7/lib/components/molecules/source-props/createSources/cloneSourceProps';
import * as React from 'react';
import { useState, useEffect } from 'react';
/**
* Builds ReactJson object with FPS Defaults
* @param props
* @returns
*/
const FPSReactJSON2Hook = (props) => {
const [ReactJsonView, setReactJsonView] = useState(null);
useEffect(() => {
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/@microlink/react-json-view@1.21.0/dist/main.min.js'; // Adjust version if needed
script.async = true;
script.onload = () => {
console.log('React JSON Viewer dynamically loaded');
setReactJsonView(window.ReactJsonView); // Access the global ReactJsonView
};
script.onerror = (err) => {
console.error('Failed to load React JSON Viewer:', err);
};
document.body.appendChild(script);
return () => {
document.body.removeChild(script);
};
}, []);
if (!ReactJsonView) {
return React.createElement("div", null, "Loading JSON Viewer...");
}
let jsonObject = typeof props.jsonObject === 'object' ? props.jsonObject : { empty: 'jsonObject is empty or does not exist :)' };
jsonObject = removeFpsSpService(jsonObject);
const collapsed = props.collapsed || false;
const displayDataTypes = props.displayDataTypes !== false; // Default to true
const displayObjectSize = props.displayObjectSize !== false; // Default to true
const enableClipboard = props.enableClipboard !== false; // Default to true
const style = props.style || { padding: '20px 0px' };
const themeJSON = props.theme || 'rjv-default';
const indentWidth = props.indentWidth || 2;
return (React.createElement(ReactJsonView, { src: jsonObject, name: props.name, collapsed: collapsed, displayDataTypes: displayDataTypes, displayObjectSize: displayObjectSize, enableClipboard: enableClipboard, style: style, theme: themeJSON, indentWidth: indentWidth, collapseStringsAfterLength: props.maxStrLength, groupArraysAfterLength: props.arrayGroupSize, quotesOnKeys: props.quotesOnKeys, onAdd: props.onAdd, onDelete: props.onDelete, onEdit: props.onEdit }));
};
export default FPSReactJSON2Hook;
//# sourceMappingURL=ReactJSON2Hook.js.map