(
+ generateServiceMapElements(size)
+ );
+
+ return (
+
- {
- setJson(value);
+ {
+ setElements(generateServiceMapElements(size));
+ setJson('');
}}
- />
+ >
+ Generate service map
+
-
- {
- const item = event?.item(0);
-
- if (item) {
- const f = new FileReader();
- f.onload = (onloadEvent) => {
- const result = onloadEvent?.target?.result;
- if (typeof result === 'string') {
- setJson(result);
- }
- };
- f.readAsText(item);
- }
- }}
+
+ setSize(e.target.valueAsNumber)}
/>
-
- {
- try {
- setElements(JSON.parse(json).elements);
- setSessionJson(json);
- setError(undefined);
- } catch (e) {
- setError(e.message);
- }
- }}
- >
- Render JSON
-
-
+
+
+
+ {
+ setJson(JSON.stringify({ elements }, null, 2));
+ }}
+ >
+ Get JSON
+
-
-
- );
- },
- {
- info: {
- propTables: false,
- source: false,
- text: `
+
+
+
+ {json && (
+
+ )}
+